Xml For Dummies Chapter 4 Adding Xhtml For The Web


Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Xml For Dummies Chapter 4 Adding Xhtml For The Web

  1. 1. XML For Dummies<br />Book Author : Lucinda Dykes & Ed Tittle<br />Slides Prepared By: Son TN<br />Chapter 4 : Adding XTHML for the Web<br />
  2. 2. Contents<br />HTML, XML, and XHTML<br />Comparing XML and HTML<br />XHTML Makes the Move to XML Syntax<br />Convert a document from HTML to XHTML<br />The Role of DOCTYPE Declarations<br />
  3. 3. 4.1. HTML, XML, and XHTML<br />HTML, XHTML, and XML represent stages in the development of markup languages.<br />HTML, designed to display content in Web browsers, came first.<br />XML, intended for data exchange, came next.<br />XHTML — which uses the markup tags of HTML and the strict syntax of XML.<br />
  4. 4. 4. 1.1 What HTML does best<br />HTML makes our Web world look pretty.<br />Such as a personal site that you create for your family.<br />Most Web sites use straight HTML to display data<br />
  5. 5. 4. 1.2 The limits of HTML<br />HTML was enlisted to perform some pretty specify tasks.<br />Allow tight control over document display.<br />Provide the flexibility to describe different, specific types of information and data.<br />Convey information from a variety of media and in a various formats.<br />Define complex linking relationships between document.<br />Publish a single set of information cross a variety of media.<br />Two overarching problems prevent Web designers from achieving this control with HTML:<br />HTML lacks fine controls.<br />Not include mechanisms for the control.<br />…<br />Display vary.<br />Problems with browsers that users view web pages (IE, Firefox…)<br />…<br />
  6. 6. 4. 2. Comparing XML and HTML<br />XML and HTML are not the same kind of markup language.<br />But XML and HTML both derive from the same parent SGML.<br />So they must be similar, right ?<br />HTML and XML both use tags and attributes.<br />XML and HTML look similar.<br />HTML defines basic text elements and includes defaults (and more explicit controls) for how text may be displayed in a browser window<br />XML tells us only what each element means.<br />XML says nothing about how elements should or must be displayed — XML separates content and the presentation of that content.<br />
  7. 7. 4.2.1 Using XML to describe data<br />XML is not limited to any fixed set of tagsor element types.<br />You can define your own sets of elements and even your own attributes that you may then use within your documents.<br />XML Document<br />HTML Document<br />&lt;html&gt;<br />&lt;p&gt;<br />Blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah (XML)<br />blobbity blobbity blobitty blah blah blah blah. blah blah blah<br />&lt;/p&gt;<br />&lt;p&gt;<br />Blah blah blah Lucinda Dykes blah Ed Tittel.<br />&lt;/p&gt;<br />&lt;/html&gt;<br />&lt;Cover&gt;<br />&lt;Abstract&gt;<br />This book is about the foundations of the Extensible Markup Language (XML)<br />and how to use it for your own applications.<br />&lt;/Abstract&gt;<br />&lt;AuthorInfo&gt;<br />The authors are &lt;Author&gt;Lucinda Dykes&lt;/Author&gt; and<br />&lt;Author&gt;Ed Tittel&lt;/Author&gt;.<br />&lt;/AuthorInfo&gt;<br />&lt;/Cover&gt;<br />
  8. 8. 4. 2.2 The benefits of using HTML <br />It’s quick, easy, and cheap.<br />HTML is way easier than the alternative.<br />Anyone can create an HTML document by using a text editor and a little knowledge.<br />Even if you don’t know HTML, you can use an HTML editor — a What You See Is What You Get-style (that is, WYSIWYG-style) editor such as FrontPage or Dreamweaver — to produce readable Web pages in minutes.<br />
  9. 9. 4. 2.3 The benefits of using XML<br />XML seems to be brimming with benefits.<br />Unlimited element<br />Structured data<br />Data exchange<br />XML complements HTML<br />XML documents are well formed<br />Self-describing<br />Search engines<br />Updates<br />User-selected view of data<br />Intelligent XML-based pages that contain human-readable data offer exciting potential for users.<br />A Web designer/developer reaps several benefits from XML as well.<br /><ul><li>The benefits of XML are endless.</li></li></ul><li>4. 3. XHTML Makes the Move to XML Syntax<br />XHTML is the successor to HTML 4.01; in effect, it’s the final version of HTML.<br />XHTML is a clever reformulation of HTML 4 as an application of XML 1.0.<br />Why do we like XHTML?<br />XHTML documents can be viewed, edited, and validated using XML tools.<br />Well-formed XHTML documents mean better-structured documents.<br />XHTML documents can be delivered using different Internet media types and output devices.<br />Using valid XHTML gives you the best chance of having your document displayed the way you intend.<br />
  10. 10. 4. 3.1 Making the switch<br />Making the switch from HTML to XHTML means mastering the rules of XHTML — in particular, XML syntax and structure.<br />You have only a few major rules to get under your belt, but you have to follow them if you want to create a valid XHTML document. <br />Every tag in an XHTML document must be closed.<br />Empty elements (elements without content, such as a br tag) must be correctly formatted with a closing slash.<br />All tags must be nested correctly — the tag you open last must be the tag you close first<br />All XHTML tags must be written using only lowercase.<br />All attribute values must be put in quotation marks.<br />An acceptable XML document must be well formed.<br />
  11. 11. 4. 3.2 Every element must be closed<br />That all nonempty elements (that is, those that contain actual text) must have a start tag and an end tag.<br />In the case of HTML<br />Doing without an end tag just doesn’t fly in XHTML.<br />You have to add closing paragraph tags where they belong if you want the resulting lines to work right.<br />Is the same as<br />&lt;p&gt;text text text<br />&lt;p&gt;text text text&lt;/p&gt;<br />
  12. 12. 4. 3.3 Empty elements must be formatted correctly<br />All nonempty XML elements must use both a start tag and an end tag to be correct.<br />An empty element is a singleton tag (also called an empty tag) that hangs around by itself.<br />Empty tags in HTML include the &lt;br&gt;, &lt;hr&gt;, and &lt;img&gt; tags.<br />The hr element looks like this in HTML:<br />In XHTML, it looks like this:<br />&lt;hr&gt;<br />&lt;hr /&gt;<br />
  13. 13. 4. 3.4 Tags must be properly nested<br />The rules of XHTML syntax say that tags must be nested in the correct order.<br />The rule is always to close first what you opened last, working your way from the inside to the outside tags. <br />Ill formed<br />&lt;p&gt;This book was written by &lt;i&gt;&lt;b&gt;Dan Brown&lt;/i&gt;&lt;/b&gt;.<br />Well-formed<br />&lt;p&gt;This book was written by &lt;i&gt;&lt;b&gt;Dan Brown&lt;/b&gt;&lt;/i&gt;.&lt;/p&gt;<br />
  14. 14. 4. 3.5 Case makes a difference<br />HTML is not case sensitive; XHTML is.<br />When you use HTML, it doesn’t matter what case you use for elements and attributes.<br />For example, for the opening body tag, you can use &lt;BODY&gt;, &lt;body&gt;, or even &lt;Body&gt; they all work fine.<br />XHTML, on the other hand, is a bit more finicky about case.<br />All XHTML elements and attribute names must be in lowercase or your page won’t validate.<br />Use any case for the value of an attribute<br />
  15. 15. 4. 3.6 Attribute values are in quotation marks<br />In XHTML, all attribute values must be in quotation marks.<br />The following markup works just fine on an HTML page:<br />You have to add quotation marks around the attribute value to create valid XHTML.<br />Table 4-1 highlights the major rules for XHTML syntax and shows how markup looks in HTML and XHTML.<br />&lt;tr align=right&gt;<br />&lt;tr align=”right”&gt;<br />
  16. 16. 4. 4. Converting a documentfrom HTML to XHTML<br />
  17. 17. 4. 4. Converting a documentfrom HTML to XHTML<br />
  18. 18. 4. 5. The Role of DOCTYPE Declarations<br />The DOCTYPE declaration serves several purposes:<br />It allows your page to be validated as XHTML.<br />It tells the browser which version of which markup language you used to create the page and references the specific DTD for that language.<br />It enables your page to be displayed properly in Web-standards-compliant browsers.<br />You have three different DOCTYPES to choose among for an XHTML 1.0 document: strict, transitional, and frames.<br />
  19. 19. 4.6 Summary<br />Understanding the limitations of HTML<br />Comparing HTML with XML<br />Getting the best of both worlds: XHTML<br />Converting HTML to XHTML<br />