introducing xhtml: module b: html to xhtml

39
Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science Introducing XHTML: Module B: HTML to XHTML

Upload: chad

Post on 21-Jan-2016

32 views

Category:

Documents


1 download

DESCRIPTION

Introducing XHTML: Module B: HTML to XHTML. 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. The Evolution of XHTML. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web Design

Copyright ©2004 Department of Computer & Information Science

Introducing XHTML:Module B: HTML to XHTML

Page 2: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 3: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 4: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 5: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 6: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 7: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 8: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 9: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 10: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 11: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 12: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 13: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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 element’s opening and closing tags is referred to as its content

Page 14: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

The XML Declaration

• XML documents should begin with an XML declaration

• Specifies the version of XML being used

Page 15: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 16: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

The XML Declaration

• It’s 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

Page 17: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

Parsing XML Documents

• When a document adheres to XML’s syntax rules, it is said to be well formed

• You will study XML’s rules for writing well formed documents

Page 18: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 19: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 20: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

Writing Well-Formed Documents

• Well-formed XML documents allow user agents to read the document’s data easily

Page 21: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 22: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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 <html>…</html> element is the root element for HTML documents, although most Web browsers do not require a document to include it.

Page 23: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 24: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 25: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 26: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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.

Page 27: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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.

Page 28: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

XML Elements Must Be Properly Nested

• Nesting refers to how elements are

placed inside other elements

<p><b><i>

This paragraph is bold and italicized.

</i></b></p>

Page 29: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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.

Page 30: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 31: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

Empty Elements Must Be Closed

• Several elements in HTML do not have corresponding ending tags, including the <hr> element, which inserts a horizontal rule into the document, and the <br> element, which inserts a line break.

Page 32: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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.

Page 33: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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 tag’s 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.

Page 34: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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.

Page 35: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 36: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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)

Page 37: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 38: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©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

Page 39: Introducing XHTML: Module B: HTML to XHTML

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

Questions?