What Makes a Good Page

Write A Page Which Looks Good For Everyone

One problem with publishing on the web is that web pages don't look the same on everyone's computer.

Remember that your web page will be displayed differently by different browsers.
It will be displayed differently by different copies of the same browser, if the preferences are set differently.
You cannot control how wide someone's window will be, what fonts he will use, what size that font will be or even what color the background and fonts will be.
Actually, you can try to control some of these, but depending on a person's browser or the preference settings, you may not be able to control all of them or any of them.
Write a page which will look acceptable on most computers.
- Don't design a page that requires a width of over 450 pixels.
  Screen widths and heights are not standard, any width over 450 pixels may not look good on everyone's computer. Many people with wide screens still prefer to keep their window width at about the width of a standard word processing window.
- Don't use a lot of images.
  Your page will look pretty bad to those who surf the Net with images turned off. Since many potential visitors to ESL/EFL pages are living in countries with slower Internet access, many visitors to your page will not view your images. Depending on how you design your page, it may not even be understood.
- Be careful with colors.
  If you choose non-standard text and background colors, be aware that your page may not be readable by everyone.
- It's better to avoid <FONT COLOR=some color>
- It's OK to define colors in the <BODY> code, if they are chosen well.
Don't waste time trying to fine-tune your page layout to look good at a certain width or height. Don't reword sentences to try to get them to fit all on one line and so on trying to get the page to look "just right" on your computer, because chances are it won't look that way on another person's computer.
To get your page looking good for any computer, may mean that it doesn't look the best it possibly can on your computer. However, it shouldn't look ugly on any computer.
That is why a middle-of-the-road conservative approach is best.
Other reasons to use a straight-forward basic formatting include the following.
- Printing to a printer.
- Speech synthesis for the vision-impaired.
Remember that a good page is not necessarily a polished-looking page, but one which brings in visitors because of its informational content.

Weigh "Good-Looking" against "Fast-Loading"

The faster someone can begin using your page, the more impressed he'll be with it.
Don't overload your page with "cute stuff" which just slows down your page.
Great-looking pages are only great if people wait for them to completely load in. If you put too much stuff in your page (images, buttons, lines, javascript code, etc.) your page will be slow and people are likely to hit the stop button before it completely loads in.
Fine-tune your page to be as fast-loading as possible while keeping it acceptably good-looking. It is possible to make a nice-looking text-only page.
Use few, if any, images. These images should have a small filesize. The physical size of the image doesn't matter as much as the filesize. Most style guides recommend that you use a total no more than 20K for non-content images on a page. Non-content images are things such as banners, page titles, dots, lines, pictures of mailboxes, etc.) Content images would be graphs, illustrations and photographs depending on the topic of your page.
Don't increase your page's filesize by adding things which are of marginal value. Things such as the onMouseOver used to show a message on the status bar add a lot of code to your page if you use it to explain a lot of links. Many people don't bother to read what is on the status bar and those without JavaScript-enabled browsers don't even see it. Adding a lot of different colors to your page by using the table code or by using the font color code also adds a lot of code to your page.
Don't try to show off your HTML knowledge by using a lot of HTML code, rather, show off your knowledge by using the least amount of code to get the job done.
Don't force your visitors to use a frame. If you want to offer a frame, make it the option, not the default.
Don't use SSI, CGI and javascript unless there is a good reason to use them. There are plenty of scripts available on the Internet which allow you to display the date, display a randomly-chosen image, and so on. Avoid the temptation to slow down your page with these.

Offer Content, Offer Something Unique

While it seems obvious that you should offer real "content", many beginning HTML writers get so involved with experimenting with HTML code, that they lose sight of the original purpose of their pages.
There is no need to write a page which duplicates something already online. (How many ESL/EFL Links Pages does the world really need?)
Instead of producing a page which only has links to other people's useful pages, create a page which is useful and let others link to your page.

Style & Layout Considerations

Things which look bad on paper usually also look bad on the web.

It is difficult to read pages in which everything is centered.
It is difficult to read pages with no white space. Put in paragraph breaks. Put in titles and sub-titles.
It is difficult to read a page which is all bold print or all in a headline font.
It is difficult to read text printed on a busy background
It is difficult to read when the background color and the text color don't have a high contrast.
It is difficult to read light color text on a dark color background.
Too much variety kills the effectiveness of a page.
- Avoid too many fonts and font sizes, too many color changes and too many different ways of formatting text.
- Too much variety is probably one of the most common mistakes. The temptation for beginners is too try to use a little bit of every possible HTML code.

Some things which work well on paper, don't work well on the web.

Italics are difficult to read on many computers screens, so should be avoided if possible.
Multiple-column layouts, which works well in newspapers, often requires scrolling down to read the first column, then scrolling up and down to read the next column.

Don't Make Your Page Look Amateurish

A Few 'Marks' of an Beginner
- Too much variety in the layout.
- Too many font size changes.
- Too many colors.
- Bad choice for colors. Background and text colors don't contrast enough.
- Too many images. (No matter how small the image, each one requires a separate connection to the Web server, which takes time.)
- Inappropriate use of HTML, especially TABLES and FRAMES.
- Forgetting to use the HEIGHT, WIDTH and ALT code with <IMG SRC=...> code.
Avoid using images proclaiming "Enhanced for Netscape", "Best heard with Crescendo" and so on.
Make your links meaningful.
- BAD If you like MIDI files click here.
- GOOD Visit Standard MIDI Files on the Net to find sites offering MIDI files.
Headings should never be more than one level below the preceeding level. That is <H3> should follow <H2>.
Never use heading formatting, such as <H3> for all the reading text in the document. It might look okay on your computer, but it won't look good on most computers.
Don't link over and over again.
Just because my name is Charles Kelly doesn't mean that I should make a link every time Charles Kelly appears on pages made by Charles Kelly.

Good Practices

Include your email address at the bottom of the page.
Use the mailto: form, so it is clickable, but also show your address for browsers which don't support the mailto: form.
mailto:iteslj@ge.aitech.ac.jp
<a href="mailto:mailto:iteslj@ge.aitech.ac.jp">mailto:iteslj@ge.aitech.ac.jp</a>
Some people recently have started removing their email addresses to lower the amount of junk mail received. (It's a shame that junk mail has caused pages to be less user-friendly.)
Include the date of the last update.
It is polite to let people know how old the page is.
Include your name.
Links should be blue.
Don't confuse your visitors by changing the color. Remember that some computers may not display links with underlined text.
Visitors should be able to easily get to all of your pages from the main page and quickly find the content which they are most interested in.

Bad Practices

It's poor design to make a 'Front Door Page' or a page with nothing but an image and one clickable link saying "Enter" or "Begin".
Almost as bad are large titles or title images which require the visitor to scroll before being able to read any 'content'.
Assigning the same color to the link color and the visted link color is confusing.
Forcing visitors to use a large window is inconsiderate. Any width assignment which requires a window width of over 450 pixels is poor page design.
Using a muliple column table to form columns like a newspaper is definitely bad. This just requires people to scroll down, then back up to the top of the page, then down again. It also, requires that the whole page be loaded into a visitor's computer before displaying any of it on the screen.
Putting too much information in multiple-columns filling up the whole screen often confuses the visitor who doesn't know where to start.
Recently many personal web pages are offering no real content, but are nothing more than links to other's web pages (which themselves may be nothing but links to other's web pages)
Putting a list of links to other web pages at the top of your page has the potential of luring your reader away from your document.
Black backgrounds or very dark backgrounds seem to be hard on the eye.
Don't decide on what HTML code you want to include, then try to figure out how to use it all.
Decide what you want to present, then use the best HTML code to present what needs to be presented.
Tables should not be used to form multiple columns.
Don't force your visitors to do excessive scrolling.
Wide tables should not be used under the assumption that everyone will view the page using a wide window.
BLINK
Most people find BLINKING irritating, so don't use it.
It's also a little bit hard to read at times. I've even seen people BLINK a whole paragraph.
Don't do lots of font size changes.
Remember that font sizes are not standard on everyone's computer.
A small size may be readable on your computer, but not on someone else's computer.

Special Considerations for ESL Teachers

Offer something useful, something with "meat", something not already found on the Net
A page called "Writing Resources", but which only offers links to other people's pages of writing resources is not really useful. There are plenty of "links" pages already on the Internet.
Separate your personal homepage from your pages for ESL/EFL students.
Keep the picture of your kids and dog, your resume and other personal information on a separate page. Your own students may be interested, but not the whole world.
Your professional image may be shaped by your web pages.
- A poorly-made page may hurt your reputation more than having no page at all.
- Be careful about damaging your reputation by including links to pages which imply things about you. (Joke pages with dirty jokes, cult religions, political parties, legalize pot, etc.)
Keep the English Simple.
Many of your visitors will be non-native English speakers. (This is probably good advice for any web-page writer and not just English teachers.)

Other Considerations

Avoid using these phrases on your page.
- Welcome to .....'s homepage.
- Thank you for visiting my homepage.
- You are visitor number 657856.
  (Does anyone care? Does anyone believe it?)
Avoid offering free advertising or using advertising at all.
- This page is best viewed by ....
- This page awarded .... by ....
- The Internet Link Exchange and similar banner exchange programs promise to bring visitors to your page, but seldom do much more than clutter up your page.
Avoid including too much personal information.
- Passport numbers. (I've actually seen a page with this included.)
- Personal telephone numbers.
- Personal street address.