Designing web pages has never been easier. Numerous WYSIWYG (What You See Is What You Get) software programs available on the market allow everyone to create functional web pages in an instant. Unfortunately, they don't curtail our tendency to over-design, nor do they guarantee our sites will be both practical and visually appealing. After making all the most common mistakes, in time we learn few simple rules that help us design accessible, useful and elegant web pages.
Four Colors
Black and white, as every artist will tell you, are not colors. Well, they are in web design. And they are your most important, basic colors, used primarily for background (white) and text (black). You have two more colors to add for just about everything you would like to highlight on your site: logo, links, headings... Rule number one is the bullet-proof insurance you will never go overboard and create a migraine-inducing mess of a page.
Center Nothing
We have all tried it at some point - struggling to make the collection of various elements on the page 'come together' by centering them. We thought it looks nice and orderly if it's neatly grouped in the middle. Well, it doesn't work. It makes the site look amateurish, it is difficult to follow through and very difficult to read. Left to right and top to bottom is how we read, it is how we scan the page and it is the way your web page should be layed out, if you want people to stay and get interested in the content you worked so hard to make available.
White Space
Leaving enough room for each element of your page to breathe is essential. You must have seen the sites where images and text are crammed in like potatoes in a sack, struggling for space and attention. Images that are too big, heavy blocks of text without breaks, links bunched in so close it takes a sharp-shooter to click on the right one are the kinds of things that make you reach for the back button before the page is fully opened. White space is web designer's prime assistant: it helps her organize the content and make it visually appealing and pleasant.
Subtlety
Once we get our hands on any better graphic program, we tend to go crazy over effects we can now, finally, create. So we start adding shadows on just about everything and buttonizing even the pictures of our pets. Long time ago the fact I couldn't make a big round button (with shadow!) for every page as a link to my homepage was absolutely killing me. I think I spent a week on that "project" and discarded it about a month later when I learned it might not be as cool as I thought it was. Subtlety is a hard thing to achieve, but it is the main reason why well designed web sites are easy on the eyes and pleasant. It doesn't mean nothing should be bold and bright, it just means that if some part of the web page is bold and bright everything else has to be subtle.
Separating Apples and Oranges
Text should always be text, never an image. Logo is the only exception, since it is usually a graphic that includes textual part. Transforming blocks of text into images and pasting them on web pages makes search engines think there is no content - there is nothing to index except images. And images by themselves cannot provide any decent placement in search engines, because none of the keywords are legible to search engine spiders.
Organize
Think of all the things you want to put on web site in groups. This is like cleaning up: plates should go in the kitchen, towels belong in the bathroom, jeans, socks and t-shirts in the closet or, more likely, in the washer, and so on. You have to have a separate place for each group of items you would like to publish. These translate to sections or pages of the site. Each separate page needs to be further organized, to allow for easy access to the main content and to other pages and sections. On a single page, you need to have a place for logo, a place for links, a place for your copyright and personal information. Keep these sections in the same location throughout the site and your visitors will enjoy a pleasant and easy stroll through your portion of the cyberspace.
Prioritize
Is the picture of your pet really the most important message of your entire web site? If not, then it shouldn't be the largest image you have and at the very top of your home page. Think of your home page as of your window display: the most important things I can find on your site should be there. That doesn't mean that EVERYTHING you have on your site should be crammed in your window display, just the most important parts. When I get in I'll find more good stuff, but don't chase me away with the entrance that looks like a marketplace after the flood, because I'm not going to waste my time digging through the pile to find something that might interest me. Invite your visitors with few well chosen, nicely displayed items, and let them find the rest on their own.
Mind Your Fonts
Two fonts are all you'll ever need for the entire site. Actually, one is more then enough, but some people like to use a different font for their links or headings and that cannot hurt. More then that, though, is too much. Nowadays, there is a flood of painfully designed web sites with itsy-bitsy tiny fonts most people can hardly read. The idea that small is beautiful is fine, only beauty is not the only purpose of web sites - they usually have some information to convey. And if the information is barely legible, regardless how beautiful, the site fails. So, keep your fonts to a healthy, medium size, allow some space between text lines and choose one easy to read font for all your text.
Be Square
Making people scroll horizontally, rather then vertically, leading them through a labyrinth of "rooms" instead of pages, placing unusually shaped weird objects instead of list of links and, generally, trying to re-invent the wheel doesn't add anything but frustration to surfer's experience. In this sense, web site is very much like a book or magazine and it should comply with certain rules in order to be fully accessible and re-visited. Granted, there are some books in rather weird formats that were published, but how many of those do you keep on your shelves? At some point, we all thought white background is boring and black text is dull as dull can be, but when you visit the web sites featured on Best of the Web, CSS Zen Garden etc, guess what? Over ninety percent of those amazing, gorgeous sites have the boring white background and super-dull black text! So, don't boldly go into the unknown with your site, or no one will ever find it.
Simplify
Learning to discard the non-essentials is probably the hardest rule of all. Over time we tend to create collections of cute little icons, buttons, arrows, borders, animated gifs that are just perfect for our stuff, and hundreds of megabytes of images - flowers, kittens, pink bunnies, white puppies, purple hearts - you name it! None of it is necessary, none of it serves to promote our message, most of it has nothing to do with our message to begin with, but IT'S SO CUTE and irresistible that we have to paste it somewhere. Don't. And if you did, start removing all the non-essentials, today. Essential to your web site are only those things that work hand-in-hand with your content, where connection is obvious and doesn't need to be explained to anyone. Ask yourself if it's absolutely necessary to have certain parts of text blue, or purple or yellow. Would it be just fine if it was simply black? Will your page lose the clarity and importance if the bear-smelling-flower animated gif wasn't there? Would we know what your site is about if you didn't have those 45 smileys there? Would we, perchance, enjoy visiting your site more often if you didn't stop to greet us on five welcome-enter-hello-thanks-for-visiting-pages before we finally hit the home page? So, get rid of the clutter, dust your site off and make it useful.
Svetlana Novko is an artist, writer and iconographer. Her short stories were published by Literary Word, Student Magazine and Writer's Journal. She currently resides in Vancouver, Canada. Visit Svetlana's iconography website, or her blog for views on current issues in politics, art and design.
Disclaimer: All information on this site is provided for informational purposes only! By no means is any
information presented herein intended to substitute for the advice provided to you by any health care or other professional
or organization.