J.3. First XHTML Example

In this appendix, we present XHTML markup and provide screen captures that show how Internet Explorer renders (i.e., displays) the XHTML. Every XHTML document we show has line numbers for the reader's convenience. These line numbers are not part of the XHTML documents.

Our first example (Fig. J.1) is an XHTML document named main.html that displays the message Welcome to XHTML! in the browser. The key line in the program is line 14, which tells the browser to display Welcome to XHTML! Now let us consider each line of the program.

Figure J.1. First XHTML example.

"http://www.w3.org/1999/xhtml"> 9 10

Lines 13 are required in XHTML documents to conform with proper XHTML syntax. Lines 56 are XHTML comments. XHTML document creators insert comments to improve markup readability and to describe the content of a document. Comments also help other people read and understand an XHTML document's markup and content. Comments do not cause the browser to perform any action when the user loads the XHTML document into the Web browser to view the document. XHTML comments always start with . Each of our XHTML examples includes comments that specify the figure number and file name and provide a brief description of the example's purpose. Subsequent examples include comments in the markup, especially to highlight new features.

Good Programming Practice J.2

XHTML markup contains text that represents the content of a document and elements that specify a document's structure. Some important elements of an XHTML document include the html element, the head element and the body element. The html element encloses the head section (represented by the head element) and the body section (represented by the body element). The head section contains information about the XHTML document, such as the title of the document. The head section also can contain special document-formatting instructions called style sheets and client-side programs called scripts for creating dynamic Web pages. The body section contains the page's content that the browser displays when the user visits the Web page.

XHTML documents delimit an element with start and end tags. A start tag consists of the element name in angle brackets (e.g.,

). An end tag consists of the element name preceded by a / in angle brackets (e.g., ). In this example, lines 8 and 16 define the start and end of the html element. Note that the end tag in line 16 has the same name as the start tag, but is preceded by a / inside the angle brackets. Many start tags define attributes that provide additional information about an element. Browsers can use this additional information to determine how to process the element. Each attribute has a name and a value, separated by an equal sign (=). Line 8 specifies a required attribute (xmlns) and value (http://www.w3.org/1999/xhtml) for the html element in an XHTML document.

Common Programming Error J.1

Common Programming Error J.2

An XHTML document divides the html element into two sectionshead and body. Lines 911 define the Web page's head section with a head element. Line 10 specifies a title element. This is called a nested element, because it is enclosed in the head element's start and end tags. The head element also is a nested element, because it is enclosed in the html element's start and end tags. The title element describes the Web page. Titles usually appear in the title bar at the top of the browser window and also as the text identifying a page when users add the page to their list of Favorites or Bookmarks, which enable users to return to their favorite sites. Search engines (i.e., sites that allow users to search the Web) also use the title for cataloging purposes.

[Page 1329]

Good Programming Practice J.3

Common Programming Error J.3

hello

Good Programming Practice J.4

Line 13 opens the document's body element. The body section of an XHTML document specifies the document's content, which may include text and tags.

Some tags, such as the paragraph tags (

and

) in line 14, mark up text for display in a browser. All text placed between the

and

tags form one paragraph. When the browser renders a paragraph, a blank line usually precedes and follows paragraph text.

This document ends with two closing tags (lines 1516). These tags close the body and html elements, respectively. The ending tag in an XHTML document informs the browser that the XHTML markup is complete.

To view this example in Internet Explorer, perform the following steps:

At this point, your browser window should appear similar to the sample screen capture shown in Fig. J.1.