Transcript Chapter 1
The Web Wizard’s Guide to XHTML by Cheryl M. Hughes Created by Cheryl M. Hughes Copyright © 2003 Pearson Education, Inc. Slide 1-1 CHAPTER 1 XHTML and the World Wide Web Copyright © 2003 Pearson Education, Inc. Slide 1-2 Overview of the World Wide Web The Internet consists of many applications, not just the web: Email Telnet FTP News Applications on the Internet all communicate over TCP/IP networks (Transmission Control Protocol/Internet Protocol) The use of these standard protocols allow computers running different operating systems (like Windows and Apple computers) to communicate with each other The protocol that web browsers use to communicate with web servers is HTTP, Hypertext Transfer Protocol Web protocols are created by the World Wide Web Consortium (W3C) – www.w3c.org Copyright © 2003 Pearson Education, Inc. Slide 1-3 Web Browsers and Web Servers 1. 2. 3. 4. The Web browser makes a request to the web server The server which is running an HTTP server that is listening for requests, receives the request and locates the document. The server then sends back the content of the requested page to the client. The browser receives the information from the server and displays the page in the browser window. The transaction is now complete. Copyright © 2003 Pearson Education, Inc. Slide 1-4 Markup Languages SGML stands for “Standard Generalized Markup Language” and was developed in the 1960’s as the first standardized markup language HTML was developed in the early 1990’s as a lightweight application of SGML for transporting documents over HTTP HTML documents were portable among different operating systems and computer applications XML was developed to address the limitations of HTML XML is a meta-language, or a set of rules, for building other languages XML and HTML are both SGLM applications XHTML is the successor of HTML Copyright © 2003 Pearson Education, Inc. Slide 1-5 HTML Limitations HTML elements define presentation and formatting styles, but not data HTML has a finite set of elements and cannot be extended or customized HTML syntax is not strict HTML’s limitations are being stretched with the introduction of new technologies and web clients, like cell phone and PDA’s HTML 4.01 is the last version of HTML to be developed Copyright © 2003 Pearson Education, Inc. Slide 1-6 Origins of Markup Languages Copyright © 2003 Pearson Education, Inc. Slide 1-7 Overview of XHTML The first version of XHTML, 1.0, was released in 2000 W3C description of XHTML : XHTML 1.0 reformulates HTML as an XML application. This makes it easier to process and easier to maintain. XHTML 1.0 borrows elements and attributes from W3C's earlier work on HTML 4, and can be interpreted by existing browsers, by following a few simple guidelines. This allows you to start using XHTML now! XHTML is extensible meaning that its element set is not finite, like that of HTML. Additional elements or other XML-based languages can be integrated with XHTML XHTML consists of the element set of HTML reformulated to adhere to the syntax rules of XML XHTML is compatible with existing web browser technology and will be compatible with future XML-based clients Copyright © 2003 Pearson Education, Inc. Slide 1-8 Building XHTML Documents Elements consist of a start tag, content and an end tag: Start Tag Content End Tag <h1>Introduction to XHTML</h1> Empty elements are used to describe elements that do not have any content: <br /> Attributes are used to describe elements and are placed inside the open tag of an element: <img src=“picture.jpg” /> Comments are used to notate the document, but are not processed by parsers: <!-- This is a comment --> Copyright © 2003 Pearson Education, Inc. Slide 1-9 Three Flavors of XHTML 1.0 XHTML Transitional: XHTML Frameset: Currently the most-used version of XHTML 1.0. This version most resembles HTML 4.0.1. This version is the best choice when documents need to use HTMLs presentational elements or when pages need to be developed without using style sheets. Use this version if you want to convert existing HTML pages to XHTML. The caveat to the Transitional version is that it contains support for certain elements and attributes that are being deprecated, or phased out. It also does not contain support for frames. Should be used when your documents need to use the frame elements that are used to partition the browser into multiple independent windows. The element set for this version contains all of the elements from XHTML Transitional plus the elements needed to support frames, such as <frame> and <frameset>. XHTML Strict XHTML Strict most closely represents the future of XHTML. The element set for XHTML Strict contains a subset of the elements from XHTML Transitional, but does not include support for strictly presentational elements or elements that will not likely be included in future versions of XHTML. In the future, XHTML documents will separate presentation from content and use style sheets to define presentation formatting such as font types, colors, and styles. Use XHTML Strict with Cascading Style Sheets (CSS). You will learn about CSS and how to use style sheets with XHTML documents in Chapter 7. Copyright © 2003 Pearson Education, Inc. Slide 1-10 XHTML Document Example 1 <?xml version=”1.0”?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns=”http://www.w3.org/1999/xhtml”> 4 <head> 5 <title>Introduction to XHTML</title> 6 </head> 7 <body> 8 <strong>Course Name: </strong> Introduction to XHTML <br /> 9 <strong>Course Number: </strong> CS 112 <br /> 10 <strong>Instructor: </strong> T. Perdue <br /> 11 <strong>Meeting Time: </strong> Wednesday, 5:30pm–7:30pm <br /> 12 <p /> 13 <strong>Course Description: </strong> This course covers the basics of how to write XHTML Web documents. 14 <p /> 15 <strong>Prerequsites: </strong> 16 <ul> 17 <li>CS 101—Introduction to Computers </li> 18 <li>CS 103—Introduction to Web Site Design </li> 19 <li>CS 110—Designing Web Pages with HTML </li> 20 </ul> 21 </body> 22 </html> Copyright © 2003 Pearson Education, Inc. Slide 1-11 XHTML Document Example Copyright © 2003 Pearson Education, Inc. Slide 1-12 Differences Between XHTML and HTML 1. 2. 3. 4. 5. 6. XHTML documents contain the XML and DOCTYPE declarations at the top of the document. The XML declaration is optional but the DOCTYPE declaration is required. The DOCTYPE declaration was optional in HTML. XHTML documents must be well formed. HTML, however, does not strictly require that documents be well formed. XHTML is not dependent on a single document type or set of markup elements, like HTML. Element and attribute names must be lowercase. XHTML elements and attributes are case sensitive, while HTML elements and attributes are not. For nonempty elements, XHTML requires end tags. Attribute values must always be quoted in XHTML. This was not a requirement in HTML. Copyright © 2003 Pearson Education, Inc. Slide 1-13 Well-Formed XHTML Documents 1. 2. 3. 4. 5. 6. XHTML documents must contain the root element <html> All elements must have a start and end tag, or must be an empty element Elements must be nested properly All attributes must have a value Attributes must be placed in the start tag Element names are case sensitive Copyright © 2003 Pearson Education, Inc. Slide 1-14 Validating XHTML Documents Valid documents must be well-formed and adhere to the rules of a DTD: XHTML Transitional: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML Frameset: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> XHTML Strict: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Validate documents online at the W3C’s Validator website: http://validator.w3.org Copyright © 2003 Pearson Education, Inc. Slide 1-15