Remove Whitespace

You can safely remove most whitespace from your code with no change of appearance to your pages. Browsers don't care how pretty your code it, they process the code between tags, real or implied. Formatting code with spaces, tabs, and returns makes it easy for humans to read, but slower for browsers to download.

The average web page has between 20 and 30 percent extra whitespace, according to Insider Software and Port80 Software. So instead of this:

<table id="whitespace  repository" class="longclassname" border = "0" >
     <tr>
        <td> whitespace? what whitespace? 
        </td>
        <td> cell  block number two 
        </td>
     </tr>
</table>

Do this:

<table id="whitespace repository" class="longclassname" border="0">
<tr>
<td>whitespace? what whitespace? 
</td>
<td>cell block number two
</td>
</tr>
</table>

Even better, eliminate all the returns and abbreviate your id and class names like this:

<table id="wr" class="lc" border="0"><tr><td>whitespace? what whitespace?</td><td>cell two</td></tr></table>

CSS and JavaScript also benefit from whitespace removal. Be sure to not change the meaning of your CSS or JavaScript in the process, as some spaces are required between tokens, and for JavaScript returns can have meaning. You can also remove the last semicolon in CSS rules.

HTML Optimization Software

There are a number of tools available that automatically optimize your XHTML by removing whitespace, comments, and excess code. HTML Tidy has a little-known optimization feature that removes whitespace, and commercial tools like w3compiler and SiteSqueeze can automate the removal of whitespace and other excess code. To make your code easier to maintain, ideally you would install a server-based script to clean your code from templates on the fly, just before they are delivered to users.

Further Reading

HTML Optimization

Summary of chapter on optimizing HTML from Speed Up Your Site: Web Site Optimization.

HTML Tidy

Created by HTML author Dave Raggett, HTML Tidy is an open source XHTML cleaner that also removes whitespace, and closes orphaned tags.

Insider Software

Makers of SiteSqueeze, a web page optimizer that removes superfluous information from textual data and images.

Use HTTP Compression

Shows the benefits of using HTTP compression on your web pages. Another Speed Tweak of the Week.

w3compiler

Web site optimization software from Port80 Software optimizes HTML, JavaScript.

By website optimization on 10 Feb 2004 AM