web design tips
 

web design tipsCut to the Chase: How to Make Your Website Load Faster.

So your web pages have great content, a nice design, but hardly anyone seems to click through from them to any other part of your website. In many cases, the problem is the load time - people are abandoning your site for the simple reason that it just takes too long for the thing to load.

How Fast Does It Need to Be?

Fast load times are extremely important: usability studies say users rate them as one of the most important things about a website. Users would much rather use a quick-loading site of average quality than a great one that loads sluggishly - no doubt you've done this yourself at some point.

What's the limit? Well, studies say that over a third of users will leave a website that doesn't load within ten seconds. You might think
that, in the age of broadband, download speeds don't matter, but remember that in the US, over half of all Internet users are still using slow dial-up connections (if you are, you have my sympathy). Other countries don't tend to have quite as many dial-up connections left, but broadband penetration is certainly nowhere near universal.

This means that you need to pay attention to the size and download speed of your site: those 10 seconds on a 56k dial-up connection correspond to about 70KB in page size - that means that your HTML and graphics should add up to 70KB as an absolute limit. That's quite a stringent requirement, and makes every byte count.

Reduce Graphics.

The first thing you should do, then, is to keep the number of graphics your website uses to a minimum. Don't have graphics for things where text or CSS would do, or where they don't enhance your information or design significantly. You should consider the web to be a text medium, and justify every graphic you use to yourself.

Compress Your Graphics.

Once you've removed the un-needed graphics, you might consider compressing the ones that remain. Try turning up their JPEG compression higher, or reducing the number of colours used - you might try using a GIF, if your graphics don't have very many different colours.

When you can't compress your graphics any smaller, don't miss more traditional steps: you could always resize your graphics to make them smaller!

Clean Up Your HTML.

You'd be surprised just how bloated HTML code can get with unnecessary tags, especially if you use a WYSIWYG editor, or design your site using tables. Design your site using CSS as much as you can, and use HTML Tidy (or another HTML cleaning program) to clean up your HTML. Don't ignore the extra bandwidth taken by CSS, though, and try to keep that as small as possible too.

In many cases, a simple cleaning-up process can reduce the download size by your pages by as much as half - it's especially effective for pages that contain long articles, because of the number of unnecessary tags many editors insert at the start of new paragraphs.

Switch Web Hosts.

Finally, you might find that, despite your website's small download size, it still loads slowly. In these cases, your web host may be to blame. Test from a few different connections and computers to make sure, and try putting up a completely different page to test the speeds - but if it's consistently bad, then it may be time to move hosts. You should, however, email your host about the problem first and give them a week or so to fix it, as they may just be having short-term problems.

When you're switching to a host to try to get a good speed, you might want to consider looking around at sites that are already hosted by them. The best way to do this is to do a search for "hosted by [host's name]" (with the quote marks), as many sites will write who they're hosted by on one of their pages - you can then check a few sites out to see whether they're generally fast or slow.

How to Run Ads Without Driving Visitors Crazy

CSS and the End of Tables

Avoiding the Nuts and Bolts Content Management Software

All About Design Principles and Elements

Clean Page Structure Headings and Lists

 

Web Design
5 Simple Steps to Accepting Payments.
5 Ways to Avoid the 1998 Look.
6 Reasons Why You Need a Website.
7 Ways to Make Your Web Forms Better.
A Question of Scroll Bars.
Ads Under the Radar: Linking to Affiliates.
AJAX: Should You Believe the Hype?
All About Design: Principles and Elements.
An Introduction to Paint Shop Pro.
An Issue of Width: the Resolution Problem.
Avoiding the Nuts and Bolts: Content Management Software.
Beware the Stock Photographer: Picking Your Pictures.
Building a Budget Website.
Building Online Communities.
Clean Page Structure: Headings and Lists.
ColdFusion: Quicker Scripting, at a Price.
Column Designs with CSS.
Content is King.
CSS and the End of Tables.
Cut to the Chase: How to Make Your Website Load Faster.
Designing for Sales.
Designing for Search Engines.
Dreamweaver: The Professional Touch.
Encryption and Security with SSL.
Finding a Good HTML Editor.
Focus on the User: Task-Oriented Websites.
Fonts are More Important Than You Think.
Free Graphics Alternatives.
FrontPage: Easy Pages.
Hints All the Way.
Hiring Professionals: 5 Things to Look For.
How Databases Work.
How the Web Works.
How to Get Your Website Talked About on Blogs.
How to Install and Configure a Forum.
How to Make Visitors Add You to Their Favorites.
How to Run Ads Without Driving Visitors Crazy.
How to Set Up Your Hosting in 5 Minutes Flat.
IIS and ASP: Microsoft's Server.
Image Formats: GIF, JPEG, PNG and More.
It's a World Wide Web: Going International.
JSP: Java on Your Server.
LAMP: The Most Popular Server System Ever.
Making Friends and Influencing People: the Importance of Links.
Making Searches Simple.
Offering Free Downloads on Your Website.
Opening a Web Shop with E-Commerce Software.
tag - they have one extra tag before it. This is the doctype, and it must be present right at the top of your document for it to be valid HTML. There are only really
Perl: Cryptic Power.
Photoshop: a Graphic Designer's Dream.
Picking a Colour Scheme.
Printing and Sending: the Two Things Users Want to Do.
Putting Multimedia to Good Use.
Python and Ruby: the Newer Alternatives.
Registering a Domain Name.
Registering Your Users by Stealth.
RSS: Really Simple Syndication.
Setting Up a Mailing List.
Setting up a Test Server on Your Own Computer.
Some Places to Go For More Information.
Taking HTML Further. HTML might seem like a simple language for web documents, and to an extent, it is - that's what it was intended to be. If you know what
Taking HTML Further with Javascript. Once you've built your HTML pages, you might need them to do something a little more interactive on the client-side (that
Taking Your Website Mobile.
Text Ads: Unobtrusive Advertising.
The 5 Principles of Effective Navigation.
The Art of the Logo.
The Basics of Web Forms.
The Basics of Web Servers.
The Case Against Flash.
The Confusing World of Web Hosting: Making Your Decision.
The Evils of PDFs.
The Importance of Validation.
The Many Flavours of HTML.
The Smaller, the Better: Avoiding Graphical Overload.
The Top 10 Biggest Web Design Mistakes.
The Web Designer's Toolbox.
The Web is Not Paper.
There's More than One Web Browser.
Time for User Testing.
Titles and Headlines: It's Not a Newspaper.
Tracking Your Visitors.
Understanding Web Jargon.
Uploading Your Website with FTP.
Using Flash Sensibly.
Using Quizzes and Games to Get Traffic.
VBScript: Javascript Made Easy.
Websites and Weblogs: What's the Difference?
What Do You Want Your Website to Do?
What You See Isn't Always What You Get.
Which Database is Right for You?
Why Doing It Yourself is Best.
Why Java Will Drive Your Visitors Away.
Why Word is Bad for the Web.
Why You Should Put Your Content in a Weblog Format.
Why You Should Stick to Design Conventions.
Working With Templates.
Writing for the Web.
GoogleSense
Making Money with Articles
Webhosting
RSS
Reading RSS Feeds with an RSS Aggregator