 |
| 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.
|
|
|