Web Page Development Guide

Organization
Adding Emphasis
Special Characters

Organization

Before you begin putting text onto your web pages, it is a good idea to have a plan of what information you want to present, and how to best present that information to the global community. Give some thought to the general layout and organization of the information. Keep in mind that your pages will be accessible by people from all walks of life, all demographic groups, and from all over the world.

Once you have a good idea of what information you want to present and the general organization, it is time to look at the content of each web page. Again, organize the information. The main topics you put on each of your pages should be related to each other and directly related to the topic of the page.

"Information Overload" is also a common mistake of web publishers. Take a look at the amount of information you plan on presenting on each of your web pages, If the amount of text is more than 1½ to 2 pages of printed text, You should consider adding more pages to your site or trimming the information down. When web pages are information overloaded people tend not to read them. A long page takes longer to load than a shorter page and their mouse finger gets itchy and they click away from the page before the information is ever presented.

The exact opposite of Information Overload are pages with very little content. Every web page takes time to load up. A page with only one paragraph will take virtually the same amount of time to load as a page with several paragraphs. In this case people will tire of waiting for each page to load up only to get a small tidbit of information and have to wait for the next page of your site to load up. Instead you should consider incorporating the information on to fewer pages, even if the information isn't necessarily related to the topic of the page.


Adding Emphasis

Adding emphasis is easy, all it takes is adding some simple HTML right along with the rest of your text. Bold text is accomplished by placing the HTML tag( a letter or set of letters inside the <*> marks) for bold text immediately before the text and the "closing" tag (the same letters as the initial tag but with a slash to denote closing </*>) immediately after the text you want in bold.

Example:
this text is not bold: <b> This text will be in bold. </b> This <b>word</b> will be bold.

The output is this:
This text is not bold: This text will be in bold. This word will be bold.


Another HTML tag that helps to add emphasis is the <em> tag.

Example:
This <em>word</em> will be emphasized.

Output:
This word will be emphasized.

Another way to organize information and add emphasis is to use the Ordered List and Unordered List tags. The Ordered List tag <ol></ol> places your information into a numbered list, these tags are used in conjunction with the List Item tag <li>.

Example:
The components of a home computer are;
<ol>
<li>The Computer Console
<li>The Monitor
<li>The Keyboard
<li>The Mouse
<li>The Speakers
</ol>

Output:
The components of a home computer are;

  1. The Computer Console
  2. The Monitor
  3. The Keyboard
  4. The Mouse
  5. The Speakers

An Unordered List <ul></ul> works the same way, except instead of numbering the List Items, browsers use bullets.

Example:
The components of a home computer are;
<ul>
<li>The Computer Console
<li>The Monitor
<li>The Keyboard
<li>The Mouse
<li>The Speakers
</ul>

Output:
The components of a home computer are;
  • The Computer Console
  • The Monitor
  • The Keyboard
  • The Mouse
  • The Speakers

The final (and most complicated) HTML we allow within the text is called "nesting". By combining these tags within one another, you can create different levels of emphasis on your page.

Example:
The components of a <b><em>Home Computer</b></em> are;
<ol>
<li>The Computer Console
<ul>
<li>The Motherboard
<li>The Processor
<li>The Video Adapter
<li>The Sound Card
<li>The Modem
</ul>
<li>The Monitor
<li>The Keyboard
<li>The Mouse
<li>The Speakers
</ol>

Output:
The components of a Home Computer are;
  1. The Computer Console
    • The Motherboard
    • The Processor
    • The Video Adapter
    • The Sound Card
    • The Modem
  2. The Monitor
  3. The Keyboard
  4. The Mouse
  5. The Speakers

Special Characters

Special Characters are non-standard ASCII Characters not allowed on this server and will not display properly on a web browser without the proper HTML code. The following are non ASCII Characters:
< > & " ­   © ® ™ — – ¹ ² ³ ¶ · « » ¼ ½ ¾ £
á â æ à å ã ä ç é ê è ð ë í î ì ï ñ ó ô ò ø õ ö ß þ ú û ù ü ý ÿ
Á Â Æ À Å Ã Ä Ç Ð É Ê È Ë Í Î Ì Ï Ñ Ó Ô Ò Ø Õ Ö Þ Ú Û Ù Ü Ý