Basics of Web Design

Graphics

1. Think small, like 10-12KB per image. Yes, depending on the source, the number of broadband users is going up. But slow pages are still really annoying, even if you're on a T1. And huge images are a primary cause of slow pages. It's easy to optimize your images.
2. Always use graphics that fit the content. Just because you have an adorable photo of your dog doesn't mean you should have it on your Web site about Web Design (sorry, Shasta...). The main exception I would make to this is for "design" images. These are photos or graphics that help make up the design of the page, and are not intended to illustrate the content.
3. Do not use images that blink or move or change or rotate or flash or do anything on your page. Or use them sparingly. There have been many studies that show that flashing graphics are distracting and annoying to people. In fact, in one focus group I watched the browsers actually physically cover up flashing graphics so that they could read the rest of the page.

   Layout

4. Stick with standard layouts. I've seen some pages that use 6 or 8 frames on one page. Another site used a layout where you had to scroll to the right to read everything on the page (but you never had to scroll down). These layouts are cute, and you might find them fun to build, but they will drive your readers nuts. The reason that the 3-column layout is so popular on Web sites and newspapers is because it works. You might think it's boring, but you'll keep more readers if you stick with something simple that they can understand.
5. Whitespace is more than the CSS property, it is a function of your layout. You should be aware of the whitespace on your pages and how it affects how the content is viewed. Whitespace is just as important in a Web layout as it is in a paper layout.
6. Use your graphics as elements in your layouts. Graphics can be more than just graphics when you use them as actual elements in your layouts. An extreme example is when you wrap text around an image, but any image you have on your site is a layout element and should be treated as such.

   Fonts

7. Serif for headlines and Sans-Serif for text. If you've taken any type of print design, this might be exactly the opposite of what you were taught. But the Web is not print. Sans-serif fonts are much easier to read on computer monitors because the screen resolution is not as high as in print. If you use serif fonts for normal text, the serifs can blur together on the screen making them hard to read. Your printer friendly page should use the opposite fonts (serif for headlines and sans-serif for text).
8. Limit the number of different fonts. One of the best ways to make your Web site look amateurish is to change the font over and over. Sure, it's possible to do, but limiting your page and site to 2 or possibly 3 standard font families is easier to read and looks more professional.
9. Use standard font families. Yes, you can choose to use "Rockwood LT Standard" as your font on your page, but the chances that one of your readers will have that font as well is pretty low. Sticking with fonts like Verdana, Geneva, Arial, and Helvetica may seem boring, but your pages will look better and the designs look correct on more browsers.

   Advertising

10. Don't be greedy. If you have any control over the number of ads on your site, be aware that your readers are not coming to read the ads, they are coming for the content. If the ads overwhelm the page content, many readers won't stick around long enough to read your purple prose. Yes, it's important to make money from your Web site, but if your ads drive people away, you'll ultimately lose money.
11. Treat ads as you would any other image. Keep them small, avoid blinking/flashing, and keep them relevant. Just because you can have an ad on your site, doesn't mean that you should. If the content is relevant to your readers, they're more likely to click on the ad.

    Remember Your Readers

12. Test your pages in multiple browsers. Writing Web pages that work only on the most modern browser is both stupid and annoying. Unless you are writing a Web site for a corporate intranet or a kiosk where the browser version is completely fixed, you'll have problems with people not being able to view your pages.
13. The same is true for operating systems. You can't assume that just because your page works in IE5.0 for Windows it will work in IE5.0 for Macintosh.
14. Write content that they want. Unless you're writing a site purely for yourself (and if you are, why is it posted to the Web?), make sure that your content covers topics that your readers want to read.

By Jennifer Kyrnin, About.com

Basic Considerations For Web Design

Successful web design centers around the principle of always considering the experience of the audience first and foremost. Thus, before creating a website or webpage and uploading it to the Internet, the webpage designer must consider the website 's anticipated audience and/or targeted market. What will their experience be? Doing so aids the web designer in defining the purpose of the website or webpage under construction and helps determine what content and features should be included in the design.

Who Is Your Audience?

Consider who the people are that are expected to visit the website under construction? Consider the purpose for which the audience will seek out this specific website or webpage. What exactly will they be looking for? Why? In doing so, the designer will be well served to examine the key words that describe sister pages on the same web domain, as well as competitive sites that show up for these same key words in a general search query.

Experienced web designers recommend drawing up a profile of who a website 's visitors are likely to be, taking into consideration the following variables:

* Audience Characteristics
* Information Preferences
* Computer Specifications, and
* Web Experience

Designing the layout and content of a webpage with these factors in mind, rather than tailoring its focus and function afterwards, is more likely to deliver the desired content to the targeted audience or market demographic.

What Is the Purpose?

Writing out a "purpose statement" that sets out the website 's principle objectives will help keep the focus on what the website will accomplish for its targeted audience. Is the principle purpose of the site informational, or is the website or webpage marketing a product or service to its targeted audience? What are the short-term and long-term goals for the webpage or website? Do . . . or will . . . these goals change over time? How?

The short and long term purposes of the particular webpage will determine the features and scope of the content that initially needs to be provided for the targeted audience, as well as the links and functions that need to be built in to allow users to navigate around the web domain the page sits in. As the "purpose statement" is developed, the content that needs to be provided for users will become more or less self-evident. As construction of the webpage nears completion, checking the content you have included to the page 's purpose statement will be an important check to ensure the webpage functions as it should, not only in the HTML behind the page but, equally important, from the user 's perspective.

What Content Will Users Need or Expect?

Listing and organizing the content and features that users will expect or require should be done with reference to the purpose statement for the webpage or website. Organizing the features and content of the page or site with an eye both to the audience and purpose statement will help focus the theme of the page or site. Content and features that are superfluous to the main purpose of the site should be removed. Each page should have its own focus, segregating individual purposes to separate pages will help enhance the user 's experience - provided well-defined links and navigation tools are included in the overall website design.

Now What?

Once you have set up the webpage or website, it is time to move to the beta phase. Test the site 's effectiveness and usability with a focus group that has the same characteristics as your targeted audience. If this is not feasible, at a minimum invite one or more persons who have not been involved in the planning and layout process to give it a test drive, so to speak. Feedback regarding user experience is the optimal way to tune up a page 's or site 's functionality before it is uploaded. Once your focus group has given the site or page a thorough testing ask these individuals to compare their experience to the goals and objectives that were listed in the purpose statement.

About the Author

Smith & Saunders are leaders in Web design in Cambridge, England. They have been in business since 1980 and have a proven history of creating award-winning online marketing solutions. Visit Smith & Saunders online, or call 07768 255967 to speak with a representative from one of Europe 's pioneering and most experienced Web design firm.

Article Source: Content for Reprint