Website Design Tips

On many servers the main page of your site is called 'index.htm' and that is a good name for it -- your main page serves mainly as an index of the primary contents of your site, along with a brief introduction. You don't need to try to sell anything on your index page, though you may have some links to eBooks that cover the same topic as your entire site, if they wouldn't 'fit-in' on more specific pages. If you intend to expand the site over time, be sure to make the layout of the main page flexible enough to allow you to add new topics without having to redesign the entire page. Every page on your site should have a link back to this main page -- it is the central navigation point from which all other pages can be reached with one or two clicks. Don't assume your visitors will enter by way of the main page, in most cases they won't, so your link back to the main page will allow visitors to explore the rest of your site.

Think of your site as a shallow pyramid -- unless it is a very large site, you should try to make all pages just one or two clicks from your main page. If your site is about gardening, for example, the main page would introduce the site and your area of expertise, and have links to pages covering broad areas like flower gardens, vegetable gardens and herb gardens. You might also have links to eBooks about gardening in general, though you will want to put as many of those in more specific categories as possible.

Depending on how much material you have for each of these broad categories, the pages they link to can be content and sales oriented, or second-level indexes to detailed topics. Perhaps you will have a single page for flower gardens and one page for herb gardens, with the intention of expanding those areas later, devoting the bulk of your attention to vegetable gardens at first. The flower and herb garden pages will have some general information on the main things your customers need to know about those, and links to recommended eBooks on those subjects. Your vegetable garden page will have introductory information that helps your reader decide where they want to go next, and links to more detailed pages. It will also have links to eBooks about vegetable gardening in general. The third-level pages may cover specific vegetables or families of vegetables, with more detailed advice on how to grow and harvest them, and links to any eBooks about growing specific types of vegetables.

Each page beneath the main index page will be focused on a particular topic -- a broad topic if it is a second level page and a specific topic if a third level page. Those topics are represented by specific key words and phrases -- the words people would be likely to search for when using Internet search engines. In our gardening example, you would want to focus your third-level pages on vegetable gardening around phrases like 'growing tomatoes' or 'tomato gardening.' Your content should focus on the types of information people would be looking for when they type those keyword phrases into a search engine. Each page should be targeted to one keyword or phrase. See Search Engine Optimization for information on how to select the best keywords.

Your site should have a consistent appearance from one page to the next, with the same layout, fonts, and basic graphics. Within that framework of overall design, the specific content changes page to page, but your visitor will know where to find links to your main page and other major areas of the site. Easy navigation within your site will help ensure that your visitor doesn't leave out of frustration at not being able to find anything.

When it comes to designing the overall layout, simple is better. More complex pages load slower, are less likely to be ranked well by search engines, and require more effort to change when you update your site. Simpler pages will also be more compatible with a wide variety of browsers, and hence a wider variety of users. Remember, some people may be viewing your site on a hand-held device with a tiny screen. Others will be using antiquated equipment and software. Sight-impaired users will only hear the text of your site. Make your content accessible to all by keeping the design simple.

Do not use frames. Some search engines will not find your content. People will link to files that are intended to be viewed within a frame. Old browsers will crash or lock-up.

Avoid using flash, animated graphics, java and other special effects just to produce 'gee whiz' gizmos - those quickly become stale and only add bulk to your site, not value. They also increase compatibility problems and may prevent some visitors from being able to see your site at all. People are looking for content when they visit your business site, not entertainment.

On this site we use a database to hold eBook information -- if we were relying on search engines for traffic, that would be a bad idea. Search engines will not find most of your content if you use scripting that creates pages 'on the fly' from a database.

Make graphics small (file size, not necessarily small screen size). Be sure that each page will load in fifteen to thirty seconds, even if your visitor has a slow 28K connection. Use JPEG compression to reduce file size, and experiment with different levels of compression so that you get as small a file as you can without losing essential details in the image.

If you have a large graphic that can't be reduced without losing essential details, consider making a small thumbnail image with a link to the full sized image. That way if people have already seen the image (repeat visitors) or if the user is not interested in it, they don't need to wait for it to load.

Avoid background graphics, they just make text harder to read in most cases. Backgrounds that look fine on your computer may make the text totally illegible on another system.

Always use 'web safe' colors to ensure accurate reproduction of your images. Also, if you need to use colored text (use sparingly or results will appear garish) or backgrounds, use the web safe colors. HTML represents colors with three hexadecimal numbers of two digits each (00 to FF, representing values 0 to 256). The web safe colors are any combination of the hex numbers 00, 33, 66, 99, CC and FF (so there are 216 safe colors).

Never have music that plays automatically -- if you have background music, let the user select to listen by pressing a button. (Many people listen to CD music or MP3 files while browsing, nothing is more frustrating than to have their own choice of music over-ridden by a rude website.)

Keep font sizes large enough to be easily read by all users, not just those who share your monitor size and resolution. Most web pages are designed for 800 x 600 pixel screens, as that is the most common size, but be aware of other sizes and consider how they will look.

If you use tables to organize your content, be aware that search engines will scout through your tables in the order they appear in the HTML text, not the order they appear on-screen. Since greater weight is given to keywords near the beginning of a document, be sure your first table includes the important keywords for that page.

Unless a page is very small, do not include multiple tables in one large all-encompassing table. If you have one table that includes the entire page, nothing will appear in the user's browser until the full page has been downloaded and parsed by the browser. If you have several tables, the first will download and appear first, and the user can read those contents while waiting for lower tables to load. The perceived wait time is much less, so your customer is less likely to get impatient and click away.

Content is the heart of your page, treat it with respect. Write the text out, then let it sit for a couple days so you can come back to it with fresh eyes, and slowly re-read the complete text. Spell check the text. The spell checker doesn't know which witch is which, so proofread the text a second time, paying close attention to make sure it says what you mean, as clearly and concisely as you can state it.