So you want to set up a website. Cool. The more people out there who are adding to the storage lockers full of knowledge-slush-wisdom-smut-idiocy-entertainment-and-inanity known as the Web, the merrier. Before you spend a lot of time adding tiki torches and MIDI music to your site, though, let me share some of my pet peeves and outspoken opinions about what should and should not and absolutely! should not! be found on a Web page. All I'm asking for is a bit of your time and a soapbox to stand on. I'm not insisting that you agree with everything. My proto-webmeister and protégé Sam happily ignored many of the fine instructions presented in Building A Simple Website elsewhere on this site. On one of his pages, Sam had what must be one of the loudest backgrounds in existence. His site used a variety of fonts and colors that don't always show up clearly against his backgrounds and not-so-small photos. Sigh. He was having fun, but then again, he was also not trying to raise money, sell a product, impress a potential employer or showcase his talents. If he had been, I would have had a long chat with him. Instead I'll try to convince you to create an attractive but simple website. You Have Eight SecondsI sometimes lose my cable connection and have to use a dialup backup which means my connection rate drops back to 33Kb. (Yes, 33Kb!) If you are building a toot-toot-your-horn website, remember there are folks who are still using 56Kb/28Kb connections. Also keep your page nice and small for everyone on their iPhones and other hand-held web-browsing gizmos that don't have a T1 line included.Another writer and I have argued about whether to build a website accessible to the 56Kb/28Kb crowd. The other writer asked why he should lose the whiz-bang appeal of his site for folks who can't be bothered acquiring the cutting edge of technology. Why should he cater to borderline Luddites? Don't forget the iPhone crowd. Do you want to lose those visitors who don't have the patience to watch your site load at 28Kb? Text-oriented websites without load-intense bells and whistles, without a bunch of graphics and dancing raisins, are the way to go. I don't enjoy waiting for downloads. Few of us do. Light, breezy webpages are for the cutting edge these days! "Avoid loud and aggressive persons; they are vexations to the spirit," as Max Ehrmann once wrote. Slow downloads are also vexations to the spirt. NetMechanic claims you'll lose a third of your visitors if a page doesn't load in 8 seconds. How long a person will wait depends a lot, of course, on how badly that person wants the information he/she thinks is on the page. NetMechanic offers the HTML Toolbox which checks for bad links, cruddy HTML, page load times at various speeds, and more for a measly $60/yr. A version that checks up to five pages is free. NetMechanic will tell you how fast your page loads at 14.4Kb, 28.8Kb, 56Kb, ISDN, and T1. NetMechanic will also tell you whether any of your links are busted (more on this later) and whether your HTML is riddled with errors. DrHTML offers a similar product. Graphics should be small by design or small thumbnail files that hotlink to bigger pictures, and please...no dancing raisins, tiki torches or blinking eyeballs. Are they adding enough content and wonderfulness to justify their load? NetMechanic's free GIFBot tweaks your graphics and suggests possible "lite" versions. Lighter weight graphics (a background pattern that is less crisp, for example), can speed up your load time without negatively impacting your site. I used GIFBot to tweak one of my backgrounds, speeding up load time for the background .GIF 89%. KISSBanner ads and pay-per-click graphics on a site slow the load time. Yes, I know you're only trying to bring in a few extra pfennigs, but you may be losing eyeballs as a result. You've seen them, I'm sure: useful sites with wide margins chock-a-block full of pay-per-click links to other sites. Don't unless you must. Weigh the income against the loss of visitors.Spare me as well the lovely graphics that show that you're a member of this Web ring or have won that award. If you must, and perhaps you must, put all those Web ring graphics and/or awards on a separate page that I can pull up if I'm interested. Free graphic images are available in many places on the Web. I'd like to caution, though, against animation, the dancing baby and sites loaded with too many images. "The dancing raisin school of Web design" has encouraged novice Web designers to build sites with messages muffled by overwhelming graphic noise. Backgrounds, pretty horizontal rules, flashy buttons, globes that whirl and mailboxes that open and shut are load hogs and distracting. KISS. Keep it simple, Simon, or your message will be drowned out by the noise. Does It Play In Peoria?Check to make sure your lovely graphics and sidebars and zippy wallpaper work with browsers other than the latest IE. I use Mozilla Firefox for my surfing and come across too many sites that have features that block me out. Current stats (as of April 2009) on one of my sites show the following:IE 6.x 11% IE 7.x 35% IE 8.x 3% Firefox 1.x 26% Firefox 2.x 1% Safari 1.x 19% Netscape 4.x 1% Netscape 5.x 3% ...plus the occasional Opera, WebTV, Konqueror and Unknown. Don't kiss off 50% of your visitors because your whiz-bang IE bells and whistles don't work on other browsers. Check what your site looks like on browsers other than the one you use. I run my Web design against BrowserShots to see how my design looks on other browsers. Over 65% of the folks who use my site are using Firefox or another browser other than the cutting edge IE. Do I want to lose up to 30% of my visitors because my site doesn't "work" for them? Here's an example: IE renders a background bitmap (.bmp) fine. Other browsers don't always. With those browsers the visitor sees the default white background. Do you want this to happen? No? Then use .gifs or .jpgs for your background patterns. A guy whose site I recommend to people recently changed the homepage to "polish up the sponsor notice" and, as a result, the homepage no longer loads for some people. How many visitors is he losing? Simple StuffTrace Research & Development Center has a whole website devoted to Designing a More Usable World. Read the section on designing usable websites (http://trace.wisc.edu/world/web/. Some of the suggestions make a huge difference to your visitors but are simple to incorporate as part of your standard design practice.Some of your visitors, for example, may be surfing blind, either literally or figuratively. Keep the content of your page as text-driven as possible. Some tools "read" the text on a Web page for a blind user. Use the alt modifier in the image tag to add a text description for those who cannot see your image, either because they're blind or because they surf with a text-only browser. Especially annoying are sites that use an image of the text on the page rather than "real" text and then don't use an alt modifier to explain what the image contains. For a blind/text-only visitor, the page is unusable. Remember the colorblind among us. Eight percent of men in the USA and 0.5% of women have some form of colorblindness. I guarantee that some of your visitors will be colorblind and won't be able to read certain color combinations. Putting red text on a black background is more than annoying -- it's impossible to read if you're red/green colorblind. For tips on dealing with colorblindness and other problems, check out Web accessibility by Anitra Pavka from Digital Web magazine. Aries Arditi provides some Web design tips to help your colorblind and impaired vision users and also an article on making text legible: designing for people with partial sight. Spare MeIf you don't use a plain white background, specify text colors to make sure that everyone can see your page as you intended. If someone uses gray as their default font color, for example, the lettering is hard to read against a gray marble background. If you specify the text color, your specification overrides the user defaults.Try to use the "standard" link colors (blue for links and red/purple for visited links) but if you have a background that blends with those colors, change either the link colors or the background. Be aware of the color contrasts between text and background. Make sure the text is dark enough and the color contrasts enough with the background that someone with aging eyes needn't strain to read the text. Noise? Have I mentioned MIDI background music? Don't. Offer a button to click if the visitor really wants to listen to Fur Elise or Purple Haze. Blinking bright chartreuse lettering? Don't. Avoid Java. Avoid frames. Just don't. Design For UsabilityNow that I'm through with my rant on "dancing raisin" websites, let me tell you what you should have on your site.Always have a link to return to the home page. Always have contact information for the webmeister. Date your pages with "last updated" information, if possible. If your page talks about "this June" or "last quarter's results," be sure to date the page. Some people print pages for later reading. Help them out by putting the page's URL somewhere on the page. When they want to return to your site, even if it's months later and they don't have the URL in their cache, they'll be able to check the page and find the URL. I hate horizontal scroll bars. Vertical scrolls I can deal with: that's more like paging through a book. Don't ask me to use a horizontal scroll on your site. Don't use those graphic borders with a left-hand border graphic. My screen is set so that the graphic repeats one-half or two-thirds of the way across the screen, blocking out your content. Links And Dead LinksDid I mention links earlier? Did I mention that NetMechanic has a nifty package that will check for dead links for you for $60/yr and that NetMechanic and DrHTML check a couple pages, including a given number of links, for free?Don't ever have a list of links that includes many dead links or you'll lose your visitor's trust. Spend time weeding your links and keeping them current. When I find a new writing site with a links list, the first thing I check is whether they link to Inkspot.com. Inkspot.com died in Spring 2001. The link now directs you to somewhere else entirely. Anyone with a current link list or half-way clued in to the online writing world wouldn't have this link on their site. TINSTAAFLThere is no such thing as a free lunch...and there's no such thing as a free website, either. For Pete's sake, spring the $60+/yr for a "real" host. When I click into your [realnamehere] site and find http://members.aol.com/... or some other freebie host, the effect is less than professional. Get a domain name with mail services. Ditch the Yahoo! e-mail and the freebie hosting account.GoDaddy has domain name registration for ~$10/yr with two-year registration and has sales frequently. GoDaddy also provides Web hosting at reasonable prices. Part of the price you pay for a "free" site is the bloated code produced by the "free" site's WYSIWYG Web design tools. Learn basic HTML. Use Notepad or some other text editor to write simple code to begin with. Get more whiz-bang as you learn. Easy Designer and such are crutches. Want to read more about good Web design? Hie thee over to the Yale Web Style Manual. Check out Jakob Nielsen's website and his " Top Ten Guidelines for Homepage Usability" and " Top Ten Mistakes in Web Design". Rummage through my collection of Web design links. True ConfessionsConfession: I haven't implemented all the suggestions I outline here on all the pages on all my sites, but I'm working on it. I have managed, though, to avoid the dancing raisins.About the Author
Sal Towse spends her waking hours writing, surfing the Net (research!), loitering in Usenet newsgroups, and goofing around on Twitter and Facebook when she isn't sitting crosslegged on the deck watching events unfold from her perch above the San Francisco Bay, exploring the nooks and crannies of the City or curled up with a good book. You can find her at http://www.towse.com.
Have comments about this article? © Reproduction or other use without permission -- don't. You are here:http://www.towse.com/articles/designrant.htm A version of this article was originally published September 2002 in Computer Bits Links checked Apr 2009. This page was last updated on 2009-04-26. |