1 HTML XHTML

2 Understand the Doctype tag Know the html tags which are now classed as depreciated Understand how Dreamweaver adds styles Add styles to text and identify the css code added to achieve this Objectives By the end of the session students will be able to: Aims To introduce students to the changes from HTML v4 to XHTML and the use of Cascading Style Sheets, see how Dreamweaver applies styles to text.

HTML to XHTML HTML is being replaced by XHTML. Minor differences XHTML is more widely accepted in non "computer" devices like mobile phones, palm devices and other scaled down browsers, known as portability between devices. XHTML is also said to be extensible, which is the fancy way of saying the new tags can be added without a new document type declaration. 3

Rules of XHTML the tags and attributes in the page MUST be in lower case all tags must close, either by using a corresponding closing tag ( ) or self closing ( ). In HTML, many of these tags were simply left open. all tags must be properly nested some tags which were previously allowed are no longer allowed, although this can be addressed with Document Type Declarations (DTD's). all values for attributes must be encased in single or double quotes 4

structure must be separated from content. So for example, the tag is a content tag (paragraph) so you can't put a table in it for example, because a table is a format construct. You can however put the tag inside tags with no problem because the content goes in the construct, not the other way around. 5

6 Doctype Document type declaration (DTD also called the DOCTYPE). There are three that are used, –strict (that will only validate if you have no deprecated tags), –transitional (which will still validate with deprecated tags) –frameset (which is for a page that "sets" up "frames"). Note: Even though all tags in XHTML are lower case, parts of the DTD must be in upper case. The three DTD's look like this: Strict - Transitional - Frameset -

Which one to use? For all new documents make them XHTML Compliant from the start. Transitional should be used, as this is tolerant of depreciation Dreamweaver will also allow you to select XHTML when creating a new document. Note: If you do not place the doctype code in the web page the browser will assume the page was written a long time ago pre css so could possible not display the page as you would expect. 7

Depreciated HTML tags / attributes 8 bgcolor attributealign attributevalign attribute width attributeheight attributeDIR attribute (ltr)DIR attribute (rtl)BACKGROUND attribute TEXT attribute (BODY)LINK attribute (BODY)VLINK attribute (BODY) ALINK attribute (BODY)

Bibliography XHTML vs HTML Tutorial TML_-_The_differences.shtml Deprecated HTML tags and attributes and their CSS equivalents editor/articles/css_equiv.html editor/articles/css_equiv.html Useful website development links #post