How Does HTML Work?

| Back | Home | Next |

You can use any text editor installed on your system. The key is that your code MUST be saved without additional formatting codes. Word Processors like Microsoft Word and Word Perfect add special code to the text which is used to identify margins, spacing, font styles, justification and much, much more.

Web pages are straight TEXT. All formatting is done by the browser itself, not by the programs that created the code. For browsers to properly format a web page, a universal standard was adopted for everyone to use. This standard, which details how to format all of the elements of a web page is referred to as HTML.

HTML is straight ASCII text. All formatting of the page, the text, the images, the tables, is done by marking up the text to conform to strict rules. The browser understands these rules, and if your text conforms to these rules, it will display properly on the screen. The process of marking up normal text with formatting codes is mark "mark up", and since the World Wide Web was designed to be one gigantic hyperlinked network, the source code is called HTML, which stands for HyperText Markup Language. It is not a true programming language. The program is the browser, and it is written in its own language. The HTML source code can be processed on any browser, as it is not a program, but merely "marked up" text.

For all this to work, there are certain rules that apply:

  1. The first rule is that the text, called "source code" MUST be ASCII text. That is the characters themselves, used must be universally understood. There can be no hidden code, no proprietary formatting.

  2. The second rule is that all formatting is done with operators called "tags". These tags, and there are plenty of them to do just about anything, control how the text and images will appear on the page. All tags must be "nested" inside particular brackets " < " and " > ".  For example, enter a carriage return you would type <BR>. Remember ALL formatting must be done with tags. Normal keyboard operations such as tab, carriage return and multiple spaces, gets ignored by the browser. Whenever you want extra white space on a page, you must create the code to make the browser do what you want it to do.

  3. The third rule of HTML is that all web pages must be saved with the file extension .htm or .html. Many newer web page construction kits have other formats, but these other formats are not universally recognized. Whichever text editor you use, you must save your code as text (rule 1) and with the .htm or .html extension. Whenever the browser encounters a file with the extension .txt, it displays everything on the page inside the browser window. Instead of processing the tags, the browser then displays the tags. The browser only knows to process the code as a web page IF the code is in an html file. Keep this in mind when your are using a text editor.

Notepad is an ideal text editor, because it always saves the source code as ASCII text, without additional hidden formatting codes. Whatever you see in the notepad window is exactly what the browser will see. Simple save the file with the extension .htm or .html and the file will be ready to process by the browser.

Wordpad is my personal best choice for a text editor. I do very large web pages, and often, I get an idea that applies in dozens of similar places on the web page. Rather than hunt down by hand each occurance of some string of code, I can use the Wordpad's "Find and Replace" feature, to find the old code and replace it with my new code. I have to be careful when I save a file using Wordpad. The default file extension is .DOC. This .DOC format also saves hidden formatting codes which the browser cannot handle. I must first change the filetype to .txt (for ASCII text), and then assign a filename with the .htm extension. It would seem that these conflict, but the filetype is merely what format the file will be saved into. I can still assign any file extension I choose. I choose .htm, because this particular text file is to be processed by my browser.

Microsoft Word and Word Perfect also can save a file in the text format, but if you try to save it as .htm or .html, these programs try to recreate the appearance of your page into HTML code. They do this by measuring every fraction of an inch of white space on the page. To recreate all this white space, they add an extravagant amount of unnecessary code. An HTML file created by Microsoft Word is typically 8 to 10 times larger that the same file is straight ASCII. Further, it is next to impossible to edit by hand. You have to understand Dynamic HTML (DHTML) in order to fix problems.  I would steer clear of MS Word and Word Perfect, and in fact, in this class, you are forbidden from using page editing programs for web page creation.

Microsoft Front Page is setting the standard for web page creation. You can create the page without knowing the HTML code in the "Normal" mode, then preview the results in the "Preview" mode. If you see something you don't like, you can go to the "HTML" mode to fix those problems. I use Front Page extensively now. I still create in the "HTML" mode, but being able to see the results by one single click on the "Preview" mode saves me a lot of time, saving and refreshing with other programs. YOU MUST UNDERSTAND HTML in order to be effective using FrontPage. You can quickly make mistakes that are irreversible if you don't know HTML. Front Page has a host of tools to dress up your page, and your entire web site. If you intend to become a webmaster, you will eventually install a copy of Front Page on your system.

Similar products to Front Page exist. Adobe has a product called Page Mill. Adobe is the nations leader in digital graphics, and they have invested a lot of resources to their Web Page product lines. You will probably see a host of Adobe products in the workplace. Adobe's Photoshop is the industrial standard for graphic editing.