The future of Web: XHTML 2.0

Change Overview

Nicolas chase
President, Chase and chase, Inc.
January 2003

For many years, HTML has only been growing, but has never become smaller, because the new version must maintain backward compatibility. This situation will change. The first draft of XHTML 2.0 was published in August 5, 2002. One major news was that backward compatibility was abolished and the language was finally evolving. So what do you get as a developer? What is the performance of robust forms and events? They are a better way to study frameworks that do not require a lot of JavaScript and even hierarchical menus.

This section describes new features in XHTML 2.0 and how to use them in the future. Readers should be familiar with HTML and/or XHTML 1.0. Familiarity with Cascading Style Sheet (CSS) is helpful, but not necessary.

Remove backward compatibility and introduce Structure
When the World Wide Web Consortium (W3C) released the first draft of work for XHTML August 5, 2002 in 2.0, the most surprising thing was that, unlike earlier versions, it is not backward compatible. For previous releases, such as converting from HTML 4.01 to XHTML 1.0 and later from XHTML 1.0 to xthml 1.1, some content is added. You can read XHTML 1.0 (Transitional) the document browser can also understand the HTML 4.01 document. That's not the case with XHTML 2.0.

If you announced two years ago that we will study todayimgMark orboldIf the html version is marked, most web developers may look at you with suspicion. However, this is the case now. In addition to completely replacing the form and framework, XHTML 2.0 also removesb,iAndimgMark (andbig,smallAndtt).brTo remove it from future releases. But why?

The reason is that most of the tags areExpressive. They only aim to give browser instructions on how the content should be displayed, but do not provide information about what the content is. For example, consider the following two sentences:

Presentational elements are, <i>for the most part</i>, <b>gone</b>.

And

Presentational elements are, <em>for the most part</em>, <strong>gone</strong>.

Without a style sheet, the two sentences look the same in the browser, but only the second sentence provides information about the cause. In fact, from the very beginningem(Emphasis) andstrongTags appear in HTML, but the authors have ignored them for many years, and focused on representations, at the cost of sacrificing content.

However, this does not mean that as long as you want to make some content bold or italic, they should be hard inserted into the two tags. On the contrary, the purpose of removing the expressive element is to try to fulfill the original intention of the inventor of CSS, that is, to mark the content based on what the content represents, and the style sheet should be used to beautify the content. For example,Listing 1Class is used to indicate the content type.

Listing 1. specifying the content type by category

On this page, the date type can be determined by the content, and the browser can use the category information to determine how to design the style for it, as shown inFigure 1.

Figure 1. The category determines which type of content to display. The style sheet can be properly formatted.

Study it from this point of view: disconnect (br) The purpose of the tag is nothing more than display, because it does not actually have any content. XHTML 2.0 does not supportbrMark, and advocate the uselineMark.lineMark to specify a special content: a line of text or other content that is usually presented with a line break or carriage return. For example, text:

<p>public class HelloWorld {<br />public static void main (String[] args){<br />System.out.println("Hello world!");<br />}<br />}</p>

Change

<p><line>public class HelloWorld {</line><line>public static void main (String[] args){ </line><line>System.out.println("Hello world!"); </line><line>}</line><line>}</line></p>

In this way, the document has an actual object that represents a row (p) Indicates a piece of content.

Why is all this important? Because web is increasingly becoming a place for communication between people, and increasingly a place for communication between software applications (such as servers and search engine indexers. Moreover, the times when everyone (or almost everyone) uses the same browser are gone forever. Developers are constantly re-designing content for different devices (such as PDAs and mobile phones. The voice-activated system is not far from us. The structural significance of the content is almost as important as the content itself.

Section
Therefore, sections and heading are added to XHTML 2.0 ). HTML always contains the title of the serial number ―h1Toh6The work draft was not withdrawn until August 5, 2002, but it was just a matter of time. XHTML 2.0 uses general titles and sections. For example, you can nest a section to give the title meaning. The document previously presented with the serial number title (Listing 2):

Listing 2. Numbering titles in the document

You can replace it with a general title and section (Listing 3):

Listing 3. General titles and sections

This structure has two advantages. First, applications (such as search engine crawlers) can more easily understand the relative importance of content, and second, the Section is self-contained. In HTML, the section starts with its title, so no content (such as introductory content) appears before the title ).sectionThe element removes this constraint because any content inside it is part of the section.

Navigation list and menu
Added a structure that will greatly benefit web developers, that is, the navigation list. BynlHow the specified navigation list works with its "cousin" ordered list (ol) And unordered list (ul) Is very similar, but there is a difference: items in the navigation list only appear when the list is activated. Therefore, the navigation list is very similar to the hierarchical pop-up menu, which is very popular because it provides a lot of navigation information and does not occupy too much screen space. For example, a soap opera site may have the following menus (Listing 4):

Listing 4. Use the navigation list

<nl> <name>Character Options</name> <li href="stay.html">Stay</li> <nl> <name>Leave</name> <li href="newjob.html">Job transfer</li> <li href="divorce.html">Divorce</li> <li href="fataldisease.html">Fatal disease</li> </nl> <li href="backburner.html">Back Burner</li></nl>

When the user activation name (Character Options. When a user activates the master listLeaveMenu), or the user must activate the sublist item to make it appear, the Work draft is not clear. The final author may control this line through styles or events. In any case, when the input focus is removed from the primary element, the list items will disappear.

Links are everywhere
You may have noticed that, even if you plan to use the previous example as a menu, it does not have an anchor (a. WhilehrefAttribute has been correctly placedliElement. This is not a feature of the navigation list, but a new feature of XHTML 2.0. Hypertext-related attributes (for examplehref,targetAndaccesskeyIs now part of the common attribute collection, which includes (class,idAndtitle), International properties (xml:langIt replaceslang) And event attributes. The event attributes are from the XML events proposal, as you will see below.

This means that as longhrefWhen an attribute is added to any element, it can be converted to a link, instead of using an anchor tag to enclose a single element.

Does this mean that xlink has been adopted by XHTML 2.0 after four years of hard work? All in all, no. In fact, the difference between the links specified in xlink and XHTML 2.0 is the root cause of the debate between developers engaged in their respective proposals, therefore, some changes may be made between the initial draft of Public Work and the final proposal. At the same time, you can use this function, navigation list,linkAnd the Resource Description Framework (RDF) to copy most of the xlink functions.

XForms is an XML-related proposal and has indeed become part of XHTML 2.0.

XForms
XML forms language (XForms) is a completely new way to study forms-like the rest of XHTML-with completely independent content, structure, and presentation. The XForms page specifies a model that has information about the form itself. Then, you can spread the form elements around the page, instead of being limited to a single form element. This means that you can even combine elements of different forms in the same area of the page. You can use the instance document to fill the form. The instance document is referenced from the XPath expression on the form element. Form elements themselves represent special types of objects, rather than describing how they are displayed on pages. When the data in the form element is updated, the instance document is updated. When a user submits a form, the instance document is actually sent. For example, the following simple form (Listing 5):

Listing 5. simple HTML form

Listing 6Form with The XForms version displayed:

Listing 6. XForms forms

Glossary: The XForms proposal specifically states that there is no XForms for a single form. It is not a single XForm page.

Forms generally require verification. In other words, data fields must contain valid data. XForms uses the XML mode to constrain the submitted data. In addition, you can add XML events (which is also included in XHTML 2.0) to further enhance the XForms page function.

XML events
You may already be familiar with addingonclickAndonmouseoverSuch events are used on Web pages. No more. These familiar attributes have been replaced by the XML events module integrated into XHTML 2.0. XML events provides a common method to specify the actions that should be taken when an event occurs. It has the advantage that you are not limited to predefined events such as mouse clicks. Instead, you can define your own events and what will happen when they are triggered.

XML events contains the following components. Events such as mouse clicks can be used as targets. For exampleListing 7As shown in the following figure:

Listing 7. page to be clicked

The user may click the secondliThe Matterhorn element. When this happens, move the cursor over the event from the document root to the target (li) And return again. The order is:

(root) -- html -- body -- ul -- li -- ul -- body -- html -- (root)

Heading down to the target is called the capture phase, and heading up again is called the bubbling phase (not all events will bubble up ). At any time during the process, an event can pass an object that has been registered as an observer (which means it is observing a specific event). If it sees an event, it performs a specific operation. The listener creates an observer. For example, in the following sequence:

<ev:listener observer="ridelist" event="mousedown" handler="#myscript"/>

Enable the listenerulAn element (or more accurately, the entire list) becomes an observer. Therefore, when a user clicks any list item, The Observer (ridelist) Executionmyscript(However, you must still be sure to call any script mechanism ).

Xframes
The widely criticized framework is also replaced in XHTML 2.0. Xframes's first draft of work debuted in early August 6, 2002, the day before XHTML 2.0 announced it would use xframes and try to solve problems with traditional HTML frameworks. Most problems are related to the difficulty of creating bookmarks and refreshing pages, and the failure of search engines that do not support frameworks to index appropriate content.

In the xframes document, the uri of the contained content becomes part of the URI of the entire document. For example, the followingListing 8The page in may indicate HTML pages with three frameworks:

Listing 8. xframes page

Note that the URI of each framework is not specified, but each framework has its own unique identifier. Therefore, the URI of this document may be:

site.xfm#frames(header=header.xhtml,menu=menu.xhtml,content=main.xhtml)

Then, the browser that understands xframes associates the content of each frame with the appropriate Uri. When a user clicks a link and changes the content of an individual framework, the whole URI of the page is changed, so it always displays the actual content that the user is viewing, the "add to Favorites" and "back" buttons provide accurate content.

Image as object
The last major change to the draft of work in August 5, 2002 included the removalimgMark and useobjectMark to replace it.objectTag actually appears in HTML 4.01, but developers mainly embed it into multimedia and Java applets. However, it always supports images. The main advantage of object tagging is that it is designed as a subordinate link. In other words, if the browser cannot display a specific object, it will display the content of the object. For example, a browser that encounters the following code snippets first tries to mount a movie. If the film fails to be loaded, the image will be loaded. If the image fails to be loaded, only the text is displayed.

<object data="rides.mpeg" type="application/mpeg"> <object data="rollercoaster.jpg" type="image/jpg"> Jack tries to expand his horizons on the racing coasters. </object></object>

Subsequent steps
The only thing that can be determined in the August 5, 2002 XHTML 2.0 work draft is that nothing can be determined. In the current draft and adoption of proposals, it is almost certain that it will change in some aspects, but the objective of emphasizing structure and semantics cannot change. For this reason, it is best to study the page you are building now and start to develop the habit of using structures and styles as appropriate. Use tags to specify what something is, rather than how to display it, and use CSS to complete other work. In general, consider the structure of the document and what you want them to do, instead of having to think too much about how they will be displayed.

References

• You can refer toOriginal ENGLISH.

• SeeXHTML 1, 2.0To understand what it currently contains.
• Find out how to useXML eventsControls the event information on the page and any XML document.
• Please read and useXForms.
• Please read the article"Get ready for XForms"(DeveloperworksSeptember 2002), learn more about XForms.
• Please readXframes.
• Please readModularization of XHTMLOr readDeveloperworksIn the Web architecture areaXHTML ModularizationTutorial (July October 2001) to learn how to construct XHTML 2.0.
• Please goXHTML 2.0 the latest trickSee Kendall grant Clark's comments on XHTML 2.0 and semantic web.
• Please goXlink: Who cares?Read Bob Ducharme's Thoughts on xlink and its prospects.
• DownloadX-smilesIs an XForms browser.

 

About the author Nicholas Chase has participated in website development for many companies (such as Lucent Technologies, Sun Microsystems, Oracle and Tampa Bay buccaneers. Nick was a high school physics teacher, a low-radiation waste equipment manager, online sci-fi magazine editor, multimedia engineer, and Oracle lecturer. Recently, he became the CTO of site dynamics interactive communications (Clearwater in Florida) and author of three books on web development, includingJava and XML from scratch(Que) and to be publishedPrimer plus XML Programming(SAMs ). He is happy to hear from readers.Nicholas@nicholaschase.comContact him.