Zenscope Studio

7 Ways to Fix the ABC News Website (kinda)

I recently wrote a detailed critique of the redesigned ABCNews.com. What I didn’t do was offer some suggestions for how they could make it better without an expensive overhaul.

One of the major criticisms readers made about the site was that it’s slow. ABC’s extensive use of JavaScript has something to do with this, but mostly because the site is poorly optimized. Flickr, for example, uses even more scripting than ABC News. The difference is that the people behind Flickr are masters of making JavaScript feel snappy.

In the spirit of constructive criticism, here are seven things ABC News can do to speed up their existing site. Without sacrificing any features, these steps would save bandwidth and increase the perceived speed of the site for its users. The best part: these tips can be adapted to improve any website’s performance.

1. Send an XHTML document that’s pre-loaded with headlines and summaries from the back-end database. This rapidly gives the visitor something to interact with, and the initial content can be replaced once the JavaScript downloads new content.
2. Strip out as much of the inline scripting as possible, moving it to external files and decreasing the size of the HTML document.
3. As much as possible, put the script tags for the external files at the end of the document—before the closing </body> tag—so that scripts are requested last and don’t delay page rendering.
4. Combine as many of the 20+ JS files as possible, reducing HTTP overhead.
5. Use a JavaScript minimizer like Dojo ShrinkSafe to trim the JS down to a more manageable size. ShrinkSafe takes the pane.js file (which loads content into the “panes” of the home page) down from 37.2 KB to 27.7.
6. Serve up the combined and condensed JS files with HTTP compression, cutting the file sizes even further. Only very old browsers—and unpatched installations¹ of IE 5.5 & IE 6—have problems with this. They’re already compressing the XHTML, but not any of the supporting files I tested.
7. Remove the white space from the CSS files, and serve them with compression as well.

There may be technical reasons why they can’t do all of these things. For example, they might not want to take a chance on compressed JavaScript. But even taking some of these steps would improve the user experience.

What’s alarming is that they haven’t done any of them.

But Wait, There’s More!

This little blog post is far from the last word on website performance enhancement, though it does offer some quick-and-easy wins. For an introduction to the really hardcore stuff, check out this article by Flickr wizard Cal Henderson.

Comments

Got Something to Say?

Start the discussion by adding your comment:

Required Fields Marked With *

Name* Remember

E-Mail* (never published)

Website

Comment*

Tip: format your comment with Textile
(Textile Help)