Designing Your Site
Whether you're a student trying to lure potential employers to hire you, a department trying to recruit students, or a business trying to sell a product or service, you want your website to look its best. Guidelines and tips are offered here to help you design your site.
A. Select your content carefully
Content is the most important aspect of your website. Keep in mind that people come to your site to get information. No matter how many hours you've spent scanning or animating graphics, if you're not delivering the content that people want, they won't stay very long and they probably won't return.
B. Define your purpose
Before you start to plan your website, determine why you're developing a site and what you hope to achieve. After you design your site, or if you already have a site, look carefully at your site and ask yourself the following questions:
C. Update your site frequently
A website with a schedule of events from last year looks unattended. If your site features up-to-date information, include the date of your update.
D. Display important information prominently
Don't bury important information in long paragraphs or in pages embedded deep in your website.
A. Lay out the text first
Before you concern yourself with graphics, you should lay out the text of your web page first. The content and the layout of the text should then suggest the types of graphics you need and the best placement for them.
B. Use long pages for printing or downloading
Printing or downloading one page is easier than handling several pages. You can help your visitors read through a long page by creating a clickable table of contents at the top with internal links to specific sections on the page. You can also include a hypertext link, such as "Return to top of page," after each topic. The drawback of using long pages, however, is that they tend to go on-and-on. Also, a page of 40 Kilobytes (KB) or more may take a long time to fully appear on the screen.
C. Break up topics into shorter pages
To do this, design one index page with links that jump to shorter pages. Each page should treat one subject only. While shorter pages offer the advantage of less viewing time, they are harder to print than longer pages.
D. Provide navigational tools
If you have a complex site with multiple pages, you may want to have one- or two-word designations that allow your visitors to jump to other sections of your website. The most common links include a "home" or "top of page" link and "clickable" images or buttons.
E. Include links to other sites
The power of the web is its ability to link to other pages, but be careful. When a visitor arrives at your site, you don't want to send that person away too quickly. Also, remember to frequently check outside links to make sure that they still exist and have not moved.
F. Use descriptive page titles
The title of your page displays at the top line of your web browser. The title is important because it often shows up in search engines such as Google and as the bookmark name. Make sure your page title accurately describes your site by including key words that people might use to find your page.
A. Condense your text
Edit your text to the minimum that you need to get your message across. Use white space to break up areas of text and avoid sections that contain only long paragraphs.
B. Use headline typefaces sparingly
Normal typeface looks more modest. Otherwise, you risk overkill. Don't use all caps or overuse the bold and italic styles.
C. Make sure your text is readable
Whatever color or texture you choose for your background, don't let the background overwhelm the text. Instead, select a background that subtly complements your text. If your visitors can't read the text, they won't stay.
D. Choose a high-contrast color for your text
For example, use light text on a dark background or dark text on a light background. Avoid using green text on a red background or vice versa. Red and green have the same value (lightness or darkness), so people who are red/green color blind cannot differentiate between the two. If you expect people to print your page, consider using standard black text on a white background.
E. Be consistent
Don't mix and match fonts or colors. Decide on the font style, size, and color and use the same style consistently, even on subpages. The same guideline applies to textured and colored backgrounds. They can unify your pages as long as you are consistent with your choices.
F. Proofread your text carefully
Nothing destroys the professional look of a site more than typos and spelling mistakes.
Avoid using large images
The larger the image, the longer it takes to load the page. The longer it takes to load the page, the more likely your visitors will go somewhere else.
In general, you should avoid using a graphic larger than 30KB. You should also try to limit the total size of your images on one page to less than 40KB. Web browsers are usually set to automatically display images. Don't make your readers wait too long to see them.
A. Choose background colors carefully
Many websites today use a simple white background so that text is easy to read, but you can choose any color. Be cautious, however. Research on color has shown that color can affect how people perceive information. For example, royal blue represents a conservative or traditional approach while gray evokes a feeling of being uninvolved. Red increases blood pressure and heart rate and indicates an urge to achieve results and succeed. Also, you should avoid using bright colors, such as neon tones, because they can be hard to look at for too long.
B. Avoid large backgrounds
There are lots of sites on the Internet where you can get free backgrounds for your site. Be careful though about selecting one of these backgrounds. Some are "too busy" and distracting and many are large and, therefore, take a long time to load.
A. Use special effects sparingly
This is one instance where the old saying "less is more" applies. Have you ever browsed a page with several blinking text items or animations going on simultaneously, or a page with five or six frames, each tiled with a different background image? Then you know that too many special effects can be irritating. Use special effects, such as frames and animations, conservatively and tastefully to enhance your web page. You don't want to overwhelm or annoy your visitors.
B. Avoid copyright violations
The current copyright laws and their application to the Internet continues to be a topic of debate. For example, just because art or information is on the Internet, it does not mean that you have the right to copy it. Also, you cannot copy text or images from books, magazines, or other sources and place them on your website. Even using clipart that you have purchased for print may be illegal for use on the web.
Instead, create your own text and, if possible, draw your own graphics. Also, consider purchasing clipart that you can use on the web, such as Art Explosion 200,000 Images.
A. Add horizontal lines
Horizontal lines are effective design elements that you can use to separate different elements on a page. Lines don't take any extra time to download, and you can vary their length and width.
If you wish to spice up your page, consider using color lines. They take a few seconds to download, but they can add a strong design element to your page, especially if you coordinate the lines with the color scheme of your page. Avoid using different types of lines on the same page, and be careful--too many lines can be distracting.
B. Include bullets
You can use bullets to set off lists or to break up the page visually. Color balls, arrows, and pointers are also available, but remember, a little color goes a long way.
C. Use markers
If you want to draw your viewers' attention to new items on your page, you can add colorful markers that identify the items as "New" or "Updated." Again, don't overdo it--one or two markers per page is sufficient. More than that defeats the purpose.
D. Include an e-mail address link
Invite your viewers to contact you by including an e-mail address link on your page. This link will take your visitors directly to a window where they can type and send you an e-mail message.
© 1998. Temple University. All rights reserved.