<div id="popup_box_thanks" style="display:none" onClick="close_popup_thanks('popup_box_thanks', 'ts')"><br>Thanks for submitting your tip! All submissions are moderated by an editor before appearing online. We've reset the form so you can enter another tip. Or you can close the tip submission box. <div class="x_close" id="thanks_upper_right"><a href="javascript:void(0)" onmousedown="close_popup_thanks('popup_box_thanks', 'ts'); return true;">Close</a></div></div>
<div class="tbf_row"><div class="tbf_wide_extra_top not_bold">Please submit only technical tips that will help other TidBITS readers better use their Macs, iPhones, and related software and hardware. All product announcements should be sent to <a href="mailto:releases@tidbits.com">releases@tidbits.com</a>.</div></div>
<div class="tbf_left">URL</div><div class="tbf_right"><input type="text" value="" name="tip_link_url" tabindex="3"><span class="tip_description"><br>Enter the URL to a Web page that supports your tip.</span></div>
</div>
<div class="spacer"></div>
<div class="tbf_row">
<div class="tbf_left">Linked text</div><div class="tbf_right"><input type="text" value="" name="tip_link_label" tabindex="4"><span class="tip_description"><br>Enter the name of the page linked above.</span></div>
<div class="tbf_wide"><input type="submit" value="Preview Your Tip" name="preview_tip" onClick="fill_preview('tipbits_enclosure_preview', 'ts', this.form); return false;" tabindex="7"> <input type="submit" value="Send Us Your Tip!" name="submit_this_tip" onClick="handle_tip_submission('ts', '', this.form, 'tip'); return false;" tabindex="8"></div>
</div>
<div class="spacer"></div>
<div class="tbf_row">
<div class="tbf_wide"><span class="fine_print">When you submit a tip, you give us permission to use it. Read <a href="javascript:void(0)" onClick="generic_show_hide('tip_terms')">our terms</a> for more details. All submissions are reviewed before publication.</span></div>
<div class="tbf_wide"><span class="fine_print">Our terms: By submitting a tip, you agree to assign TidBITS Publishing Inc., a non-exclusive, worldwide, perpetual license to reproduce, publish, and distribute your tip in connection with the TidBITS Web site and associated products in any media. You agree that you created the content you submitted, and that you have the right to assign us this license. You give us permission to use your name, but your email address won't be publicly displayed or shared. We review all submissions before publication, and reserve the right to select which submissions we feel are appropriate for our readers and to edit those we publish.</span></div>
<div id="comment_thanks" style="display:none" onClick="close_popup_thanks('comment_thanks', 'comm')"><br>Thanks for submitting a comment! Please check your email for a link that, when clicked, will verify that you're a real person and cause your comment to appear immediately. <div class="x_close" id="comment_upper_right"><a href="javascript:void(0)" onmousedown="close_popup_thanks('comment_thanks', 'comm'); return true;">Close</a></div></div>
<div class="tbf_wide"><span class="fine_print">Our terms: We reserve the right to edit or delete any comment, so please post thoughtfully. We use your email address <i>only</i> to send you a one-time verification message confirming that you posted this comment. We also store your address to allow you to verify using other Web browsers in the future. For more info, see our <a href="http://db.tidbits.com/privacy.html">privacy policy</a>.</span></div>
<li><a href="/feeds/tidbits.rss" title="Subscribe via RSS" class="gettb">RSS <img src="/images/feed-icon-12x12.gif" width="12" height="12" border="0" class="nav_img" alt="Subscribe via RSS"></a></li>
<li><a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewPodcast?id=276986548" title="Subscribe to the podcast" class="gettb">Podcast <img src="/images/feed-icon-12x12_podcast.gif" width="12" height="12" border="0" class="nav_img" alt="Subscribe to the postcast"></a></li>
<li><a href="http://www.twitter.com/TidBITS" title="Get Article Updates via Twitter" class="gettb">Twitter <img src="/images/feed_icon_12x12_twitter.png" width="12" height="12" border="0" class="nav_img" alt="Get Article Updates via Twitter"></a></li>
<li><a href="http://www.facebook.com/pages/TidBITS/195314925519" title="Go to the TidBITS Page at Facebook" class="gettb">Facebook <img src="/images/feed_icon_12x12_facebook.gif" width="12" height="12" border="0" class="nav_img" alt="Go to the TidBITS Page at Facebook"></a></li>
<li><a href="javascript:void(0)" title="Sections" class="tabhead" onClick="return showhide('articleslist')">Sections <span id="articleslist_triangle"><img src="/images/nav_triangle_open.gif" width="9" height="9" border="0" class="navtriangle" id="articleslist_tri_image" alt="Click to show or hide the contents of this section."></span></a></li>
<li><a href="javascript:void(0)" onClick="return showhide('stafflist')" title="Staff" class="tabhead">Staff <span id="stafflist_triangle"><img src="/images/nav_triangle_closed.gif" width="9" height="9" border="0" class="navtriangle" id="stafflist_tri_image" alt="Click to show or hide the contents of this section."></span></a></li>
<li><a href="javascript:void(0)" title="Issues" class="tabhead" onClick="return showhide('issuelist')">Weekly Issues <span id="issuelist_triangle"><img src="/images/nav_triangle_closed.gif" width="9" height="9" border="0" class="navtriangle" id="issuelist_tri_image" alt="Click to show or hide the contents of this section."></span></a></li>
<li><a href="javascript:void(0)" onClick="return showhide('abouttidbits')" title="About TidBITS" class="tabhead">About TidBITS <span id="abouttidbits_triangle"><img src="/images/nav_triangle_closed.gif" width="9" height="9" border="0" class="navtriangle" id="abouttidbits_tri_image" alt="Click to show or hide the contents of this section."></span></a></li>
<div class="center_top">Thoughtful, detailed coverage of the Mac, iPhone, and iPad, plus the best-selling <a href="http://www.takecontrolbooks.com/?pt=TB-TAGLINE" style="color:yellow">Take Control</a> ebooks.</div>
<!-- begin centercolumn -->
<div id="centercolumn">
<!-- begin rightcolumn_container -->
<div id="rightcolumn_container">
<!-- begin rightcolumn -->
<!-- rightcolumn is embedded within centercolumn so featured text wraps around it -->
</div><!-- end tearoffbox_wide_container for watchlist items -->
<!-- begin tearoff box wide -->
<div class="tearoffbox_wide_container">
<div class="tearoffbox_wide_tips">
<div class="tip_display">
<div class="tips_sponsor_logo">
</div>
<h6>Mac OS X Services in Snow Leopard</h6>
<p><p>Mac OS X Services let one application supply its powers to another; for example, a Grab service helps TextEdit paste a screenshot into a document. Most users either don't know that Services exist, because they're in an obscure hierarchical menu (ApplicationName > Services), or they mostly don't use them because there are so many of them.</p><p>Snow Leopard makes it easier for the uninitiated to utilize this feature; only services appropriate to the current context appear. And in addition to the hierarchical menu, services are discoverable as custom contextual menu items - Control-click in a TextEdit document to access the Grab service, for instance.</p><p>In addition, the revamped Keyboard preference pane lets you manage services for the first time ever. You can enable and disable them, and even change their keyboard shortcuts.</p></p>
</div>
<div class="tearoffbox_wide_bottom_tips">
<div style="padding-bottom:35px"><div class="tip_display" style="float:left"><p><br><a href="/tipbits/194">Link to this tip</a></p></div><div class="tip_display" style="float:right; width:150px">
<div class="tbf_wide_80" id="hc_rc_3831">To help us avoid automated posts and misuse of our site, please enter the words below.</div><div class="x_close_row" id="hc_upper_right2_3831"><a href="javascript:void(0)" onmousedown="HidePopupContent('hc_3831', 'hc', '3831'); return true;">Close</a></div>
<div class="featured_meta"><div class="meta_article">02 Nov 1998 | <a href="/article/5154?print_version=1">Print <span class="shift_up"><img src="/images/printer_icon.gif" alt="Printer-Friendly Version of This Article" border="0" width="9" height="10"></span></a></div></div>
<div id="article_box_3831"><P>Graphic designers hit a stumbling block a few years ago when the Web threatened to become The Next Big Thing. It had been acceptable to pack as much detail as possible into every row of pixels in a huge image. But designers who took on Web work discovered that images needed to be as small as possible. Compression became the holy grail of Web design.</P><P>Although this quest led to the creation of a new industry and a disproportionate number of how-to books, only recently has attention focused on optimizing the HTML files that make up every Web site. Two utilities have emerged to shave even more bytes from your Web files. Mizer, from Antimony Software, and VSE HTMLTurbo, from Voget Selbach Entertainment, can reduce the size of HTML files without harming their functionality.</P><P><STRONG>Don't Byte Me If I Strip</STRONG> -- Image compression relies on two notions: either replace repeating values with a shorter description of those values (known as "lossless compression" and used in GIF files), or remove unnecessary information without revealing noticeable degradation (known as "lossy compression" and used in JPEG files). (For an overview of image compression, see "A Closer View of Web Graphics" in <A HREF="http://www.netbits.net/nb-issues/NetBITS-007.html">NetBITS-007</A>.) You can't apply lossless compression to HTML files because Web browsers aren't designed to read, decode, and display compressed text files. That leaves lossy compression: strip out unnecessary information but leave the content and HTML tags intact.</P><P><<A HREF="http://db.netbits.net/article/04458">http://db.netbits.net/article/04458</A>></P><P>So what's expendable? Without trying to say what's worthwhile on the Web, there are unnecessary elements in a typical HTML file. Line breaks, tabs, and spaces that aren't used in the page content are the most obvious; they consume space despite being invisible. Although HTML purists (and validation programs) may object, most Web browsers can correctly interpret pages without some elements, such as quote marks around tag attributes (like <IMAGE HEIGHT="50">) and tags added by some HTML editors (like <NATURALSIZEFLAG>).</P><P>You could also attack comment tags (which don't appear in a Web browser but are used to embed notes, represented as <!-- COMMENT HERE -->). However, some Web servers add preexisting content from templates or perform an action dictated by commented commands, making this option potentially dangerous.</P><P>You could do all this by hand if you had the time, but since no one does, instead check out the aforementioned utilities to have the work done for you. The stripped files look awful without the tabs, line breaks, and spaces that make the text easy to read. That's why the creators of both Mizer and HTMLTurbo recommend HTML compression happen just before uploading. That way, the smaller files reside on the Web server, while your editable copies remain on your hard disk. Apply necessary updates to your local files, then replace the server files with new optimized copies.</P><P><STRONG>Getting Wiser with Mizer</STRONG> -- To process a file using Mizer, drop it onto Mizer's application icon. You end up with three files: the optimized HTML file, a backup copy of the original, and a log file reporting the amount of compression achieved. You can modify those and other options by launching the program directly and choosing Preferences from the File menu. Mizer also includes a setting called Tag Optimization that removes closing tags such as </LI>, </HEAD>, and </HTML>, even though that's against official HTML rules.</P><P>In addition to compressing individual files, Mizer can crunch an entire folder of Web files dropped onto it, enabling you to process a local copy of your Web site in one shot.</P><P>Mizer also optimizes JavaScript text, though it's important that the JavaScript syntax be correct (unlike HTML, which browsers often display even if broken). Specifically, statements must be properly terminated with semicolons, not just returns (which some Web browsers acknowledge as functional code).</P><P>Mizer is scriptable, so you can incorporate it as an automated step within your Web page creation process. For instance, a sample script provided with Mizer optimizes files then uploads them to your Web server using Fetch.</P><P><STRONG>Blasting Text with VSE HTMLTurbo</STRONG> -- Like Mizer, HTMLTurbo involves a drag & drop operation to optimize HTML files, but it offers more configuration options. For example, from the Preferences dialog box, you can specify that comment tags and <META> tags be stripped (you can also remove just the <META NAME="generator"> tag).</P><P>HTMLTurbo can notify you when it encounters errors in your HTML code, but its implementation is crude, popping up a dialog box that stops processing until dismissed. Fortunately, you can turn this option off.</P><P>HTMLTurbo can display a Results window that uses the amount of bytes saved to estimate how much bandwidth you can save over a period of time. By selecting a file and typing in the approximate number of hits that page receives, HTMLTurbo reports average savings by day, month, and year. I wouldn't classify this as hard data, but it's interesting to see the effect of your efforts, especially if your Web hosting fees are based on actual bandwidth used.</P><P><STRONG>Do They Work?</STRONG> I tested a variety of HTML files on both utilities, ranging from small text-only pages to complicated layouts using numerous JavaScript elements. In both programs I kept the default compression settings. Understandably, the more complicated files yielded the best results: in one case, a 45,532 byte file was reduced to 39,486 bytes by Mizer (a savings of 6,046 bytes, or 13.3 percent) and to 40,448 bytes using HTMLTurbo (a 5,084 byte savings, or 11.2 percent). The macro-generated HTML file for <A HREF="http://www.tidbits.com/tb-issues/TidBITS-452.html">TidBITS-452</A>, however, produced minimal gains: from an original size of 32,983 bytes, Mizer came up with a 32,586 byte file (saving 1.2 percent) while HTMLTurbo created a 32,432 byte file (saving 1.67 percent).</P><P>I threw two complete sites at the programs. The larger one, weighing in at 22,713,440 bytes (22.7 MB) was reduced to 21,589,258 bytes (saving 1,124,182 bytes, or 4.95 percent) by Mizer, and 21,488,988 bytes (saving 1,224,452 bytes, or 5.39 percent) by HTMLTurbo. Note that these figures represent the <EM>entire</EM> site, graphics and all. The second site, which was much more modest, shrunk 14.8 percent from 134,236 bytes to 114,265 bytes (Mizer) and 15.5 percent to 113,445 bytes (HTMLTurbo).</P><P><STRONG>Compression Quibbles</STRONG> -- Overall, I was pleased with the 5 to 15 percent compression I saw in my informal results. I wasn't able to identify any page elements that broke due to the optimization, and in several cases load times seemed to improve. However, despite both programs' enthusiastic claims, real-world speed differences are influenced by outside factors such as Internet traffic, your computer, and your method of Internet access.</P><P>In fact, the problems I found with each program were related more to interface and action, rather than results. My largest gripe about Mizer relates to processing a folder of several HTML files. Although the program makes backup copies of the original files, they're scattered within the original directory instead of in a new folder; this meant that for my large site example, which contained 1,466 files in several nested folders, I had to separate the compressed versions from the originals manually.</P><P>HTMLTurbo introduced its own variation of this problem: it tosses every processed file into one directory - if you compress more than one file from different sites on your hard disk, you must sort them out (hoping that none share the same name, like index.html). Another quibble with HTMLTurbo is its complete lack of information on exactly what it strips from HTML files. Some people may not want that level of detail, but I want to know what's being done to the HTML I've labored over (this is also why I'm often dubious about WYSIWYG HTML editors). Mizer, though slightly less flexible, makes up for it by precisely explaining its actions in the ReadMe file.</P><P><STRONG>Please Squeeze the Cheese</STRONG> -- For designers who want to squeeze the most out of their HTML, both utilities are well suited to the task. Mizer 1.2 is available for purchase through TidBITS sponsor Digital River for $69.95; although a demo is not available, Antimony Software guarantees a full refund within the first 30 days. VSE HTMLTurbo is available as a 1.2 MB download. The demo version is fully functional for 21 days, after which it costs $79.95 to obtain a registration code.</P><P><<A HREF="http://www.antimonysoftware.com/">http://www.antimonysoftware.com/</A>><BR><<A HREF="http://www.vse-online.com/">http://www.vse-online.com/</A>></P><!-- HTML Crunchers Fuel Compression Obsession Jeff Carlson --></div>
<!-- end article text -->
<!-- PayBITS -->
<p> </p><div class="sponsorbox">
<div class="sponsortext"><A HREF="http://www.smithmicro.com/tidbits"><IMG SRC="http://db.tidbits.com/images/badges/StuffItDeluxe2010.gif" ALT="" HEIGHT="50" WIDTH="50" BORDER="0" ALIGN="left"></A>StuffIt Deluxe 2011 has everything you need to backup, encrypt,<br />share, and compress all of your photos, audio and documents.<br />Compress it. Secure it. Send it. Try StuffIt Deluxe 2011 today!<br />Click here for a free 30-day trial: <<a href="http://stuffIt.com/tidbits/">http://stuffIt.com/tidbits/</a>></div>
