When you start designing a Web site, your options are wide open. Yet all that potential can lead to problems that may cause your Web site to fall short of your goals. The following list of design mistakes addresses the needs of commercial Web sites, but it can easily be applied to personal and hobby sites and to professional nonprofit sites as well.

1: Failing to provide information that describes your Web site

Every Web site should be very clear and forthcoming about its purpose. Either include a brief descriptive blurb on the home page of your Web site or provide an About Us (or equivalent) page with a prominent and obvious link from the home page that describes your Web site and its value to the people visiting it.

It’s even important to explain why some people may not find it useful, providing enough information so that they won’t be confused about the Web site’s purpose. It’s better to send away someone uninterested in what you have to offer with a clear idea of why he or she isn’t interested than to trick visitors into wasting time finding this out without your help. After all, a good experience with a Web site that is not useful is more likely to get you customers by word of mouth than a Web site that is obscure and difficult to understand.

2: Skipping alt and title attributes

Always make use of the alt and title attributes for every XHTML tag on your Web site that supports them. This information is of critical importance for accessibility when the Web site is visited using browsers that don’t support images and when more information than the main content might otherwise be needed.

The most common reason for this need is accessibility for the disabled, such as blind visitors who use screen readers to surf the Web. Just make sure you don’t include too much text in the alt or title attribute — the text should be short, clear, and to the point. You don’t want to inundate your visitors with paragraph after paragraph of useless, vague information in numerous pop-up messages. The purpose of alt and title tags is, in general, to enhance accessibility.

3: Changing URLs for archived pages

All too often, Web sites change URLs of pages when they are outdated and move off the main page into archives. This can make it extremely difficult to build up significantly good search engine placement, as links to pages of your Web site become broken. When you first create your site, do so in a manner that allows you to move content into archives without having to change the URL. Popularity on the Web is built on word of mouth, and you won’t be getting any of that publicity if your page URLs change every few days.

4: Not dating your content

In general, you must update content if you want return visitors. People come back only if there’s something new to see. This content needs to be dated, so that your Web site’s visitors know what is new and in what order it appeared. Even in the rare case that Web site content does not change regularly, it will almost certainly change from time to time — if only because a page needs to be edited now and then to reflect new information.

Help your readers determine what information might be out of date by date stamping all the content on your Web site somehow, even if you only add “last modified on” fine print at the bottom of every content page. This not only helps your Web site’s visitors, but it also helps you: The more readers understand that any inconsistencies between what you’ve said and what they read elsewhere is a result of changing information, the more likely they are to grant your words value and come back to read more.

5: Creating busy, crowded pages

Including too much information in one location can drive visitors away. The common-sense tendency is to be as informative as possible, but you should avoid providing too much of a good thing. When excessive information is provided, readers get tired of reading it after a while and start skimming. When that gets old, they stop reading altogether.

Keep your initial points short and relevant, in bite-size chunks, with links to more in-depth information when necessary. Bulleted lists are an excellent means of breaking up information into sections that are easily digested and will not drive away visitors to your Web site. The same principles apply to lists of links — too many links in one place becomes little more than line noise and static. Keep your lists of links short and well-organized so that readers can find exactly what they need with little effort. Visitors will find more value in your Web site when you help them find what they want and make it as easily digestible as possible.

6: Going overboard with images

With the exception of banners and other necessary branding, decorative images should be used as little as possible. Use images to illustrate content when it is helpful to the reader, and use images when they themselves are the content you want to provide. Do not strew images over the Web site just to pretty it up or you’ll find yourself driving away visitors. Populate your Web site with useful images, not decorative ones, and even those should not be too numerous. Images load slowly, get in the way of the text your readers seek, and are not visible in some browsers or with screen readers. Text, on the other hand, is universal.

7: Implementing link indirection, interception, or redirection

Never prevent other Web sites from linking directly to your content. There are far too many major content providers who violate this rule, such as news Web sites that redirect links to specific articles so that visitors always end up at the home page. This sort of heavy-handed treatment of incoming visitors, forcing them to the home page of the Web site as if they can force visitors to be interested in the rest of the content on the site, just drives people away in frustration. When they have difficulty finding an article, your visitors may give up and go elsewhere for information. Perhaps worse, incoming links improve your search engine placement dramatically — and by making incoming links fail to work properly, you discourage others from linking to your site. Never discourage other Web sites from linking to yours.

8: Making new content difficult to recognize or find

In #4, we mentioned keeping content fresh and dating it accordingly. Here’s another consideration: Any Web site whose content changes regularly should make the changes easily available to visitors. New content today should not end up in the same archive as material from three years ago tomorrow, especially with no way to tell the difference.

New content should stay fresh and new long enough for your readers to get some value from it. This can be aided by categorizing it, if you have a Web site whose content is updated very quickly (like Slashdot). By breaking up new items into categories, you can ensure that readers will still find relatively new material easily within specific areas of interest. Effective search functionality and good Web site organization can also help readers find information they’ve seen before and want to find again. Help them do that as much as possible.

#9: Displaying thumbnails that are too small to be helpful

When providing image galleries with large numbers of images, linking to them from lists of thumbnails is a common tactic. Thumbnail images are intended to give the viewer an idea of what the main image looks like, so it’s important to avoid making them too small.

It’s also important to produce scaled-down and/or cropped versions of your main images, rather than to use XHTML and CSS to resize the images. When images are resized using markup, the larger image size is still being sent to the client system — to the visitor’s browser. When loading a page full of thumbnails that are actually full-size images resized by markup and stylesheets, a browser uses a lot of processor and memory resources. This can lead to browser crashes and other problems or, at the very least, cause extremely slow load times. Slow load times cause Web site visitors to go elsewhere. Browser crashes are even more effective at driving visitors away.

#10: Forgoing Web page titles

Many Web designers don’t set the title of their Web pages. This is obviously a mistake, if only because search engines identify your Web site by page titles in the results they display, and saving a Web page in your browser’s bookmarks uses the page title for the bookmark name by default.

A less obvious mistake is the tendency of Web designers to use the same title for every page of the site. It would be far more advantageous to provide a title for every page that identifies not only the Web site, but the specific page. Of course, the title should still be short and succinct. A Web page title that is too long is almost as bad as no Web page title at all.

Share on Facebook

What You Should Already Know Before you continue you should have some basic understanding of the following: * HTML / XHTML If you want to study this subject first, find the tutorials on our Home page. What is CSS? * CSS stands for Cascading Style Sheets * Styles define how to display HTML elements * Styles are normally stored in Style Sheets * Styles were added to HTML 4.0 to solve a problem * External Style Sheets can save you a lot of work * External Style Sheets are stored in CSS files * Multiple style definitions will cascade into one CSS Demo With CSS, your HTML documents can be displayed using different output styles: See how it works Styles Solve a Common Problem HTML tags were originally designed to define the content of a document. They were supposed to say "This is a header", "This is a paragraph", "This is a table", by using tags like <h1>, <p>, <table>, and so on. The layout of the document was supposed to be taken care of by the browser, without using any formatting tags. As the two major browsers – Netscape and Internet Explorer – continued to add new HTML tags and attributes (like the <font> tag and the color attribute) to the original HTML specification, it became more and more difficult to create Web sites where the content of HTML documents was clearly separated from the document’s presentation layout. To solve this problem, the World Wide Web Consortium (W3C) – the non profit, standard setting consortium, responsible for standardizing HTML – created STYLES in addition to HTML 4.0. All major browsers support Cascading Style Sheets. Style Sheets Can Save a Lot of Work Styles sheets define HOW HTML elements are to be displayed, just like the font tag and the color attribute in HTML 3.2. Styles are normally saved in external .css files. External style sheets enable you to change the appearance and layout of all the pages in your Web, just by editing one single CSS document! CSS is a breakthrough in Web design because it allows developers to control the style and layout of multiple Web pages all at once. As a Web developer you can define a style for each HTML element and apply it to as many Web pages as you want. To make a global change, simply change the style, and all elements in the Web are updated automatically. Multiple Styles Will Cascade Into One Style sheets allow style information to be specified in many ways. Styles can be specified inside a single HTML element, inside the <head> element of an HTML page, or in an external CSS file. Even multiple external style sheets can be referenced inside a single HTML document. Cascading Order What style will be used when there is more than one style specified for an HTML element? Generally speaking we can say that all the styles will "cascade" into a new "virtual" style sheet by the following rules, where number four has the highest priority: 1. Browser default 2. External style sheet 3. Internal style sheet (inside the <head> tag) 4. Inline style (inside an HTML element) So, an inline style (inside an HTML element) has the highest priority, which means that it will override a style declared inside the <head> tag, in an external style sheet, or in a browser (a default value).

Share on Facebook