» What If They Can’t Get Through the Front Door?
Imagine. You’re strolling through the mall one day and, off in the distance, you see what looks to be a really cool store called Gizmos and Gadgets — just your kind of place. So, you walk toward the store, but as you near the front door, you see a big pile of cardboard boxes blocking the entrance. You scratch your head and look for a way through the maze, but there’s no obvious course. So, what would you do? Would you climb over the obstacles to get into the store? Or would you just move on to Wal-Mart?
Fade Out.
Fade In. You’ve just done a Google search to find some quilting sites (no one has to know) and the first few listings look like just your cup of tea. So you click on the link, the screen goes blank and the dreaded blue line begins its painfully slow crawl across the bottom of the screen. So, are you going to wait for the landing page to download — a good 15-30 seconds? Or, are you going to hit the back button and click on listing number two? Let’s face it, we’re an impatient people and when we want something, we want it now- not 15 seconds from now. As Homer Simpson once complained, “Isn’t there anything faster than a microwave?”
As the owner of an Internet site, you have enough to worry about. The new Hilltop algorithm (the formula that determines where your site appears on the results pages when a user queries Google) dropped your PageRank (PR) from an 8 to a 5 (not good) while you slept last night. Your site’s been hacked six times in the past two months and, despite a great looking site, crammed with top-notch information and goods and services for sale at reasonable prices, your aren’t turning visitors into buyers. Could the problem be inappropriate key words, unrelated links, a confusing checkout process — or could it be something much simpler — something like the page weight of your landing page? Hmmm. Could it really be that simple? You bet. Here’s how.
What is Page Weight?
Page weight, simply put, is the size of any page within your site measured in kilobytes. Okay, that’s easy.
The programming and design of your site contribute to page weight, which in turn contributes to how many visitors actually suffer through endless download times. Some of the factors that add to a page’s weight include:
- the number of HTML files on the page
- the number of images (gifs, bmps, jpgs, etc) on the page
- the number and size of video files (if any)
- the number and size of audio files (if any)
- Flash animations
- page design and programming
So, what’s the big deal? Well, page weight has a direct correlation to the download times of your landing page and every other page within your site. Now, you might not think download times are all that critical but survey information tells a different story.
Check out the download times for different weighted pages based on the connection speed of the user. The results are surprising and important to the success (or failure) of your site
| Connection Speed | 20 Kb Page Weight | 40 Kb Page Weight | 100 Kb Page Weight |
| 14.4 Kbps | 12 seconds | 25 seconds | 62 seconds |
| 28.8 Kbps | 6 seconds | 12 seconds | 31 seconds |
| 33.3 Kbps | 5 seconds | 10 seconds | 26 seconds |
| 56 Kbps (V.90) | 2 seconds | 5 seconds | 13 seconds |
| 128 Kbps (DSL) | 1 second | 2 seconds | 6 seconds |
| 256 Kbps (DSL) | < 1 second | 1 second | 3 seconds |
So, you’re asking yourself, “what’s a few seconds of wait time among friends”, right? Well the difference in download times has a direct impact on the number of visitors to your site who actually stick around while the blue line makes its slow crawl from left to right.
You might call the following chart the ‘Impatience Index’ because it measures just how many users are willing to stick around while your landing page ever-so-slowly appears on their screens.
The Impatience Index
| Time to Download a Page | Percent of Users Who Wait for Download |
| 10 second download | 84% |
| 15 second download | 51% |
| 20 second download | 26% |
| 30 second download | 5% |
| The longer the download time » The fewer users stick around | |
If these numbers don’t surprise you, they should. Consider the typical dial-up user with his 56 Kbps connection speed. A landing page with a weight of 100Kb is going to take at least 13 seconds to download under optimum conditions. (In the real world, that 56 Kbps connection speed is usually closer to 48 Kbps due to phone line noise). That means the difference between an 84% retention rate versus a 51% retention rate — a difference of 33% of all you site visitors have already moved on after a few seconds of download time.
And check out the difference between a 10-second download and a 30-second download. That 20 second difference can cost you up to 79% of your visitor traffic. Still don’t think page weight is important — essential — to the success of your site? If you’re losing 79% of your traffic due to the weight of your landing page, there’s only one solution. Lower that landing page’s weight.
Let’s take a closer look at the benefits of optimizing page weight on your site.
Higher Visitor Retention Rate
Just as the lean, mean marathon runner will finish the race hours before her bloated, overweight competitor, a lean, mean landing page will load faster than a page heavy with multiple HTML files loaded within frames, an audio/video presentation and nested charts and graphs. So, the most obvious benefit to trimming the fat is faster download times and fewer users searching for other avenues (links) for the goods and services they’re seeking. What good is a PageRank of 8 (very good) if they can’t get into the front door? If less than half your visitors are actually getting onto your landing page, you’re site isn’t as effective as it could (should) be and, quite frankly, you’re losing a ton of revenue due to lost sales. Hey, this reason alone is reason enough to lower your site’s page weights. But wait, there’s more.
Visitor Comfort
If you owned a brick-and-mortar business, you’d want your customers or clients to be comfortable — a clean entrance, good lighting, a little Muzak playing softly in the background. Well, the same is true of visitors to your site (except for the Muzak part, you can lose that). You want your visitor comfortable, not irked at a 60-second download. You want those visitors to be in the mood to conduct business, whatever that business may be. Reducing page weight reduces load times, which reduces visitor stress, which increases site activity.
Higher Visitor Conversion Rate
It’s one thing to retain a visitor on your site. It’s quite another to convert that visitor to a sale or some other form of new business. Faster downloads will encourage visitors to stay on your site longer, viewing more pages and generating increased interest in your product or service, whether it’s hand-made clothes for boa constrictors or financial advisory services. It doesn’t matter. A comfortable visitor is much more likely to become a new customer or client.
Meeting Market Expectations
As Internet buyers of goods and services have become more savvy, they’ve learned to identify quality sites from garbage dumps. These buyers have certain expectations of the businesses with which they do business and the sites these businesses use to represent themselves. Put up junk, cheesy clip art, downloads long enough to let you do the laundry, and you’re not meeting your market’s expectations. Internet commerce is no longer a novelty when anything looked good. A smart surfer can tell good from bad within 10 seconds of linking to your site. If you look bad, you are bad on the Net.
Higher PageRank
The recent Hilltop Algorithm has transformed the user search function and, in the process, forced web masters and e-commerce pros to rethink their search engine modalities. Wasn’t too far back when key-word density was the end all to be all, but the Hilltop algo changed the search parameters. And though they’ve maintained their usual stony silence, the nice folks at Google seem to have adapted the Hilltop algo based on numerous test searches. That means, the 800-pound gorilla of search engines doesn’t give a hoot about keyword density any more (well, maybe a little hoot). The new SE model is configured on completely different parameters.
Site traffic is still an important component. So, sites comprised of pages with clean, solid code — pages that attract visitors and exceed their expectations — will invariably receive higher PRs because they’re getting more visitors who stay longer and who return to the site. Higher PRs contribute to more visitor traffic and that enables you to charge higher rates to sites with outgoing links from yours.
Lower Bandwidth Charges
If you’re running a high traffic site, pages optimized for lower weight, can save a lot of money on bandwidth charges. 100,000 pages of 150Kb weight will need twice the bandwidth as the same number of pages at 75Kb. So, if your ISP charges by the amount of bandwidth you use, or hits you with overage charges, reducing page weight can save you big time on your monthly bandwidth charges.
10 Proven Techniques to Lower Page Weight
The key, then, to retaining visitors and converting the window shopper to a buyer is to reduce the page weight on your site, making it easier and faster for each visitor to navigate your site. So, let’s give a look at some simple steps that can be implemented quickly and easily to keep traffic up and page weight down.
1. Remove the Excess. Step one is to remove all non-essential elements on your site’s landing page. Many landing pages are so crammed with text, Flash animations and other bells and whistles that the first time visitor is actually overwhelmed with sensory overload.
Consider taking the following steps:
- remove all video files
- remove all audio files (very distracting and not very effective)
- remove unnecessary gifs, jpgs, bmps and other graphic elements
- pare down unnecessary text
2. Use Cascading Style Sheets (CSS) to significantly reduce load times. In addition, CSS designs offer additional advantages:
- CSS facilitates future compatibility as coding and technology change in the years ahead. Depreciated elements such as the font tag, the center tag, the background element and the body tag will no longer be supported by browsers in the future.
- CSS is the most effective means to separate content from your site’s presentation elements. This means that to change site content, you would need only to modify one file. To change the elements of presentation would require changes to another file called the style sheet. In other words, you can make changes to your site without tearing everything out and starting from scratch.
- Because of the flexibility of using CSS, you can create different style sheets for different applications and media such as the Web, printer-friendly download pages, PDA text, etc. CSS modeling also enables you to create different style sheets for different Web browsers like Internet Explorer and Mozilla.
- CSS reduces file size (and therefore download time) by decreasing the amount of markup in the HTML while eliminating the need for unnecessary page elements such as one-pixel spacer images, multiple font tags, nested tables and similar items. (And if all of this makes your head spin, not to worry. There’s software to help you with site optimization across the board. And of course, there are experts in handling this streamlining of your site for improved access by visitors.)
- CSS puts global control in your hands. Change a single property or element in the external file and it changes the look of the element across the entire site. (Changes are easier using a CSS design.)
- CSS speeds updates to your sites design. No need to rewrite the entire HTML code; you can simply make the change in the style sheet.
- CSS provides greater control of the placement of elements on your pages. Font size, font color, location of text and other basic elements of design can be changed faster and at less expense.
- Finally, and this is key, CSS allows you to position your most important content near the top of the page while less critical elements (navigation tools) will appear at the bottom of the page. The CSS coding directs the browser to the key content which allows search spiders to find the most relevant and important information first. In turn, this ensures better search results for users looking for specific content within your site.
- To get a better feel for the potential of CSS page design, visit the CSS Zen Garden located at http://www.csszengarden.com/
3. Avoid frames. Not only do framed pages load more slowly, some SEs (search engines) don’t index framed pages correctly, which can skew your PageRank — and not necessarily for the better.
4. Avoid nesting tables. Inexperienced Web designers often use tables inside tables for the sake of a good-looking layout. However, this increases download times. You’re much better off using a single, well-designed table. Further, using CSS will usually enable you to eliminate the need for using tables as an element of your page format. (See above.)
5. Compress all graphics and images. jpgs, gifs and bmps often contain extraneous data that isn’t needed for the proper display of these images. Another time saver for the visitors to your site.
You might want to check out the following design tools for help in this area:
- Image Compressor:
http://www.spinwave.com/ - GIFCruncher:
http://www.webreference.com/services/graphics/gc
6. Use height and width attributes for your images. This will allow the page to appear on screen before all the images are loaded. This is especially true in the case of older browsers.
7. Eliminate extra ‘white space’ in your code. Every space, every tab and every new line character in the HTML code requires extra data, increasing download times. Some page-design software (Dreamweaver, for example) eliminates white space for you. Using these tools before you upload your pages will often eliminate several Kbs of unnecessary data from each page.
8. Break up long sections of text. First, big blocks of text increase download times. Second, they’re difficult to read without breaking up the text into smaller, bite-sized pieces. Thus, consider breaking long pages of text across several pages. Your pages will load faster and your visitors will have an easier time reading through the text.
9. Clean up your code with development tools. There are a number of free and commercial tools available online that will clean up your code which, in turn, will reduce page weight without having any impact on the pages’ displays. Here are some helpful tools available for the do-it-yourself Web designer:
- Web Developer ToolBar:
http://www.chrispederick.com/work/firefox/webdeveloper/ - NetMechanic:
http://www.netmechanic.com/ - Dr. Watson:
http://watson.addy.com/
NOTA BENE:
Before using any of the above-listed tools, first make a backup of your existing pages since these software packages can alter code, producing errors you don’t need.
10. Finally, know your target demographic and design for specific connection speeds. For instance, if you’re developing a B2B site, you can feel more confident that your users will have DSL connections, currently more prevalent in the business world than in the homes of consumers who tend to still use their dial-up modems. Thus, you can create greater impact with shorter downloads knowing that the majority of your visitors will be using higher connection speeds.
Believe it: a few, small improvements to the overall page weight of your site can deliver substantial improvements to your visitor retention rate, conversion rate and to your PR rank, moving you up on the results page generated by a user query. And, since most SE users rarely look beyond the first or second page of search results delivered by any SE, getting your site listed higher in the results page is a guarantee of increased site traffic. And, that gets us to the bottom line — increased revenues from a more efficient, professional site — something we’re all trying to achieve.