Home > Developer > Web Develop
First, what is a Web standard? Web standards are the specifications that are introduced by the Organization to address cross-browser compatibility issues with respect to web development. In the four parts of the webpage, the content of the Web page is defined by the web Developer itself, so this part can not be standardized, and the structure of the Web page (HTML), Behavior (JAVASCRIPT), Performance (CSS) part, the organization has defined the corresponding standard language to develop, called the Web Standard.
The Web Standard is not a standard, but a set of standard, which contains the structure standard language (xhtml/html), the Performance standard language (introduced in May 1998), the standard language of behavior, etc., detailed reference (http://www.w3c.org);
I. The difference between XHTML and HTML
1. XHTML is a new technology that we should be familiar with before browsers and some other software support it.
The biggest difference between them is:
The 1.XHTML element must be properly nested.
In HTML, some elements can be incorrectly nested and can be displayed normally, such as:
<b><i>this text is bold and italic</b></i>
The XHTML must be properly nested before it can be used normally, such as:
<b><i>this text is bold and italic</i></b>
Note: This error usually occurs in tags after nesting multiple layers. Such as:
<ul>
<li>Coffee</li>
<li>tea
<ul>
<li>black tea</li>
<li>green tea</li>
</ul>
<li>Milk</li>
</ul>
The correct one should be:
<ul>
<li>Coffee</li>
<li>tea
<ul>
<li>black tea</li>
<li>green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Observing the above two-segment code we can see the correct inside we insert </li> tag after </ul>.
XHTML files must have the correct organizational format.
All XHTML should be properly nested within the element with the <body> ... </body>
Label names must be in lowercase letters.
Because XHTML documents are XML applications, XML is sensitive to capitalization. Like <br> and <BR> are two different marks. such as the error code:
<BODY>
<p>this is a paragraph</p>
</BODY>
The correct format is:
<body>
<p>this is a paragraph</p>
</body>
All XHTML elements must be closed
Can not have no closed empty elements exist in our code, in fact, for this we are relatively good end, there should be the beginning of the end? For example, the error code:
<p>this is a paragraph
<p>this is another paragraph
The correct is:
<p>this is a paragraph</p>
<p>this is another paragraph</p>
A separate label we're going to end up with/>.
Example: Error code
This is a break<br>
Here comes a horizontal rule:Here's an image
Correct code:
This is a break<br/>
Here comes a horizontal rule:Here's an image
We basically see the difference between HTML and XHTML through the above examples, so we should try to change our current HTML from now on, for example, we use lowercase tags, and the symbol/> with the closing tag after the tag.
The syntax of XHTML
Simply write XHTML with clean HTML syntax.
Some of the other syntax requirements for XHTML are:
Attribute names must be lowercase. Such as:
Error code:
<table width= "100%" >
The correct code:
<table width= "100%" >
The property value must be referenced. Such as:
The wrong code:
<table width=100%>
The correct code:
<table width= "100%" >
The abbreviation for the attribute is forbidden. Such as:
The wrong code:
<DL compact>
<input checked>
<input readonly>
<input disabled>
<option selected>
<frame noresize>
The correct code:
<DL compact= "compact" >
<input checked= "Checked"/>
<input readonly= "ReadOnly"/>
<input disabled= "Disabled"/>
<option selected= "Selected"/>
<frame noresize= "Noresize"/>
List A table to let you know:
HTML XHTML
Compact compact= "compact"
Checked checked= "Checked"
DECLARE declare= "DECLARE"
ReadOnly readonly= "ReadOnly"
Disabled disabled= "Disabled"
Selected Selected= "Selected"
Defer defer= "defer"
Ismap ismap= "Ismap"
Nohref nohref= "Nohref"
NoShade noshade= "NoShade"
nowrap nowrap= "NoWrap"
Multiple multiple= "multiple"
Noresize noresize= "Noresize"
Replace the name attribute with the id attribute. Such as:
In HTML 4.01, a name attribute is defined for A,applet, frame, iframe, IMG, and map. In XHTML, the name attribute cannot be used, and it should be replaced with an ID. Such as:
Error code:
The correct code:
Note: We can also use both the ID and the Name property in the tag in order for the old browser to be able to execute the content normally. Such as:
In order to adapt to the new browser browse our above code in the end I added/to end the tag.
The XHTML DTD defines the type of document.
In XHTML we have to declare the type of document so that the browser knows what type of document you have, and the declaration part is added to the head of the document. Such as:
<! DOCTYPE DOCTYPE goes here>
<title>title goes here</title>
Body text goes here
</body>Note: The DOCTYPE declaration is not part of the XHTML document, nor is it an element of the document, so we do not need to add an end tag.
Note: XHTML attributes are all in the
The basic body we use when using DOCTYPE:
<! DOCTYPE ...>
<title> </title>
<body> ... </body>
DOCTYPE is a shorthand for document type, which is used to describe what version of XHTML or HTML you are using.
The DTD (for example, XHTML1-TRANSITIONAL.DTD) is called the document type definition, which contains the rules of the document, and the browser interprets the identity of your page according to your defined DTD and shows it.
The DOCTYPE statement is an essential part of establishing a standard-compliant web page, and your logo and CSS will not take effect unless your XHTML determines the correct doctype.
XHTML 1.0 provides three types of DTD declarations to choose from:
Transition (Transitional): A very liberal DTD that allows you to continue to use HTML4.01 's identity (but to conform to XHTML notation). The complete code is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Strict (Strict): Requires strict DTD, you cannot use any of the presentation layer's identity and attributes, the complete code is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
Framework (Frameset): A DTD used specifically for frame page design, if your page contains frames, you need to use this DTD. The complete code is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 frameset//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd" >
How to convert an existing structure to XHTML
What kind of doctype do we choose? The ideal scenario is of course a strict DTD, but for most of us who are new to Web standards, the transition DTD (XHTML 1.0 Transitional) is the ideal choice (including this site, which is also a transitional DTD). Because this DTD also allows us to use the identity, elements and attributes of the presentation layer, it is also easier to pass the code validation.
2. We will note the following points from the current HTML conversion to XHTML:
1), add a description of the document type to the header of each page. Such as:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Of course you can choose other types of.
2), Mark, and name are all lowercase.
We can write a replacement program ourselves, change all the tags in your HTML document to lowercase letters, and the Name property to lowercase.
3), all attribute values are enclosed in quotation marks.
4), a separate label, such as:
5), we open the website of the Web site DTD: http://validator.w3.org/check/referer, the general error in verification may appear in your tag nesting. You can also use the conversion tool provided by the official website Tidy to achieve the conversion: http://www.w3.org/People/Raggett/tidy/, I do not recommend that you use the tool directly to verify, because we are after all the newly-acquired XHTML we still convert ourselves, So we can be familiar with XHTML, and then we have to learn the use of tidy tools, which is also more troublesome.
6), we directly open the following page can directly enter the URL to verify our program: http://webjx.com/js/standard.htm
The modularity of XHTML
Why Modular design XHTML? Although XHTML is simple, it has a lot of content, including most of the features a web designer needs. XHTML is complex on the one hand, but it is very simple from another point of view. In order to divide XHTML into smaller modules, the consortium has built a small set of XHTML elements that have been defined, and are used independently by simple devices that can be combined into larger, more complex programs with other XML standards.
Through the XHTML model, the programmer can do the following things:
1. Select the elements supported by devices that can be used by the XHTML building blocks standard.
2. Using XML while adhering to the XHTML standard can be extended to XHTML.
3. Simplistic XHTML can be applied to devices like handheld computers, mobile phones, televisions and home appliances.
4. Extend XHTML to the design of complex programs by adding new XML features like sound and multimedia.
5. Define XHTML outlines like XHTML Basics (XHTML is a subset of mobile devices).
Original URL:http://hi.baidu.com/skway/item/711bbde63d7cebadc10d75c7
Main differences:
XHTML elements must be nested correctly
XHTML elements must be closed, and empty tags must be closed, such as <br> must be written <br/>
XHTML tag names must be in lowercase letters
XHTML documents must have root elements
XHTML documentation requires assigning a value to all properties
XHTML requires that all attributes be enclosed in quotation marks "".
XHTML documents need to encode all <, >, & and other special symbols
XHTML documents do not make "--" in the comment content
XHTML images must have descriptive text
The id attribute in place of the name attribute in an XHTML document
Two. The idea of separation of structure, expression and behavior in Web standards
Advantages of Separation:
1). Facilitate the Division of labor and Cooperation. Improve development efficiency.
2). Separate the presentation and structure of the Web page to facilitate maintenance and optimization of the Web page.
3). Web pages that contain only structures are more likely to be searched by search engines.
4). Separating the behavior of the Web page into a separate JavaScript file facilitates the reuse of the code.
Understanding of Web standards
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
