How a Web document works

A public Web document is part of the World Wide Web and operates according the client-server model.

1. A Web page is a file that resides on a server.
2. People use client software (a Web browser) to access a Web page.
3. Web sites can contain massive numbers of pages of hypertext and multimedia.
4. A Web site truly represents a new kind of communication with unique characteristics and qualities.

How a Web Document is Composed

You create a file and put special character sequences called HTML elements into your file. These elements identify the structural parts of your document. When a Web browser displays the file, it will display your file's content, but not the characters that make up the structure.

A very simple HTML document

Here is an example:

Make a file called "hi.html" containing this	Use your a Web browser to open the file "hi.html," and it will look something like this
Hi This is very minimal "hello world" HTML document.	Hi This is a very minimal "hello world" HTML document.

Only the elements that you place in the BODY element (that is, between and ) ever get displayed in a Web browser's window.

In this example, only the contents of the H1 element (between

and

) and the P element (between

and

) are displayed.

The phrase you put between will be displayed in the browser's title bar (for browsers such as Netscape Navigator or Internet Explorer; other browsers might display the title differently).

A "Hello, World" HTML document

Here is another fairly simple "Hello World" document.

You can click on the link and then use the "View / Source" option on your browser to look at how it is made.

The idea is that you put in the HTML elements into an HTML file (such as "hello.html"), and then you can view that file in a Web browser to see your contents displayed. You won't see the HTML structure elements themselves (HTML, HEAD, TITLE, BODY, H1, or P).

Parts of an HTML document

• A Web document consists of HTML elements and entities.
• The HTML elements identify components of the document. For example, the body element (BODY), the paragraph element (P) element, and the anchor element (A).
• The HTML elements are not intended to define how a document looks, only how it is structured.
• Some elements have a start tag (for example ) and an an end tag (for example ). For some elements, the end tag is optional.
• The HTML entities are special characters in the document. For example, you can use latin codes or numeric codes.
• Some HTML elements have optional attributes to further specify the function of the element. For example, the A (anchor) element has an attribute "href" to identify the URL where the anchor "points." For example, this A element has the href attribute set to the URL of the HTML Station:

  This points to the HTML Station

• The spaces or line breaks in an HTML file don't affect how it will look in a Web browser. You can therefore use any kind of spacing or linebreaks in your HTML file that you would like.
• Capitalization or lowercase letters in the element tags also don't matter ( is just as good as ). However, case does matter in the value of attributes (an attribute sets some value for the operation of an element; for example, in this anchor to the HTML station, the text "http://www.december.com/html" is the value of the attribute href. You could actually write out href as Href or HREF, but (for the most part) you need to pay attention to the upper or lower case letters of attribute values.

  This points to the HTML Station

• The top line of the file identifies the version of HTML used in the Hello World document:

  When we talk about HTML standards, I'll describe more how this line is used. You will have to use a DOCTYPE statement in every single HTML file you present for grading in this course.

You can see some commonly-used elements of HTML demonstrated in the "Hello World" document:

• HTML
• HEAD
• TITLE
• BODY
• H1
• P
• A
• HR
• ADDRESS

The "Hello World" document also demonstrates the copyright entity (©).

An anchor for email in an HTML document

One frequently-used kind of anchor element (A) is a link to an email address. You can make one in your HTML file by adding this line (where userid@domain.com is your email address).

Put this in the BODY of your HTML file:	Displayed in a Web browser, it will look something like this:
send me some email	send me some email

More kinds of anchors in HTML document

Take a look at this example to see how links are made to different kinds of Internet resources using different kinds of URL's in the href attribute of the A element.

Exercise: Prepare a Web document

Copy the "Hello World" document to your computer, call it "hello.html," and edit it to suit your interests, name, email address, etc.

Continue to develop your document and include different kinds of hypertext links as, for example, demonstrated in this example.