1. CSCI N241: Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science Introducing XHTML: Module B: HTML to XHTML

2. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Goals Understand how XHTML evolved as a language for Web delivery Understand the importance of DTDs Understand how to validate XML/XHTML markup Understand how XML/XHTML differ from HTML

3. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML The Web is expanding to other media, called user agents, which are devices that are capable of retrieving and processing HTML and XHTML documents

4. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML A user agent can be a traditional Web browser or a device such as a mobile phone or PDA, or even an application that simply collects and processes data instead of displaying it HTML is not suitable for user agents other than Web browsers

5. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML HTML has evolved into a markup language that is more concerned with how data appears than with the data itself Current and older versions of Web browsers allow you to write sloppy HTML code

6. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML Languages based on SGML use a Document Type Definition, or DTD, to define the tags and attributes that you can use in a document, and the rules the document must follow when it includes them

7. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML When a document conforms to an associated DTD, it is said to be valid When a document does not conform to an associated DTD, it is said to be invalid

8. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML You can check whether a document conforms to an associated DTD by using a program called a validating parser

9. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML Because HTML is based on SGML, it requires a DTD, and the HTML DTD is built directly into Web browsers When a Web browser opens an HTML document, it first compares the document to the DTD

10. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Evolution of XHTML If an HTML document is missing any required tags, the HTML DTD supplies them, allowing the Web browser to render the page correctly

11. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Basics of XML Extensible Markup Language, or XML, is used for creating Web pages and defining and transmitting data between applications Like HTML, XML is based on SGML

12. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Basics of XML Version 1.0 of XML achieved recommendation status by the W3C in 1998 and was still current at the time of this writing

13. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The Basics of XML In XML you refer to a tag pair and the data it contains as an element All elements must have an opening and a closing tag The data contained within an elements opening and closing tags is referred to as its content

14. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The XML Declaration XML documents should begin with an XML declaration Specifies the version of XML being used

15. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The XML Declaration Not required to include an XML declaration because currently only one version of XML exists, version 1.0 The encoding attribute of the XML declaration designates the language used by the XML document

16. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science The XML Declaration Its a good practice to always include the XML declaration because XML will almost certainly evolve into other versions that will contain features not found in version 1.0

17. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Parsing XML Documents When a document adheres to XMLs syntax rules, it is said to be well formed You will study XMLs rules for writing well formed documents

18. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Parsing XML Documents You use a program called a parser to check whether an XML document is well formed Two types of parsers: non-validating and validating

19. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Parsing XML Documents A non-validating parser simply checks whether an XML document is well formed A validating parser checks whether an XML document is well formed and if it conforms to an associated DTD

20. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Writing Well-Formed Documents Well-formed XML documents allow user agents to read the documents data easily

21. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Writing Well-Formed Documents User agents expect XML data to be structured according to specific rules, which allows the user agent to read data quickly without having to decipher the data structure

22. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science All XML Documents Must Have a Root Element A root element contains all the other elements in a document. The … element is the root element for HTML documents, although most Web browsers do not require a document to include it.

23. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science All XML Documents Must Have a Root Element XML documents, however, require a root element that you define yourself

24. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science XML is Case Sensitive Unlike HTML tags, XML tags are case sensitive With XML, you cannot mix the case of elements

25. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science XML is Case Sensitive If you use a different case for an opening and closing tag, they will be treated as completely separate tags, resulting in a document that is not well formed

26. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science All XML Elements Must Have Closing Tags XML is designed to organize data, not display it. As a result, instead of documents consisting of text that contains elements, as is the case with HTML, XML documents consist of elements that contain text.

27. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science All XML Elements Must Have Closing Tags All elements must have a closing tag or the document will not be well formed.

28. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science XML Elements Must Be Properly Nested Nesting refers to how elements are placed inside other elements This paragraph is bold and italicized.

29. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science XML Elements Must Be Properly Nested In an HTML document, it makes no difference how the elements are nested. XML documents require that tags be closed in the opposite order in which they were opened.

30. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Attribute Values Must Appear Within Quotation Marks In HTML, an attribute value can be placed inside quotation marks or they may be left off. With XML, you must place quotation marks around the values assigned to an attribute

31. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Empty Elements Must Be Closed Several elements in HTML do not have corresponding ending tags, including the element, which inserts a horizontal rule into the document, and the element, which inserts a line break.

32. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Empty Elements Must Be Closed Elements that do not require an ending tag are called empty elements because you cannot use them as a tag pair to enclose text or other elements.

33. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Empty Elements Must Be Closed You can create an empty element in an XML document by adding a single slash (/) before the tags closing bracket to close the element Most often, you use an empty element for an element that does not require content, such as an image.

34. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Combining XML and HTML Although XML was designed primarily to define data, this does not mean that you cannot use it to create Web pages.

35. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Combining XML and HTML You can create formatted Web pages using XML and Extensible Stylesheet Language, or XSL, which is a specification for formatting XML in a Web browser

36. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Combining XML and HTML To make the transition to XML-based Web pages easier, the W3C combined XML and HTML to create Extensible Hypertext Markup Language (XHTML)

37. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Combining XML and HTML Combination of XML and HTML that is used to author Web pages XHTML is almost identical to HTML, except that it uses strict XML syntax to describe the parts of a document

38. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Resources Slides were adapted from the following text & companion lectures: First Edition Dan Gosselin Published by Course Technology (2004) XHTML, Comprehensive

39. N241: Fundamentals of Web Development Copyright ©2004 Department of Computer & Information Science Questions?