Top 5 Website Design Tips

 1.    Make sure each page in your website has something valuable to offer.

Though this doesn't really relate to design, it's actually more important than design, which is why it's the very first tip.  I know that many people reading this page are trying to find out how to make useless pages look pretty, because they think that style is all that really matters.  So let's step back a minute and realize that fundamentally a web page exists to provide something that's useful or interesting to visitors.  If your page doesn't have that, then you must fix that problem before you worry about how to present it.  If you throw mud at a canvas, then even if it's in a gold frame, it's still just a canvas of mud.  What are you offering to your visitors?  Why is it worth their time to visit your site?  Please focus on that before you move on to how it should look.

If your plan is to make money from advertising, then go for a ratio of not less than 75% editorial to 25% advertising.  Amazingly, I see some sites that are almost nothing but ads.  We know that no one would turn on the TV if it were just commercials, and no programs, or buy a magazine if it were just ads, and no articles.  By the same token, a website also has to have more than ads if it's to be successful.

2.    Don't distract your visitors with blinking or scrolling text, animated GIFs, or auto-loading sound.

Animation and sounds are distracting.  How can anyone concentrate on reading what's on your site when there are things flying around the page?  It's like trying to read a newspaper when someone's poking you in the shoulder repeatedly.  Also, visitors who have slow connections may resent that you wasted their time by forcing them to load animations and sound files against their will.  Conventional wisdom is that people will be drawn to an animated ad, but it's actually the opposite:  Readers who are assaulted by blinking ads are more likely to leave the site immediately without clicking on anything, and are far less likely to bookmark the site, return to it, link to it, and recommend it.  The results don't lie: When I switched the ads on a friend's site from animated to static, click-through didn't suffer at all. (That site pulls in nearly $500,000 in yearly advertising revenue, by the way.)  I make my living from ads on my sites, and I won't run animated ads on them.  I prefer to give my readers a good experience, rather than an annoying one.

Let's talk scrolling text.  Besides the fact that it's annoying, there's another problem: the reader can't read it at their own pace.  They're forced to read it at whatever speed you deliver it.  They might have preferred to read those two sentences quickly and then move on, but because it's scrolling they're forced to sit there and wait for the text to slowly appear.

This brings up an important point:  Always keep your visitors' interests in mind.  Make sure you try to please them, not yourself.  Scrolling text does nothing to serve the visitor.  If it's on a site it's because the site owner thought, "Let me show how cool I am."  Do you see the difference?  Don't design the site for yourself, design it for the people who will actually use it.

3.    Don't annoy your visitors with pop-up windows.

Nobody likes popups.  Here again, the only reason a site would have popups is because the site owner is thinking of his/her own interests rather than the readers.  We all know that when we're browsing we hate popups, but suddenly when we switch hats and become the site owner, we lose our ability to see through the users' eyes.  So let's remember to put ourselves in their shoes. Which of these reactions to popups is a visitor is more likely to have?

(a) "A popup window, oh goody!  I love sites with popups!  I will make certain to bookmark this site and visit often.  I will also certainly click the ad or links in the popup because I love them so much."

(b) "@#&$! Whoever made this website obviously has no respect for me as a visitor.  When I leave here I will never come back."

 4.    Don't use frames.

You might be tempted to use frames because it makes it easy to have the same header or menus appear throughout the site.  And usability studies do show that users find sites with frames "Easy to Comprehend", "Easy to Navigate", and "Easy to Find Info".  But there are two serious downsides to frames:  First, the address bar doesn't change as you go from page to page. That makes it impossible for anyone to bookmark or link to a specific page in your site, or to share that page with a friend by emailing them the link. Second, when a page within your site other than the frameset shows up in a search engine, a visitor clicking over to that page will see just that subpage without the surrounding frame.

There are clunky Javascript tricks that can overcome these problems, but once you hassle with that to get your frames to work properly then you're defeating the purpose of using frames because you wanted a quick & easy solution in the first place. The preferred way of having the same elements on a page throughout a site is to use server-side includes.

5.    Don't make your page too narrow or too wide.

 As of 2011, 99% of users have screens that are at least 1024x768 pixels.  Many designers make their pages work at sizes as small as 770 pixels wide so that they don't offend the less than 1% of users with 800x600 screens, but that means they're giving 99% of their users a bad experience, because those 99% see tons of whitespace rather than actual page content.

On the other side, pages that go edge-to-edge are way too wide on big monitors like most people have these days.  I suggest limiting the page content to 1200 pixels or less.