Tonbrand Software

Contents of the HTML-Optimizer Pro Manual for Mac OS X

Introduction

HTML-Optimizer Pro checks your web pages for dangling tags, missing attributes and broken links. It makes your pages load faster by optimizing both HTML and script code.
Your original web folder remains untouched. It is duplicated and changes are only made to this duplicate, unless you choose otherwise - see below.
HTML-Optimizer Pro features Smart Handling and is XML-ready.

This is the display area where you see the Progress Bar, the Stop button etc. When using the application the Log and Text Fields will appear here. This is the control area where you find the button groups for using the application. Note the text just above the View Code button which is a hint that refers to the current state. You can also use this text area as a drop spot for files to be handled. Left below you see the Web Folder popup menu for easy switching between web folders.

Back to top

HTML-Optimizer Pro offers 4 functions:

1. The main function is optimizing, i.e. saving space on your web pages by removing unnecessary characters and tags. Most HTML Editors add these things for their own purpose and to make the code easier to read for the user, but for your visitor's browser it's less pleasant.
Though the savings percentage may seem small, load time savings is much higher as a browser parses the pages more efficient. This program does NOT remove quotation marks from attribute values and hyperlink strings - as some other optimizers do to get impressive savings - because this would actually slow down the browser's parsing speed and - moreover - violate the W3C HTML rules!
See 'About Optimizing' for details on the optimizing process.

2. Another function is to check the tagged pair structure of your web pages. Dangling tags will be reported. IMG tags are checked for the presence of the Width, Height and Alt attributes. AREA tags are checked for the presence of Alt attributes as well.
The Width and Height attributes are needed by the browser to build the page as fast as possible. You can choose to add missing Width and Height attributes with their pixel values.
The Alt attributes make your page user-friendlier for those visitors who have turned off picture display in their browser's preferences. You can decide to add missing Alt attributes to IMG and AREA tags and attach either a text string or the name of the image. As text string you could use "FindMe" to enable you to easily find and replace a string by a more meaningful caption. HTML-Optimizer Pro has a Find function for this task.

Obsolete and browser-dependent tags are reported and you can choose to check for deprecated tags like <FONT> or <CENTER>.

IMPORTANT: By default, checked pages are saved to the duplicate web folder in case changes were made. Note that this may overwrite an existing optimized page, so remember that your last action must always be 'Optimize'. Instead you may choose to include any changes on the fly while optimizing, by checking one or more of the 'Add ...' checkboxes in the Optimizing Options section in Preferences.
If you wish for changes to be saved to your original web folder, then check the Save Changes to Original Web Folder checkbox in Preferences but make sure that you have a backup of your web folder before proceeding.
Tags in script code are not checked because of the mostly dynamic nature of this code.

3. The fourth function is checking the validity of your hyperlinks, excluding those that start with "http://" or "mailto:". Your pages are checked for broken 'href' and 'img src' links. Absolute links are checked for their whole path and relative links are checked for the presence of the file they point at.
Links in script code are not checked because of the mostly dynamic nature of this code.
If you think that some links are wrongly flagged, you may choose Recount Files for Link Checking from the Extra menu.

4. Finally, you can convert special characters to their appropriate notation; all within the ASCII 128 to 255 range. You can choose between the notation with only numbers that is now mostly used, or the notation that still uses entity names. The number notation does not use hexadecimal numbers.
The 'IMPORTANT' note in (2) also applies here.

Back to top

Smart Handling

HTML-Optimizer Pro features an option called Smart Handling. If you have a large web folder you can check or optimize only the pages that have been changed. For example, you have a web site consisting of 500 pages and you have worked on let's say 25 pages. You would not like to check and optimize all 500. Instead, you turn on Smart Handling, choose Entire Web Folder and start. Now only those 25 out of 500 pages are processed. This can be a significant timesaving.

In Preferences you can choose between 'date+time' and 'date (today)'. If you choose 'today', a file may be handled more than once during that day, else it's only handled once.

The checkbox 'Restore Modification Date' in Preferences will be checked and disabled when you turn Smart Handling on. In fact, before you can take advantage of this feature, you must optimize your entire web folder with 'Restore Modification Date' checked.

The Smart Handling checkbox is disabled when you have chosen to check or optimize one file. Neither does it work when you drag and drop files. The Smart Handling feature is only effective if you choose Folder or Entire Web Folder.

About Optimizing

During the optimizing process, your original pages remain untouched for later editing, which is quite useful since optimized pages are hard to read for humans (unless you have turned off 'Remove Returns' in Preferences).
Optimized web pages are written to your duplicate web folder that is in the Optimizer Output folder which in turn is by default placed in the same folder where your web folder resides. Later you can always relocate the Optimizer Output folder - see the Configure menu.

Your duplicate web folder has its name spelled in CAPITALS to distinguish it from your original. This makes browsing in order to select it easier. For technical reasons the program requires that the name of the duplicate folder stays the same as the original. If you check or optimize a file or folder not belonging to any web folder, it will be written directly to the Optimizer Output folder.

WARNING: Do not open an optimized web page with the HTML Editor that originally created it! This will undo most of the optimizing because the Editor adds its own formatting again!

HTML-Optimizer Pro removes the following tags by default:
   Optional end tags such as </OPTION> (but not from XHTML or XML files in which end tags are not optional any more).
   Forbidden end tags such as </IMG>
   Redundant Editor tags such as "naturalsizeflag"
   Meta Generator tags.

The following characters are removed by default:
   Carriage returns from Mac, Windows or Unix files (CRs, CRLFs and LFs)
   Tabs
   Multiple whitespace
   Redundant whitespace

Code between these tags is dealt with separate from the main code:
   <SCRIPT> and </SCRIPT>
   <SERVER> and </SERVER>
   <APPLET> and </APPLET>
   <STYLE> and </STYLE>
   <OBJECT> and </OBJECT>
   <PRE> and </PRE>
   <NOOP> and </NOOP>
   <? and ?>

The <? and ?> tags can enclose new lassoscript or php code or any other code that follows the same basic syntax.

The <NOOP> and </NOOP> custom tags - "NOOP" means No Optimizing - can be applied by you to enclose a certain HTML code block that you don't want to be touched. You should not nest the NOOP tags within any of the tags listed above, neither should the code block to be ignored contain any of the tags listed above. The NOOP tags will not appear in the optimized file.

Under the Filters tab of the Preferences window you can indicate which subfolders in your web folder should not be handled by HTML-Optimizer Pro. Some HTML Editors, for example Dreamweaver, save data in specific folders that should not be optimized. Note that the text field in which you enter the names of those folders is case sensitive - this can turn out to be handy if you manage different web sites.

Comments in HTML code and script code can be removed by choice. Comments that start with <!--#, for example Apache SSI comments, will not be removed.

Optimization of script and removing script comments can not only be executed on client-side scripts (between <SCRIPT> and </SCRIPT> tags) but also on server-side scripts between <SERVER> and </SERVER> tags and between <? and ?> tags in files with the .lasso or .php suffix, for example.

Incomplete URLs like "http://www.xyz.com" can be qualified; i.e. they will get a slash at the end that makes it twice as fast for a browser to go to that URL.

Be careful with the option to remove spurious white space as this could also remove required space in certain cases.

Note that there are actions that you can perform separately, like converting special characters or adding missing attributes, but that you can also do on the fly while optimizing - see the Optimizing Options in the Preferences.
It is important that you realize that including these actions will slow down the optimizing process a little bit, but that doing it separately means that you have to copy the changed pages back to your original web folder before you can optimize them. If your Mac OS supports color labels, you could label the pages to recognize them; otherwise you have to consult the Log to see which pages were changed. If you don't want this whole concern, then check the 'Save Changes to Original Web Folder' checkbox in Preferences but make sure that you have a backup of your web folder.

Back to top

The Log

Optimized, checked or converted files appear in the Log Display. They belong either to the duplicate or the original web folder, but this is always indicated in the Log's heading when you select a particular file in the Log. Optimized pages are always put in the duplicate web folder. Checked pages without changes made remain in the original web folder. By default, converted and changed pages appear in the duplicate web folder, unless you have chosen to save the changes to the original file. Don't worry, it's always indicated. However, to avoid confusion you should know the following:

If you have checked pages for dangling tags and missing attributes and also chosen to add missing attributes, then you may see a certain page mentioned in the Log on more than one line. If one line says that a dangling tag is found and you select that line, you will see that the file is in the original web folder, but if you select the next line saying that an attribute was added, you may see that the same file is in the duplicate web folder! Don't worry, they are in fact and if you would make a change to either one of them - by using the Edit menu commands - then you would be prompted to save the file to the appropriate destination. This may all sound rather complicated, but if you are actually doing things like mentioned here, you will find out that it's rather easy.

The View Code and View Page buttons are used by selecting a file in the Log, i.e. clicking on its line in the Log.

When you have checked tags or links, a horizontal scroll bar is added to the Log to enable you to vary the two column widths. Adjust to your preference.

The History Log button enables you to see what you have done in the past. The dates are included.
Note that you can't edit files when they're called from the History Log. Neither can you sort by column. In that case you can only use Select, Find and Copy commands.

The Log Display can show a practically unlimited number of lines, but you will be prompted when the History Log gets so full that performance would slow down, so that you may empty it by choosing Purge Log from the File menu. The Logs are located in the HTML-Optimizer Pro Logs folder that is in the Preferences folder.

Back to top

The Configure menu

From the Configure menu you can add web folders to the Web Folder popup menu, as many as you want. You can also remove them, of course. When you have several web folders added, you will find that it's very comfortable to work with them. When you work with web folder A and you choose - by accident - a file from web Folder B, you are prompted and Web Folder B is automatically made the current one. This also works when you drop files on the program's special drop spot.

The Choose Browser for Viewing Web Pages command gives you the possibility to select different browsers for viewing your optimized pages.

The Relocate Optimizer Output Folder command allows you to move the entire Optimizer Output folder to another location on the same volume.
If you want to move the Optimizer Output folder to another volume you will be prompted to copy the entire folder. If you agree, you are asked if you want to delete the old folder after the copy process is completed.
Never move the Optimizer Output folder manually.

Should things ever go wrong and corrupt the program's configuration, an easy way out is to choose the Reset Configuration command. After this action you must configure HTML-Optimizer Pro again but your registration data and preferences are remembered. If resetting has not solved the problem, choose the Reset Configuration command again while holding down the Option (Alt) key. The HTML-Optimizer Pro Preferences file will be cleared. Your registration data will be deleted and must be re-entered.
Tip: You can see your registration code if you click on your name in the About... window while holding down the Option key. Of course you must do that before you clear the HTML-Optimizer Pro Preferences file!

Back to top

The Extra menu

This menu offers some commands to manage your duplicate web folder. In fact, this duplicate is very important and it should be the one from which you upload pages to the remote server. It must always be in top condition. To accomplish this you have 3 options at your disposal: updating the directory, updating the contents and synchronizing it with the original web folder. Synchronizing means that if you add or remove a file or a folder from the original web folder, it will also be added to or removed from the duplicate. Should you ever experience that a major change is not fully adopted, then you just execute the Synchronize command again.

The more you change in your original web folder after the duplicate has been made, the more you need to use one of these commands. Synchronizing includes both update commands. It's a good idea to execute the Synchronize command every time you launch the program. In the Preferences you can choose to do that automatically.

Note that when you update your duplicate web folder contents, your optimized web pages are not overwritten, of course. File types that are not handled by HTML-Optimizer Pro, for example graphic files, will be copied to replace older ones, though.

The Recount Files for Link Checking command updates the database that holds all file names. This database is refreshed daily but you might want to update it after you have changed your web folder. That will reduce the risk of wrongly flagged links when checking links.

The Remove Resources from All Files command allows you to delete the resources of all files in the duplicate web folder. In practice this will only concern graphic files. Resources are useless for the Internet so we can safely remove them. Note that the optimized web pages have no resource fork at all.
In the PowerPC version of HTML-Optimizer Pro the whole resource fork is deleted and in the OSX version the resource fork is emptied.
If you execute this command and later you synchronize your duplicate web folder, the resources are all back of course, unless you check the 'Remove Resources from All Files when Synchronizing' checkbox in Preferences.

Back to top

The Select button

The Select button does the obvious: it shows an Open Dialog, with the current web folder as the default directory (in most systems). If you click the 'Entire Web Folder' button, the Select button changes its name into Start. Your entire web folder will then be processed, up to a depth of 8 levels. Of course, you can always safely abort the process by pressing the Stop button.

The Same Again button

If you press this button you start any desired action on the same file or folder that was recently selected or dropped, so you don't need to navigate through an Open dialog again! You can repeat this action for as long as you wish, until you select another file or folder. This button will prove to be very useful when you want to perform consecutive actions on the same file or folder, e.g. checking tags, checking links and finally optimizing - in that order - not a bad way to manage your web site.

Back to top

The View Code button

This button enables you to view the code - also called the source - of a web page. You can do the usual things like Find & Replace and Edit with the ability to save changes. The Save dialog will pop up when you press the Hide Code button after you did make a change. If you choose Save File from the File menu, saving will take place without a Save dialog.
You can choose a page by selecting its line in the Log.
Note that you always open the file that was worked on, so in most cases that will be the duplicate page, but it could also be the original page if you have chosen to save changes to the original web folder when checking tags or converting special characters. Saving changes is also done to the file that was worked on and the Save dialog will mention whether changes are saved to the duplicate or the original file. Moreover, the Log's heading indicates if the selected file belongs to the original or the duplicate web folder or to no web folder at all. So you know what you're dealing with.

The View Page button

This button enables you to view a page in your browser, to make sure that it looks fine after being optimized. You can choose a page by selecting its line in the Log. If you want to check your whole optimized web folder it's best to start with your home page and go from there to the other pages. Because all graphic files are present in the duplicate web folder, you can view the whole page as it is. Now you will appreciate why the duplicate was made in the first place!
Note that you always look at the page that was worked on, in most cases that will be the duplicate page but read what was written on this subject in the previous chapter.

Back to top

The Preferences

The Optimization Options give you flexibility on what to include in the optimization process.

The Preferences window is a very important part of HTML-Optimizer Pro, giving you maximum flexibility without offering obscure options you don't want to be bothered with. Note that Help Tags pop up when you move the pointer to a checkbox or radiobutton and hold it there for a moment.

Back to top

Drag and Drop

The program's main window has a drop spot where you can drag files to. This spot is the block of text above the View Code button. Files that are dropped can be processed again by pressing the Same Again button.

Of course, you can also drop files on the program's icon or its alias, as you would expect. If you do that while the program is not running, it will be launched and the dropped file(s) will be optimized.

The Open Text File menu command

The File menu has an Open Text File menu command that you may find useful in some cases. It turns the program into a simple text editor. The text field can display files that are up to 500 kB in size. Note that the small triangle at the left allows you to make the text field twice as big. You can save text changes directly by choosing Save File from the File menu or via a Save dialog by pressing the Hide Text button.

Limitation if Unregistered

When you start using HTML-Optimizer Pro as a demo, your trial period is limited to 20 days. A countdown timer reminds you at startup and at random intervals when starting an action. When the expiry date approaches you will get a warning when you have only 5 days left, and so on. Please register in time so that you can continue working with HTML-Optimizer Pro without delay.

Back to top