Call (877) SITE-OPT (748-3678)

Advanced HTML Optimization

You can only go so far minimizing the code you use in HTML pages. To fully optimize your HTML, you've got to dig a little deeper and transform your code. This chapter shows you how to tune your tables, optimize your forms, auto-abbreviate your links, and compress your HTML for maximum speed. The last two techniques require server access, which I explain in this chapter as well as in Chapter 17, "Server-Side Techniques," and Chapter 18, "Compressing the Web."

Figures

Code Listings etc.

Summary

  • Table tips:
    • Use rowgroups to segment tables for style, accessibility, and printing.
    • Use colgroups and col to style entire columns.
    • Consolidate attributes (tr versus many tds, and so on).
    • Enable incremental rendering with sized col elements.
    • Use the fixed table-layout algorithm where possible (NS7+, IE5+).
    • Simplify, unwind, and layer your tables for maximum speed. Provide useful content in the first table.
    • Use the table trick to raise relevance.
    • Use CSS to style cell backgrounds (version 4+ browsers).
  • Forms:
    • Use JavaScript to save clicks and HTTP trips.
    • Gracefully degrade with CGI scripts for non-JavaScript browsers.
    • Shunt form defaults into CGI scripts.
    • Substitute optgroup select menus for DHTML hierarchical menus.
  • Use trailing slashes on directories.
  • Abbreviate your URLs.
  • Use compression where possible.

Further Reading

Books

Cascading Style Sheets: Separating Content from Presentation
Owen Briggs, Steve Champeon, Eric Costello, and Matthew Patterson, (glasshaus, 2002). See also glish.com.
CSS: The Definitive Guide
Eric A. Meyer, (O'Reilly, 2000). See also Meyerweb.com.
Designing Web Usability: The Practice of Simplicity
Jakob Nielsen, (New Riders, 2000). See also Useit.com.
HTML & XHTML: The Definitive Guide, 5th ed.
Chuck Musciano and Bill Kennedy, (O'Reilly, 2002).

Article Highlights

A discussion of waste data in HTML documents
Cub Lea and Stephen Winter of WebTrimmer discuss how to cut the fat out of your HTML documents.
Appendix B: Performance, Implementation and Design Notes
Dave Raggett, Arnaud Le Hors, and Ian Jacobs, in HTML 4.01 Specification, (World Wide Web Consortium, 1999). How to speed up your HTML tables.
Cascading Style Sheets, level 2 CSS2 Specification
Bert Bos et al., (World Wide Web Consortium, 1998). Enable fast table rendering with table-layout:fixed.
Chapter 11, Tables
Dave Raggett, Arnaud Le Hors, and Ian Jacobs, in HTML 4.01 Specification, (World Wide Web Consortium, 1999). Giving the browser table sizing information beforehand (colgroup, col, width, and table-layout:fixed) speeds the rendering of tables.
Evolution of a Home Page
Andrew King (Jupitermedia Corporation, 2001) chronicles the evolution of WebReference.com's home page over time. Includes performance techniques used.
Extreme HTML Optimization
Andrew King, (Jupitermedia Corporation, 2001). Radical reductions in HTML file size with no holds barred techniques.

HTML Optimization Programs and Services

HTML Optimizer Pro
Tonbrand Software offers a range of optimizers capable of optimizing HTML, XHTML, JavaScript, VBScript, CFScript, Java, CSS, PHP, ASP, JSP, CSP and LassoScript.
SpaceAgent
Insider Labs offers client and server-based web page optimization programs.
VSE Web Site Turbo
Mac-based web page optimizer.
w3compiler
Windows-based source code optimizer from Port80 Software. Optimizes XHTML, CSS, ASP, and CFM files. Includes JavaScript parser.
WebTrimmer
PC-based optimization program for HTML.

HTTP Compression (content encoding)

Gzip.org
The gzip compression format. This is the most widely supported encoding method, used in mod_gzip etc.
HTTP Compression Speeds up the Web
Peter Cranstone of Remote Communications discusses how HTTP compression can save you bandwidth and speed up your site.
mod_gzip - serving compressed content by the Apache webserver
Michael Schroepl's excellent mod_gzip site.

General HTML Resources

HTML 4.01 Specification
Dave Raggett, Arnaud Le Hors, and Ian Jacobs, (Cambridge, MA: World Wide Web Consortium, 1999).
CSS Support Charts
Eric Meyer. The master CSS reference grid.
The Web Standards Project
Jeffrey Zeldman et al., (1998).
Copyright © 2002-2017 Website Optimization, LLC. All Rights Reserved - Free website speed test - Privacy Policy
Last modified: January 11, 2010.

Follow us on: Twitter, Google+, Facebook, Linked In