HTML the Language of the Web

• So what does a web browser (client software) do with a file it receives from a web server (server software)? Does it just display it to the human user as is?

• The answer is yes and no. Actually, in some cases, the web browser will display a document exactly the way it receives it from the web server. For example, if the document requested is an image, the web browser will display it directly. Similarly, plain text files will be displayed just as they are sent.

• However, if the document is an HTML document, the web browser will "interpret" the HTML and display it according to the instructions contained within the HTML code.

• Well, what is HTML code and why must it be interpreted?

• HTML (Hyper Text Markup Language) is a very simple language used to "describe" the logical structure of a document.

• For example, it can describe which text the browser should emphasize, which text should be considered body text versus header text, and so forth.

• The beauty of HTML of course is that it is generic enough that it can be read and interpreted by a web browser running on any machine or operating system. This is because it only focuses on describing the logical nature of the document, not on the specific style. The web browser is responsible for adding style. For instance emphasized text might be bolded in one browser and italicized in another. it is up to the browser to decide.

• The language itself is fairly simple and follows a few important standards.

• Firstly, document description is defined by "HTML tags" that are instructions embedded within a less-than (<) and a greater-than (>) sign. To begin formatting, you specify a format type within the < and the >. Most tags in HTML are ended with a similar tag with a slash in it to specify an end to the formatting. For example, to emphasize some text, you would use the following HTML code:

  this text is not bold
  	<EM>this text is bold</EM>
  	this text is not bold

• It is important to note that the formatting codes within an HTML tag are case-insensitive. Thus, the following two versions of the bold tag would both be understood by a web browser:

  <em>this text is bold</em>
  	this text is not 
  	<EM>this text is bold</EM>
  

• You can also compound formatting styles together in HTML. However, you should be very careful to "nest" your code correctly. For example, the following HTML code shows correct and incorrect nesting:

  <CENTER><EM>this text is bolded and centered 
  correctly</EM></CENTER>
  
  <EM><CENTER>this text is bolded and centered 
  incorrectly</EM></CENTER>
  

• In the incorrect version, notice that the bold tag was closed before the center tag, even though the bold tag was opened first. The general rule is that tags on the inside should be closed before tags on the outside.

• Finally, HTML tags can not only define a formatting option, they can also define attributes to those options as well. To do so, you specify an attribute and an attribute value within the HTML tag. For example, the following tag creates a heading style aligned to the left:

  <H2 ALIGN = "LEFT">this text has a heading
  level two style and is 
  aligned to the left </H2>
  

• There are a few things to note about attributes however. First, it is not necessary to enclose attribute values within quotes unless white space is included in the value. Secondly, it is not necessary to have a space before or after the equal sign that matches an attribute to its value. Finally, when you close an HTML tag with an attribute, you should not include attribute information in the closing.

• Finally, you should know that web browsers do not care about white space that you use in your HTML document. For example, the following two bits of HTML will be displayed the exact same way:

  This is some text that is displayed
  as you would expect
  
  
  This     is  some     text
  that is displayed in a way
  you
  would not expect:
  exactly the same as the above
  

HTML Resources

• The WDVL: Quick Intro to HTML
• The WDVL: HyperText Markup Language
• Yahoo's HTML Directory
• HTML Writer's Guild HTML Resources
• Web Developer's Virtual Library: Web Design

The Basics of HTTP
Introduction to Web Design | Table of Contents
Basic HTML Tags