This Library is a US government depository
RAW HTML
Making it LESS raw, with Colby Glass

- Best book for starting: HTML 4 for Dummies
- Best plain text editor: Note Tab Pro 4.8 (more stable than Notepad; has HTML code built in for reference; download here). This editor is also available in a free version and in a cut-down version that will fit on one 1.44 diskette so you can carry it around with you. This is also the only editor I have found which has two usenet groups devoted to it: notetab@egroups.com and ntb-html@egroups.com . Whatever you do, don't depend on Notepad. It is unstable and will eventually ruin your code. Better yet, don't trust any program--make backups. Note: Note Tab makes automate backups every time you save.
- Best Websites on HTML: PAC LRC page of links on everything about HTML | WebMonkey HTML reference sheet | The HTML Guru | Making Sense of HTML | BigNoseBird.com | and How do they do that?
- Best idea: Campaign for a non-browser specific WWW
- Best general reference tool: PAC LRC Web INDEX: WWWtools
- Best newsletter: Colby's Info.News, a fortnightly revelation for the info-literati.
- Best Web Forum on HTML: ZDnet forums. Scroll down to the DEVELOPER category and click on WEB DESIGN.

NB: If you find something good, PLEASE let me know and I will add it to the above sites. Thanks, Colby.

Why use a WYSIWYG editor?

  1. It's really easy to use. It works just like a word processor.
  2. You can see what you are doing.
  3. It's really easy.

Why NOT use a WYSIWYG editor?

  1. It's really easy to use. You remain an ignorant "newby."
  2. When you finally have to edit the code, you can't.
  3. It automatically changes the code when you open one of your files in the program. The results can be ruined formatting, changed graphics settings, and hours of work to get the page back the way you want it.
  4. Many such editors use non-standard HTML code.
  5. Once you have invested the time to really learn the graphic editor, you are stuck using that editor instead of knowing the underlying code and having direct control.
  6. For the effort you put into learning the editor, you could have learned to use HTML.
  7. Do you want direct control of results, or do you want a program for dummies making the decisions for you?
  8. What do you think will look better on your CV or resumé, another program for dummies or knowing HTML?
  9. Quote from that famous author, Anon: "Eagles may soar, but turkeys don't get sucked into jet engines." ... In other words, the flashy way often leads to trouble.
  10. Code created by an automated editor is usually very hard to read. It is not formatted for reading or for editing.

The Difference Hand Editing Can Make

  •     Take a look at the source code of a page created by an editor (in this case, MS Frontpage. Or this page.
  •     Now take a look at the source code of a page written by hand (click on View Source for this page).
  •     Notice that the hand written page is much more easily read and corrected.


How It's Done

Now take a look at a page of mine created by typing raw HTML. Notice the clean organization and ease of locating sections of the page.

Let's go through a similar page created by MS Word and Netscape Page Composer. Open Notepad and copy this file to it. Save the file to a temporary location on the C drive.

<!doctype... > The first line is not necessary. You can erase it or leave it there.

<meta...  > The three meta statements are not what you really need. Take a look at the other page (the Raw HTML) and you will see that the following is what you need:

<HEAD>
   <META NAME="description" CONTENT="Palo Alto College Library--links to Anthropology information on the Web">
   <META NAME="keywords" CONTENT="anthropology">
   <TITLE>Anthropology</TITLE>
</HEAD>

Note that the head command goes before the body command.

The two meta statements you see are used by search engines to locate keywords and subjects. If you want to be "findable" through search engines you should include these. Otherwise you do not need a meta statement.

The title is what you see at the top of the browser screen.

Going back to the Notepad, notice the &nbsp; after the body statement. This is a spacer and is used far too often by editors. Usually you can just erase them.

Next set off the table by spaces and bunch it together. Make sure the actual text is on the left. Everything you may look for should be placed on the left. Hard returns and tabs in Notepad have
no effect on what you will see on the browser, but they make a huge difference in the readability of the source code.

When you use a <P>, reflect it by hitting return at least twice in Notepad.

When you get to a list, like the one here, tab the coding one to the right, and hit return so that the actual text is on the far left. It makes it MUCH easier to locate things. To see an extreme example of this, look at the Web INDEX page source.

Also, don't let text run off the right side of the Notepad screen. I have seen some pages where the entire source code is one line, running WAY off to the right somewhere. Instead, hit return when you get to the end of each line, first leaving a space.

Instead of having to remember to update the date at the bottom of every page you work on, just insert the following small Java script:

<script language="JavaScript">
//<!-
var upDate
upDate = document.lastModified;
document.write("<P>Last updated on: " + upDate);
//->
</script>
 

Finally, how would you suggest cleaning up the very bottom of the HTML page?

Any questions or ideas?

The guiding principle here is to make editing and changing the files as easy as possible. It's okay to format your pages in any manner which makes them easy to read for YOU.

If you can't figure out how to do something in HTML, the easiest first step is to use the HTML cheat sheet to the left of the screen in Note Tab, or open a WYSISYG editor, do what you want there, then look at the underlying code and see how it was done.

Also, it's not a bad idea to collect code that you like. When you see a page that does something you admire or need, view the source and copy it. What I do is keep a series of files named prototype.htm with the code I like. It's always handy if I need it.

If you have any suggestions, please write me! Thanks, Colby.