Basic Of HTML & XHTML Lesson 2

The Current Standard: XHTML 1.0

The Internet is no longer limited to computer hardware and software; more and more people are accessing it with mobile phones and wireless devices. This poses new challenges to an existing HTML standard.

After completing this lesson, you should be able to:

Describe the reasons for the emergence of XHTML
Explain the basic structure of a simple HTML page
Creating and viewing a basic HTML page




Many of the newer portable technologies pose problems for the old HTML specification. They simply don't have the processing power of a desktop computer, and aren't as forgiving of poorly written HTML.

The developers of the HTML specification have struggled to accommodate these ongoing changes, and the limitations of HTML have become evident. We're stretching and distorting the HTML specification far beyond its capabilities.







The future of the Internet demands a markup language that's more extensible and portable than HTML. The direction is heading toward the use of XML (short for Extensible Markup Language), a subset of SGML that allows for custom tags to be processed.

And that's where XHTML 1.0 comes into play. XHTML 1.0 is written in XML, and is the current standard that will help Web designers prepare for the future. Documents written in XHTML can be viewed on current browsers, but at the same time they're valid XML documents.











Technically, XHTML 1.0 and HTML 4.01 are very similar. It is possible to learn how to write Web pages using HTML 4.01, and how to format your HTML so that it's compliant with the XHTML 1.0 specification.



The tags and attributes are virtually the same, but a few simple rules have to be followed in order to make sure that a document is compliant with the XHTML 1.0 specification.

This permits a developer to deal with the different HTML tags to make sure pages are readable and still look good in all kinds of browsers.



What HTML Files Look Like

Pages written in HTML are plain text files (ASCII), which means that they contain no platform or program-specific information. Any editor that supports text can read them. HTML files contain the following:

The text of the page itself
HTML tags that indicate page elements, structure, formatting, and hypertext links to other pages or to included media




Most HTML tags look something like the following. The tag name itself (here, tagname) is enclosed in brackets (< >).





HTML tags generally have a beginning and an ending tag surrounding the text they affect. The beginning tag "turns on" a feature (such as headings, bold, and so on), and the ending tag turns it off. Closing tags have the tag name preceded by a slash (/). The opening tag (for example,

for paragraphs) and closing tag (

for paragraphs) compose what is officially called an HTML element.





Be aware of the difference between the forward slash (/) mentioned with relation to tags, and backslashes (\), which are used by DOS and Windows in directory references on hard drives (as in C:\WINDOWS or other directory paths). If you accidentally use the backslash in place of a forward slash in HTML, the browser won't recognize the ending tags.

Not all HTML tags have both an opening and closing tag. Some tags are only one-sided, and still other tags are containers that hold extra information and text inside the brackets. XHTML 1.0, however, requires that all tags be closed.




Another difference between HTML 4.0 and XHTML 1.0 relates to the use of lowercase tags and attributes. HTML tags are not case sensitive. You can specify them in uppercase, lowercase, or in any mixture. So is the same as , which is the same as .

This isn't the case for XHTML 1.0, where all tag and attribute names must be written in lowercase.



Creating Your First HTML Page


Now that you've seen what HTML looks like, it's time to create your own Web page. Let's start with a simple example so that you can get a basic feel for HTML.

To get started, you'll need a text editor. A text editor is a program that saves files in ASCII format. ASCII format is just plain text, with no font formatting or special characters.

For Windows, Notepad and Microsoft WordPad are good basic text editors. Basic text editors are also available for other operating systems, including DOS, Windows, Mac OS, and Linux.





If you use a word processor for your HTML development, be very careful. Many recent word processors are including HTML modes or mechanisms for creating HTML or XML code. This feature can produce unusual results or files that simply don't behave as you expect. If you run into trouble with a word processor, try using a text editor and see whether it helps.







Note that the tag doesn't appear in lowercase like the rest of the tags. This tag is an exception to the XHTML rule and should appear in uppercase. You don't have to specify a DOCTYPE at all to get your pages to work. The purpose of the DOCTYPE is to tell validators and browsers which specification your page was written to.










Viewing the Result

Once you have saved an HTML file to your computer, you can open it with your browser. After your browser is running, look for a menu item or button labeled Open, Open File, or maybe Open Page. Choosing it enables you to browse your local disk.

The Open command (or its equivalent) opens a document from your local disk, parses it, and displays it.






Remember, when you save an html file to your hard drive, to make sure that you're saving it as text only. When you choose a name for the file, follow these three rules:

The filename should have an extension of .html (.htm on DOS or Windows systems that have only three-character extensions). For example, myfile.html, text.html, or index.htm.
Most Web software requires your files to have these extensions, so get into the habit doing it now.
Use small, simple names. Don't include spaces or special characters (bullets, accented characters), just letters and numbers are fine.



A Note about Formatting

When an HTML page is parsed by a browser, any formatting you might have done by hand, such as any extra spaces, tabs, returns, and so on, is ignored. The only thing that specifies formatting in an HTML page is an HTML tag.

If you spend hours carefully editing a plain text file to have nicely formatted paragraphs and columns of numbers but don't include any tags, when a Web browser loads the page, all the text will flow into one paragraph. All your work will have been in vain.



The advantage of having all white space (spaces, tabs, returns) ignored is that you can put your tags wherever you want. The following examples all produce the same output.