Please be sure to include the closing tag, as it is required. You must also include the type attribute with a value of text/javascript. Then, add the location to the opening script tag using the src attribute with the path to the script as the value. note At one time, the language attribute was in wide use. It was deprecated in HTML 4.01, so don t use it. Secret #109: XHTML and Case Sensitivity HTML is not case sensitive, XML is. XHTML is case-specific, meaning you must use lowercase for all elements and attribute names, with no exceptions allowed. In HTML, you could have the following markup:
This text would align to the right
It would be perfectly valid. In XHTML, any capitalization of elements or attribute names will throw validation errors. The correct markup would be as follows:
This text would align to the right
note This markup example could only occur in a Transitional document, because it contains presentational attributes. You might have noticed that I specifically wrote that elements or attribute names are affected, not attribute values. The reason for this is practical without having the flexibility to have uppercase characters in values, there sno means of inputting information that in and of itself might be case sensitive.
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost JSP Web Hosting services
152 Part II: HTML, XHTML, CSS and Accessibility Listing 7-2 shows an XHTML document along with a properly marked up link to style. Listing 7-2: Linking to an external style sheet in XHTML < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
The rel attribute should always be in place with a value of stylesheet except under those circumstances where you are using that attribute for other purposes (see Chapter 8 Style Tips for Type and Design ). If you re going to embed style in XHTML, be sure that you use the proper syntax, including the type attribute in the style element: Without the type attribute in place, XHTML documents will not validate. Secret #108: Adding Scripts in XHTML Similarly, scripts should also be external to XHTML documents. Again, while you can use scripts inline and you almost are sure to do so at some point while working with XHTML, ideally the script is external. Linking to scripts works differently than linking to a style sheet. Instead of using the link element, you use the script element, placed in the head of the document (see Listing 7-3). Listing 7-3: Linking to an external script in XHTML < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Linux Web Hosting services
Chapter 7: Moving Ahead with XHTML 151 extensible, and you can mix other DTDs (such as MathML) with XHTML, defining the namespace in XHTML is required. Namespaces are typically identified with an attribute. In XHTML, you ll add the xmlns (XML namespace) attribute name along with a URL value to the opening tag in the root element, as follows: Close out the element with its closing tag, add a head and body element, and a meta element for encoding purposes. You ll notice the slash at the end of the meta element this is one of the influences of XML, and you ll learn about its significance later in this chapter. There you have it everything you need for a basic XHTML document (see Listing 7-1) all ready for your content. Listing 7-1: Conforming strict XHTML document < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
note To read more about the meaning of namespaces, see the Dublin Core Metadata Glossary entry, which provides a detailed definition, at http://library.csun.edu/mwoodley/dublincoreglossary.html#N. Secret #107: Implementing Style in XHTML XHTML has some specific issues related to style that should be addressed. The main issue is that the W3C specifications recommend (but do not require) that all style in XHTML be external to the document. So, while you can use embedded (and as a result, imported) and inline styles in XHTML, it s not recommended. After all, keeping the main document free of anything that can be moved elsewhere means faster loading times for that document, and more interoperability. Ideally, your style sheets will be linked. Style is attached using the link element within the head portion of the document. You can link to as many style sheets as you desire.
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Unix Web Hosting services
150 Part II: HTML, XHTML, CSS and Accessibility Table 7-2: DTDs and DOCTYPE Declarations in XHTML DOCTYPE DTD Declaration Use XHTML 1.0 Transitional < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/ xhtml1/DTD/ xhtml1-transitional .dtd" Very good for broad use; use any time you ll be including presentational elements and attributes in your document XHTML 1.0 Strict Excellent choice for contemporary Web sites using CSS and no presentational elements or attributes within the document XHTML 1.0 Frameset < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "www.w3 .org/TR/xhtml1/DTD/ xhtml1-frameset.dtd"> Use is restricted to frameset documents XHTML 1.1 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "www.w3.org/TR/ xhtml11/DTD/ xhtml11.dtd"> Use is limited to strict documents served as XML, which has limited support, unless you serve it as text, which is a controversial issue discussed earlier in this chapter warning Flip back a few pages and compare the HTML DOCTYPEs to the XHTML DOCTYPEs here. You ll notice that the html in HTML DOCTYPEs is in uppercase, whereas the XHTML DOCTYPEs show html in lower case. This case difference will influence the validity of your documents. HTML can be upper or lowercase, whereas XHTML DOCTYPEs will only validate with the html in lowercase. Secret #106: Add the Namespace to Root With your DOCTYPE in its spot above all else, it s time to add the html element to the page. Recall the discussion in Chapter 6 about html being the root element the element from which all other elements extend. XHTML is exactly the same semantically, but different in terms of syntax. In XHTML, the namespace is defined. Namespaces help differentiate elements in XML, which allows you to include different DTDs in documents. By identifying the namespace, elements won t conflict. Because the idea of XHTML is to be
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services
Chapter 7: Moving Ahead with XHTML 149 Figure 7-2: The XML declaration can cause some browsers to render the XML tree rather than the document. Here s a sample of how that might look. of these rendering problems, my suggestion is to leave it out. However, if you have a specific target browser that has no problem interpreting documents properly with the XML declaration in place and you do not have to support any that do, you can consider using it. note For a helpful chart displaying those browsers with and without issues related to the XML declaration, see www.webstandards.org/learn/reference/ prolog problems.html. Secret #105: Use Correct XHTML DOCTYPEs As with HTML, the DOCTYPE declaration must appear at the top of your document for a document to be validated and to validate. DOCTYPEs are required in both HTML and XHTML. Once you ve chosen the appropriate DTD and begin to construct a document template, you ll want to include the correct DOCTYPE. Table 7-2 shows the available DOCTYPEs in XHTML. As you surf around and view source, you ll notice that not all DOCTYPEs look like the ones you ve seen in this book. Some of them are shorter, without the URL. Some have relative URLs. These DOCTYPEs aren t necessarily incorrect, but they may not be functional both in validation and in DOCTYPE switching if they are not among those listed here (and in Chapter 6, for HTML DOCTYPEs).
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services
148 Part II: HTML, XHTML, CSS and Accessibility XHTML 1.1. The XHTML 1.1 DTD is based on XHTML 1.0 Strict, but it must be served as application/XML, a media type used to define applications using XML. tip Choose XHTML 1.0 Strict in place of using XHTML 1.1 to avoid media type problems. XHTML 1.1 is supposed to be served using the media type application/xhtml+xml, not as text, even though you can serve it as text and have it work properly there s a bit of dissent about this in the technical community (see the note that follows for more details). The problem with serving XHTML as XML is that theWeb server in use must be configured properly or use content negotiation concepts outside the realm of this book, and the browser must be able to properly display the results. At this time, it s a hit-or-miss issue, so most people either write in XHTML 1.1 and just serve it as text or avoid it altogether. note To understand the media type issues in more detail, see www.w3.org/ TR/xhtml-media-types/. At this time, unless I m expressly asked to author something in HTML, I use XHTML 1.0 Strict along with CSS for almost all my Web documents. Secret #104: Avoid the XML Declaration The XML declaration (also referred to as an XML prologue or XML prolog) is a bit of XML markup that you can place in XHTML documents above the DOCTYPE declaration, as follows: < ?xml version="1.0" encoding="UTF-8" ?> < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> The purpose of the XML declaration is to identify the document as being an XML document, and you can denote the version of XML as well as the character encoding (see Chapter 6, Crafting Pages with HTML ). Unfortunately, the XML declaration causes a lot more trouble than it s worth for Web designers at this time. There are several reasons for this, all of them due to browsers not properly knowing what to do with the XML syntax used by the declaration. Known problems with the XML declaration include the following: Browsers not interpreting or rendering the markup, but displaying the source instead Browsers rendering the XML tree (see Figure 7-2) instead of the document Browsers with DOCTYPE switching support (discussed later this chapter) not performing the switch According to the XHTML specifications, the W3C says that the XML declaration is recommended, but it is not required for an XHTML document to be valid. Because
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost JSP Web Hosting services
Chapter 7: Moving Ahead with XHTML 147 note As I ve already suggested, just because a language type or version exists or is a current recommendation doesn t mean you have to use it. You can choose to use any language you want. Remember, most of the Web isn t even using valid markup. For the best results, choose a language and DTD that is appropriate for the work you do and for your target browsers. So Is XHTML Better? Back to the question at hand: If we have HTML and it serves its purpose on the Web, is XHTML better? I believe it is, and here are my reasons: You get greater rigor in authoring results in more consistently authored documents. Grammar rules are far less arbitrary in XHTML than they are in HTML. As a result, authors with good knowledge of markup will make fewer errors and waste less time debugging and troubleshooting. XHTML is suitable for a wide range of needs (not just Web), making it a good choice for those designers and document authors looking to extend their content beyond the Web. XHTML is easier to learn and teach because the rules are stricter. Greater rigor in the language means greater consistency in documents from author to author. Extensibility features, even if never tapped into, provide long-term flexibility should the need arise. tip If you d like to upgrade to XHTML but have a limited budget, begin using XHTML on new projects or new portions of your Web site. This way, you begin tapping into the advantages of XHTML without spending money and time redoing older HTML pages. Secret #103: Choose a DTD Since you already know that you must have a DOCTYPE that declares a proper DTD, the first step when working with XHTML is to choose the DTD with which you re going to work. You have the following choices: XHTML 1.0 Transitional. Choose XHTML 1.0 Transitional when you want any kind of presentational elements or attributes in your documents. XHTML 1.0 Strict. XHTML 1.0 Strict is great when you are relying on CSS for all presentation. XHTML 1.0 Frameset. Use this DTD for frameset documents. Individual framed pages can be in any valid format.
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services
146 Part II: HTML, XHTML, CSS and Accessibility Table 7-1: XHTML Versions and Document Types XHTML Version Document Type Usage XHTML 1.0 Transitional DTD In widespread use insofar as XHTML goes it s the version generated by most contemporary Web editors with XHTML support, such as Dreamweaver MX and MX 2004 XHTML 1.0 Strict DTD In use by most Web designers working with CSS and Web standards XHTML 1.0 Frameset DTD For use in XHTML framesets only XHTML 1.1 XHTML 1.1 XHTML 1.1 is the currently recommended specification. It has only one DTD, based on XHTML 1.0 Strict. It is not in widespread use due to concerns related to the way it s served (discussed in detail later this chapter) want, and leave others out. This is especially important for browser and user agent developers designing for multiple devices think about it, you can t run a complex Java application on a smart pager or mobile phone just yet due to technological limitations, but you can access basic Web content. There isn t the same need on smaller devices to support the kinds of features and functions necessary on desktop and notebook computers. note Read more about the modularization of XHTML at the W3C site, www.w3 .org/TR/xhtml-modularization/. The ability to write one s own DTD is part of the essence of XHTML because it is there that we find the extensibility and customization features that HTML cannot offer.Writing your own DTD can also enable you to include elements and attributes in the language that don texist in the public DTDs at the W3C. This is more trouble than it s worth for smaller Web sites, but for very large sites using custom features, it can be extremely useful to have that flexibility available. note To see a custom DTD in action, visit www.ibm.com/ and take a look at the DOCTYPE in use. IBM, being one of the earliest adopters of SGML applications for document management, authors and adheres to its own DTDs. At the time of this writing, XHTML 2.0 is being worked on and has caused some controversy as the working group studying it has decided to add some elements and take away others some that are popular and widely used. As a result, new features will have to be supported by browsers without any chance for backward compatibility, and features that are removed can no longer be used.
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services
Chapter 7: Moving Ahead with XHTML 145 To provide extensibility to Web authors To support a growing number of alternative devices such as set-top boxes, PDAs, pagers, and other mobile or unique devices tapping into Web-based information Newcomers sometimes ask if XHTML is backward compatible and supported in older browsers. Yes, XHTML is supported by any browser that can interpret HTML (see Figure 7-1), because XHTML uses HTML s vocabulary. The main difference is in the rigor, how the language is written, and how strictly its rules are adhered to. Figure 7-1: I took the valid HTML document created in Chapter 6, upgraded it to XHTML 1.1, and viewed it in Mosaic, the Web s first widely used graphical Web browser. It works! note An excellent repository of Web browsers is available at http://browsers .evolt.org/. XHTML Versions and DTDs Like HTML, XHTML comes in versions and offers a range of DTDs from which to choose. Table 7-1 describes the language versions, DTDs, and uses for XHTML. You can see that a major change occurred with XHTML 1.1. This is because by this point in the language, there is no longer any need for Transitional DTDs CSS can handle presentation, and all that s really required in the document itself is the structural markup and content. Another important point about XHTML 1.1 is that it s modularized. It s broken down into individual modules such as text, tables, forms, and so on. This gives authors the flexibility to write their own DTD, pull in only those modules they
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Linux Web Hosting services
144 Part II: HTML, XHTML, CSS and Accessibility This chapter debunks myths, explains what XHTML is and why it s so very important, and provides all the scoop on how to author XHTML documents that you can use in every browser known to humankind even those for alternative devices such as PDAs and cell phones. About XHTML If you re wondering why we need another language when HTML seemed to work just fine, you re not alone. Many people in the Web industry including some markup experts aren t necessarily convinced that XHTML offers any of the advantages for most Web designers that HTML does. You might be surprised to read that I agree. For the most part, if you re designing Web sites, you can use HTML or XHTML. My major concern is that you use one or the other according to the standard and according to the rules and practices described here and in Chapter 6, Crafting Pages with HTML. Aside from that, I do believe that XHTML is a better choice for a few significant reasons, and this introduction and the subsequent secrets here reveal the advantages that XHTML does offer. History As you are aware, SGML is the meta-language from which Tim Berners-Lee created HTML. As the Web progressed both as a social and technical phenomenon, working groups at the W3C began to study long-term ideas for the languages and methods used on the Web. Many technologies have since emerged, including the Extensible Markup Language (XML). XML, like SGML, is a meta-language that consists of specifications and guidelines for creating applications and other language subsets. XML, like HTML, also emerged from SGML, although not as a subset language itself. Think of XML as SGML lite for the Web it is more streamlined than SGML, yet retains SGML s strict rules while simultaneously offering its authors flexible customization options. With XML in hand, HTML 4.0 in place with its three DTDs, and CSS available, the W3C began re-examining HTML and determined that it had limitations in the way it is specified and would not extend beyond those limitations after a certain point in time. Seeking stricter practices but wanting to offer extensibility, the W3C looked to XML as a means to influence HTML. So HTML was reformulated as an application of XML (rather than its original SGML) and the Extensible Hypertext Markup Language (XHTML) was born. Goals of XHTML The limitations of HTML largely emerge from its very specific vocabulary, which carries over into XHTML. XML itself is very semantic remember in Chapter 6 the discussion of semantic meaning and tags? In HTML, we use specific tags to achieve a given goal. In XML, tags are more specific to the topic at hand and are entirely generated by the author. XHTML attempts to provide some bridge from the limitations of a specific vocabulary to a more open specification where the author can create his or her own DTDs and modify the language as required. Following are some of the specific goals of XHTML: To bring more rigor (rigid rules) to the authoring of Web documents
Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services