Presentation is loading. Please wait.

Presentation is loading. Please wait.

1 HTML’s Transition to XHTML. 2 XHTML is the next evolution of HTML Extensible HTML eXtensible based on XML (extensible markup language) XML like HTML.

Similar presentations


Presentation on theme: "1 HTML’s Transition to XHTML. 2 XHTML is the next evolution of HTML Extensible HTML eXtensible based on XML (extensible markup language) XML like HTML."— Presentation transcript:

1 1 HTML’s Transition to XHTML

2 2 XHTML is the next evolution of HTML Extensible HTML eXtensible based on XML (extensible markup language) XML like HTML is a markup language

3 3 So what’s different in XHTML ? Opening HTML element with xmlns declaration Adding a content tag to specify the content encoding XHTML requires all tags have closing tags Empty elements having closing

4 4 First, what is XML? XML is used for structuring data XML allows for custom elements unlike HTML In XML we do not use the same elements we are used to using with HTML

5 5 Custom elements are used in XML Custom element example:

6 6 Empty elements in XML Empty elements will have only the closing tag An empty element does not have any data in between the element tags since there is only a closing element tag

7 7 Root element in XML The first line is referred to as the “root element” data can go here more data goes here and more here

8 8 W3C.org states XML declaration is not required An XML declaration is not required in all XML documents; However XHTML document authors are strongly encouraged to use XML declarations in all their documents. Such a declaration is required when the character encoding of the document is other than the default UTF-8 or UTF-16 and no encoding was determined by a higher-level protocol.

9 9 XHTML adds xmlns attribute (The xlmns attribute holds a unique identifier that determines the language you mean, for xhtml its " http://www.w3.org/1999/xhtml " ) XML uses the URL as a unique identifier for the language for this document, so you can create your own language (URL address does not have pertinent info, in other words there is no requirement that anything actually has to exist at the URL, just that the URL has to be unique for each language)

10 10 XHTML root element The root element of the document must contain an xmlns declaration for the XHTML namespace [XMLNS]. The namespace for XHTML is defined to be http://www.w3.org/1999/xhtml. http://www.w3.org/1999/xhtml An example root element might look like: Use both the lang and xml:lang attributes when specifying the language of an element. The value of the xml:lang attribute takes precedence.

11 11 An XML declaration is not required in all XML documents In this XHTML example, the XML declaration is included. Virtual Library Moved to example.org.

12 12 Adding a content tag to specify the content encoding tag goes right after the element Welcome UTF-8 stands for Unicode Transformation Format-8. UTF-8 is the default encoding for XML.

13 13 The Document Character Set is used to promote interoperability, each HTML application specifies its document character set A document character set consists of: A repertoire A set of abstract characters and Code positions Each HTML document is a sequence of characters from the repertoire Names for character encodings are case-insensitive

14 14 W3C.org recommendations for XML Character Encoding Historically, the character encoding of an HTML document is either specified by a web server via the charset parameter of the HTTP Content-Type header, or via a meta element in the document itself. In an XML document, the character encoding of the document is specified on the XML declaration For example:

15 15 Character Encoding According to the W3C.org… In order to portably present documents with specific character encodings, the best approach is to ensure that the web server provides the correct headers. If this is not possible, a document that wants to set its character encoding explicitly must include both the XML declaration an encoding declaration and a meta http-equiv statement Example: ).

16 16 Charset/Character encoding examples Commonly character encodings: ISO-8859-1 (also referred to as "Latin-1"; usable for most Western European languages) ISO-8859-5 (which supports Cyrillic) SHIFT_JIS (a Japanese encoding) EUC-JP (another Japanese encoding) UTF-8 (an encoding of ISO 10646 using a different number of bytes for different characters) (Names for character encodings are case-insensitive, so that for example "SHIFT_JIS", "Shift_JIS", and "shift_jis" are equivalent)

17 17 XHTML What’s else is different? Empty elements having closing

18 18 XHTML requires all tags have closing tags Elements are required to have closing tags, if there is no closing tag then these empty tags should end in /> Putting a space before /> is recommended not required For example:

19 19 XHTML 1.0 Strict Requirements Opening HTML tag must be the first tag after the DOCTYPE Closing HTML tag must be the last tag in the document All element names must be written with lowercase letters

20 20 XHTML 1.0 Strict Requirements All opening tags must have closing tags If element is an empty tag must end with a space and then /> All attribute values must be surrounded by double quotes and must have values Don’t use & (ampersand character) in the content section Instead of & use the html entitity: & Convert any other special characters to html entities

21 21 Benefits to using XHTML More likely to work with future browsers and devices Better for aural screen readers and visually impaired devices Can be extended to include new markups XHTML is more current, better to go with the current versus using antiquated HTML

22 22 Benefits to using XHTML XML data can be more easily translated into XHTML XHTML can more easily tie into third party software which understands XML XHTML is designed to be backwards compatible with older browsers

23 23 Migrating from strict HTML 4.01 to XHTML 1.0 is fairly straightforward Always make sure to validate pages to check for conformance http://validator.w3.org

24 24 http://validator.w3.org You can even add validation logo to show you passed To show your readers that you have taken the care to create an interoperable Web page, you may display this icon on any page that validates.

25 25 Converting and Validating in DW Dreamweaver enables you to convert pages to desired version of HTML File>Convert Dreamweaver enables you to validate pages based on your documents DTD File>Validate>Markup

26 26 Migrating websites to XHTML There are also third party tools that can help to convert whole websites to XHTML like http://tidy.sourceforge.net Can take non validating html and reformat/update the code so that it can validate Also can removes much of the legacy presentation code and replace with CSS

27 27 Review of the benefits to always validating Web pages will work more consistently and on a wide variety of browsers and load faster Will be better supported on new devices being used to view web pages More accessible to the visually impaired who use aural screen readers and businesses required to be ADA compliant ( alt and src required for strict) Job security?

28 28 XHTML specific required tags shown in bold for validation for XHTML 1.0 my page welcome to my webpage -end of slides


Download ppt "1 HTML’s Transition to XHTML. 2 XHTML is the next evolution of HTML Extensible HTML eXtensible based on XML (extensible markup language) XML like HTML."

Similar presentations


Ads by Google