Site hosted by Angelfire.com: Build your free website today!
Digital Reference
A complete Back to Basics Tutorial Guide
 
HTML Basics
Web Page Design Doing Graphics Justice

Web page designing is not as simple as it looks. There are still many considerations to consider in order to attract readers in your content. Considerations such as text, page length, graphics, and color, are important factors that will affect your page. It is always a good idea to plan before you start creating your Web page.
Consider these particular questions when creating your own Web page:

  • What's the purpose of the page?
  • Are you providing a service, a product, or entertainment?
  • Who is your intended audience?
  • How do you intend to structure information?
  • How many links will you include?
  • How many pictures, sounds, and movies should you use?
Graphics add a lot oto the appeal and content of a page but poor use can also frustrate readers or keep them from understanding the message you're sending them.These guides may help in providing a good use of graphics in your Web page:
  • Keep images small. Aim to keep the total file size of images on a page less than 30K.
  • If you consider to use large images, it would be better to use thumbnails and then linking them to the full-size copy.
  • Use backgrounds intelligently. Don't let your backgrounds interfere with your message.
  • Color contrast is not enough in a background. it needs to be very light for dark text and very dark for light text.
  • Background that contains an image should have low contrast so as not to be distracting.
  • Web browsers make use of two image formats: GIF(Compuserve Graphics Interchange Format) and JPEG(Joint Photographic Experts Group). JPEG works best for photos and continuous tone images. GIF works best for inline images, line art drawings, most logos, and screen dumps.
  • Always enter an alternative description for your graphics so that readers using text-based browsers will see the alternate text description and those using graphical browsers will also see something if the image fails to load.
Using Different Browsers Taking Stock of Colors and Fonts
There are a lot of browsers available that can be used to view the Web. The problem is that different browsers view HTML files differently. In this, it is important to consider these particular guides:
  • Don't let your documents become dependent on features that may not be available in other browsers.
  • Using tags that are not supported in a different browser may not look the same as what you see.
  • In using graphics always provide alternative text.
  • Always assume that the screen size, number of available colors, and screen resolution of a user is different from yours, even if they use the same browser.
  • Concentrate more on content and use design options just to enhance your page.
Since you have unlimited use of colors and font styles, you can always make use of any combinations. But using too much of these may result in a more frustrating attitude of your reader and a harder time to grasp your message. It is always important to keep your readers focused on your content thus making your page easier to read. These guides may be able to help you in your consideration of these aspect of design:
  • Consider typography as the tool you use to paint patterns on the page. Good typography depends on the visual contrast between one font to another and the contrast between text blocks and the surrounding empty space.
  • Avoid overusing boldface, italics, and multiple font styles in your text.
  • Making text uniformly bigger doesn't help at all, and only contributes to making the page longer.
  • Boldface fonts become monotonous very quickly, because if everything is bold, nothing stands out, and it looks as if you're shouting at your readers. Using all uppercase can have the same effect.
  • Choose a few heading styles to organize your content and then use your chosen styles consistently.
  • Regular, repeated patterns help readers quickly establish the location and organization of your information, and increase the overall legibility of your pages.
  • Use white space judiciously. Don't blank lines or horizontal rules everywhere or your pages will look choppy.
  • Light pastel backgrounds are best for reading substantial amounts of text.
Setting Page Length Finishing Touches
Current PC monitors make use of the 640x480 pixels on 13- to 15-inch screens. This makes us limited in the aspect of page length. Because of this, it is good to consider these guides:
  • Present your information in short and clear segments so that it will be easier to keep it concise.
  • Write a page not longer that two to three 640x480 screen of information, including local navigational links at the beginning or end of the page layout.
  • Keep related information in a single Web page so that printing and saving will be easier.
These elements are considered the hallmarks of the work of a professional Web Author:
  • Headers: A consistent titling design at the top of your Web page allows your readers to immediately know what the main point of the document is, and what relationship the page might have to other pages in a related group. Graphics placed above the main heading should not be so large that they force the title of the page on a standard office-size monitor to go off the screen.
  • Footers: Ideally, each page should have a footer that contains your name, organization, navigational elements, copyright information, and revision/change dates.
  • Email Address: Like any fine work of art, a good Web page should have a signature or some other form of contact information. You can provide a link to an email form your reader can use to send comments and feedback to you.
  • Navigation: Include a target to your top level on each page so readers have a quick way of returning to the beginning. It also helps to include links to an index or table of contents, other sections, and previous and next pages. You might want ot add these targets to the bottom of the page, so the reader always knows where to find them. If your links only flow downward from the home page, the pages in your document will becaome dead ends.
  • Links: Avoid the "click here" syndrome when defining a link. Readers have to remember where they're going to once the jump to another page. It's better to link words and phrases that are meaningful part of a sentence. If you use links to items on the same page, remember to use relative links rather than absolute links so that the browser need not reload the page each time a link is selected.
  • Time Stamp: Date your revisions and indicate those pages that have been changed or are new additions.
Providing Good Content  

Although graphics may attract readers to your page, the content of your page generally gives off the value of your page. These guideliines may help you create good content for your page:

  • Use graphics and color and vary the font size to enhance your page, but be sure that your page also works even when viewed as straight text.
  • Always include an alternative text for your graphics.
  • Lessen your text. People will always skip text that seem non-essential. They don't like to scroll and often scan a page only for hypertext links before they decide their next destination.
  • Settle on as few heading styles and subtitles as necessary to organize your content, then use them consistently.
  • Use heading levels in order. Use heading levels to indicate structure as they were intended for.
  • Avoid overusing boldface, italics, and multiple font style in your text. You may insert horizontal lines to separate sections in your documents.