Wednesday, March 11, 2009

Picture of an XHTML element and document



HTML/XHTML is the foundation of a document. Elements which are enclosed in angle brackets in HTML syntax are the building blocks of HTML.

An element has a start tag such as <p> and an end tag which is the slash sign followed by the element name, as in </p>. The browsers know that any text that appears within the angle brackets are HTML tags and are not there for display. There are some elements without any HTML content such as "img" which do not require a separate closing tags but only a slash sign before the end of the opening tag:
<img src="http://www.cssrule.com/pic.gif" alt=" " />

A DIV can be a plain vanilla DIV or as an element, it can have an attribute. In the pictogram, the div has an id attribute. All attributes have values. The id has a value of "branding-text" which describes an aspect of this div.

Elements can also have content. The text within the "branding-text" DIV is the content, text which will typically be styled through CSS. CSS styling is applied to XHTML elements such as a div, p, ul li, a href, form, input, img and various h headings.

XHTML documents have a standard structure which starts with a html tag, followed by a head which is in turn followed by body and closed off with an ending html tag at the very end. The head section contains information about the document such as its title, the style sheet/styles it uses, scripts. The body is where the actual mark-up goes.

With XHTML, you define what kind of an element your text, lists, images, questions, data collection, and videos are. A paragraph of text becomes a p element and if your paragraph has a title that can become an h element in XHTML.

While CSS is all about presentation, XHTML is what gives your content its structure.
It used to be it was just HTML but by becoming XML compliant, it's now transformed into XHTML, eXtensible HyperText Markup Language. It's in your best interest to comply with XHTML 1.0 Strict DTD since HTML is going to be phased out and with the differences between the two being minimal, it makes sense to write XHTML compliant code from the start.

There are two quick ways to validate your markup and make sure your XHTML is valid by XHTML 1.0 Strict standards. If you have Web Development Toolbar by Chris Pederick installed in your browser, Ctrl-Shift-I key combination will take you to W3C Markup Validation Service. Or, if you don't have the toolbar, you can type in their URL and go to W3C Validation directly.

Post a Comment

Note: Only a member of this blog may post a comment.