Tools for Web Designers
Many web developers have recognised the value of designing websites for low bandwidth, and have created a variety of useful tools to help themselves and each other. We recommend the following tools as being particularly useful.
The companion website to the book also has an online web page analyser which looks at pages to see how they could be reduced in size, and how well they conform to guidelines on page loading time and number of objects.
The analyser is a good place to start when looking to make your site load faster, over high or low bandwidth.
Firefox is an excellent tool for web developers because of the number of plugins and add-ons designed for and by web developers:
Web Developer Toolbar
- Edit CSS files and watch the results in real time;
- Display image file sizes in the browser;
- Display access keys and tab indexes in the browser;
- Show document size, with and without compression on each file;
- Display the document using "small screen rendering" for compatibility with mobile devices;
- Set your browser size to a standard screen size such as 800x600 or 1024x768;
- Validate HTML, CSS and accessibility using online tools;
- Check your site with the Web Page Speed Report (see below).
Aptivate staff find this tool particularly useful for web development work.
Firebug  is another Firefox extension designed for developers. Like the Web Developer Toolbar, it allows you to edit HTML and CSS live, displaying changes in real time. However, it also has some unique features, such as:
- Display the current CSS attributes of any element in the page;
- Display network activity and show files loading in real time and afterwards;
The display of network activity is particularly interesting, as it allows you to see the order that web pages and their dependent files load in, the dependencies between them and how long each one takes.
Live HTTP Headers
Live HTTP Headers is a plug-in for the Firefox browser that allows you to view HTTP Headers. This is useful to see if compression or caching are enabled on your web server.
Like Firebug, this website also displays the time taken to load each page on a site, but from an external server. This is useful if you have a very fast connection to your server or to the Internet, so that you can't see pages loading slowly. Further servers are planned in Europe, Africa and Asia.
Aptivate's Low Bandwidth Simulator
We developed this simulator  to show web users accustomed to fast Internet access what it's like to use a slow connection. If you remember accessing the Web by modem or have tried it on a mobile phone, you know how painful it is, but this can be difficult to communicate to others without demonstration.
The tool works for the majority of websites, and gives a very good indication of the experience that is to be expected when viewing a site over a slow connection.
Loband  is Aptivate's web simplification engine that strips down web pages to a simplified text format so that they load faster on slow connections. You can use Loband in combination with the simulator to see its effect over a slow connection.
Browsers for Compatibility Testing
|Browser||Windows||Unix-like (e.g. Ubuntu Linux)||MacOS X|
|Safari/Konqueror||Safari 3 Beta||konqueror.org||Safari 3 Beta|
|Netscape||Navigator 4.08||Communicator 4.8||Navigator 4.08|
|Lynx||Lynx on Windows||lynx.browser.org||Apple.com|
|Internet Explorer||Multiple versions of IE (3,
4.01, 5, 5.5 and 6) on one machine
Alpha version of a test tool for IE 8 beta 1, 7, 6, and 5.5 on Windows Vista and XP
Official Microsoft site
Running Internet Explorer on a virtual machine
Ensuring that your HTML and CSS complies with standards means that it will have the most chance of being interpreted on the widest number of browsers. To assist with this, the W3C provide an HTML and XHTML validation service  and a CSS validation service which are useful if you don't have the Firefox Web Developer Toolbar.
CSS File Size Optimisers
Text filtering tools can be used to strip comments and white space from style sheets as well as combine and abbreviate rules. At the time of writing, the following two online tools are recommended in order of preference, although there are others out there. The tools are not infallible and will sometimes introduce bugs into the CSS, so it is worth testing the resulting CSS with your site, and changing to a different tool if necessary.
Script File Size Optimisers
- ESC by Saltstorm, configurable, works with various scripting hosts;
[#1] Andrew King, Speed Up Your Site: Web Site Optimization, New Riders Publishing 2003
[#3] Web Page Analyser, http://www.websiteoptimization.com/services/analyze/