Skip to content

Latest commit

 

History

History
60 lines (40 loc) · 2.93 KB

02.md

File metadata and controls

60 lines (40 loc) · 2.93 KB
Raw

Lesson 02: XHTML Basics

What XHTML Is and Is Not

XHTML[1] is a "markup language" - that is, it describes information. Specifically, it describes documents. It draws on a print analogy, but it's not restricted to visual display; it is used by programs to transform information into other media, such as synthesized speech for a blind Web user, and to compile enormous data stores which can then be mined for information by other programs.

XHTML is not for specifying how a browser should format text or arrange it on a screen; those are the responsibility of CSS. In the past, (X)HTML[1] has been used for those purposes, but CSS has steadily matured to shoulder them. Parts of XHTML can still manage them, but very few are intended for it and not deprecated (off limits, only retained so old pages don't break).

A Simple Web Page

So here's the simple Web page I promised:

<!DOCTYPE html>

<html>
<head>
    <title>Untitled Document (wait...)</title>
</head>
<body>
    <p>Hello, world!</p>
</body>
</html>

To view that in your browser:

  • In Visual Studio, select File > New File...
  • In the General section, select Text File and click Open (because HTML File gives you stuff I explain in the next lesson).
  • Paste the code above into the file.
  • Select File > Save TextFile1.txt As...
  • Double-click the Static folder.
  • Enter 02.html as the filename and click Save.
  • Right-click 02.html in the panel on the right and select View in Browser.

Your browser will utter the timeless words used for first applications of almost every digital language.

Okay, What Was All That Stuff?

The first line is necessary to keep the browser predictable in how it renders the page. Without a doctype it can't tell whether this is a sloppy page that needs special favors. <html> is an opening tag, and </html> is its matching closing tag. The same goes for all the other words between angle brackets. The tags are understood as a heirarchy by the browser, with each tag pair represented by a node in the document tree. Tag pairs correspond to a certain type of node, elements.

A head element contains information about a page - meta-data.

A title element's content is put in the title bar (in tabbed browsers, this is the page's tab).

A body element contains the rendered portion of a page. All visible elements must be placed inside, but some have further requirements.

Up to now all the elements must occur no more than once in a page. The p element is the exception; it represents a paragraph.

</lesson>

Now you should be thinking about Web pages as heirarchies, or trees. The next lesson focuses on what Visual Studio offers to help you author them.

References

  1. See here for details about (X)HTML.