A web page is written in a language called HTML (Hypertext Markup Language). Like Java code, HTML code is made up of text that follows certain strict rules. When a browser reads a web page, the browser interprets the code and renders the page, displaying characters, fonts, paragraphs, tables, and images.

HTML files are made up of text and tags that tell the browser how to render the text. Nowadays, there are dozens of HTML tags—see Table 1 for a summary of the most important tags. Fortunately, you need only a few to get started. Most HTML tags come in pairs consisting of an opening tag and a closing tag, and each pair applies to the text between the two tags. Here is a typical example of a tag pair:

Java is an <i>object-oriented</i> programming language.

The tag pair <i> </i> directs the browser to display the text inside the tags in italics:

Java is an object-oriented programming language.

The closing tag is just like the opening tag, but it is prefixed by a slash (/). For example, bold-faced text is delimited by <b> </b>, and a paragraph is delimited by the tag pair <p> </p>.

<p><b>Java</b> is an <i>object-oriented</i> programming language.</p>

The result is the paragraph

Java is an object-oriented programming language.

Another common construct is a bulleted list. For example:

Java is

Here is the HTML code to display it:

<p>Java is</p>
<ul><li>object-oriented</li>
<li>safe</li>
<li>platform-independent</li></ul>

Each item in the list is delimited by <li> </li> (for "list item"), and the whole list is surrounded by <ul> </ul> (for "unnumbered list").

As in Java code, you can freely use white space (spaces and line breaks) in HTML code to make it easier to read. For example, you can lay out the code for a list as follows:

<p>Java is</p>
<ul>
<li>object-oriented</li>
<li>safe</li>
<li>platform-independent</li>
</ul>

The browser ignores the white space.

If you omit a tag (such as a </li>), most browsers will try to guess the missing tags—sometimes with differing results. It is always best to include all tags.

You can include images in your web pages with the img tag. In its simplest form, an image tag has the form

<img src="hamster.jpeg"/>

This code tells the browser to load and display the image that is stored in the file hamster.jpeg. This is a slightly different type of tag. Rather than text inside a tag pair <img> </img>, the img tag uses an attribute to specify a file name. Attributes have names and values. For example, the src attribute has the value "hamster.jpeg". Table 2 contains commonly used attributes.

It is considered polite to use several additional attributes with the img tag, namely the image size and an alternate description:

<img src="hamster.jpeg" width="640" height="480"
alt="A photo of Harry, the Horrible Hamster"/>

These additional attributes help the browser lay out the page and display a temporary description while gathering the data for the image (or if the browser cannot display images, such as a voice browser for blind users). Users with slow network connections really appreciate this extra effort.

Because there is no closing </img> tag, we put a slash / before the closing >. This is not a requirement of HTML, but it is a requirement of the emerging XHTML standard, the XML-based successor to HTML. See www.w3c.org/TR/xhtml1 for more information on XHTML.

The most important tag in web pages is the <a> </a> tag pair, which makes the enclosed text into a link to another file. The links between web pages are what makes the Web into, well, a web. The browser displays a link in a special way (for example, underlined text in blue color). Here is the code for a typical link:

<a href="http://java.sun.com">Java</a> is an object-oriented
programming language.

When the viewer of the web page clicks on the word Java, the browser loads the web page located at java.sun.com. (The value of the href attribute is a Universal Resource Locator (URL), which tells the browser where to go. The prefix http:, for Hypertext Transfer Protocol, tells the browser to fetch the file as a web page. Other protocols allow different actions, such as ftp: to download a file, mailto: to send e-mail to a user, and file: to view a local HTML file.)

Finally, the applet tag includes an applet in a web page. To display an applet, you need first to write and compile a Java file to generate the applet code—see Special Topic 2.2. Then you tell the browser how to find the code for the applet and how much screen space to reserve for the applet. Here is an example:

<applet code="HamsterApplet.class" width="400" height="300">An
animation of Harry, the Horrible Hamster</applet>

The text between the <applet> and </applet> tags is only displayed in lieu of the actual applet by browsers that can't run Java applets.

You have noticed that tags are enclosed in angle brackets (less-than and greater-than signs). What if you want to show an angle bracket on a web page? HTML provides the notations < and > to produce the < and > symbols, respectively. Other codes of this kind produce symbols such as accented letters. The & (ampersand) symbol introduces these codes; to get that symbol itself, use &. See Table 3 for a summary.

You may already have created web pages with a web editor that works like a word processor, giving you a WYSIWYG (what you see is what you get) view of your web page. But the tags are still there, and you can see them when you load the HTML file into a text editor. If you are comfortable using a WYSIWYG web editor, and if your editor can insert applet tags, you don't need to memorize HTML tags at all. But many programmers and professional web designers prefer to work directly with the tags at least some of the time, because it gives them more control over their pages.