Free HTML5 serialization: HTML5 web development instance details (3) DOCTYPE and Character Set, html5doctype

Last Update:2014-07-24 Source: Internet

Author: User

Tags script tag

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Free HTML5 serialization: HTML5 web development instance details (3) DOCTYPE and Character Set, html5doctype

In section 2.1.2, by comparing the old and new DOCTYPE, you can clearly see the efforts made by HTML 5 in streamlining the old structure. DOCTYPE is mainly used in XML at the beginning of its appearance to describe the elements, attributes, and arrangement allowed by XML. At first, HTML draws on the use of DOCTYPE in XML and provides new usage, such as the well-known standard mode for triggering browsers. If DOCTYPE is not set when a page is created, the browser will process it in weird mode (Quirks mode ), this mode is significantly different from the standard mode in the box model, style, layout, and so on. Therefore, DOCTYPE is an indispensable part of page creation.

In the previous HTML 4 standard, DOCTYPE is divided into three modes:

Strict mode: strictly follows W3C standards. The code format is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

The transition mode contains W3C standard content and can also use tags that are not recommended by W3C, such as font and B. framework elements (frameset elements) cannot be used ), the code format is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">

Framework mode. You can use the framework element. Others are the same as the transition mode. The code format is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Tip: For more information about the old html doctype standard, see W3C official documentation. The webpage address is http://www.w3.org/tr/%/rec-html401-%1224/struct/global.html%h-7.2. Although the previous version of HTML imposes many rules on DOCTYPE, the actual situation is that the browser will render the corresponding page as much as possible, even if some non-conforming practices may occur, the only difference is that the browser will display some error warnings on the console. This is often called browser fault tolerance, but it is actually a compromise between the market and users.

The story evolved to HTML 5. W3C removed the original DOCTYPE statement and simplified it to the following format:

<!DOCTYPE html>

For the vast majority of developers, this method is enough to meet the needs of daily development and use, but if you want to consider a series of problems such as compatibility and expansion in the future, we also need to know some new W3C regulations on DOCTYPE, which are mainly divided into three categories:

Normal mode, that is, <! DOCTYPE html>
The abandon mode, which sounds like Alibaba Cloud, actually refers to the compatibility mode of the past mode. However, HTML5 discards the previous transition mode and framework mode, and finally leaves six writing formats. The Code is as follows:

<! DOCTYPE html PUBLIC "-// W3C // DTD HTML4.0 // EN">

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML4.01//EN"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Strict//EN"         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Legacy compatibility mode: a compatibility method that is unable to verify rules in the past. The syntax format is as follows:

<!doctype HTML system"about:legacy-compat">

By understanding the browser DOCTYPE, you can be familiar with the Triggering Method of the browser mode. However, in general development, you only need to use<! DOCTYPEhtml>This normal mode.

Tip: for the latest three modes of HTML 5, visit http://dev.w3.org/html5/markup/syntax.html?doctype-syntax.

The so-called character is a general term for various texts and symbols, covering texts, punctuation marks, graphical symbols and numbers from various countries. Character sets are a set of multiple characters. Common Character sets include ASCII, GB2312, Unicode, and ISO. To allow computers to accurately process various character sets, scientists need to encode the characters so that computers can recognize and store various texts.

Before HTML 5 appears, the browser will confirm the page encoding format in three ways, sorted by priority as follows:

Obtains the value of the Content-Type character in the HTTP request header.
Use meta tag declaration. The syntax format is as follows:

<meta http-equiv="Content-Type"content="text/html; charset=utf-8">

External resources use the charset attribute to declare the encoding format. For example, the syntax format in the script tag is as follows:

<script type="text/javascript"src="myscripts.js" charset="UTF-8"></script>

After the emergence of HTML 5, the use of character sets has been greatly simplified, you can use the following syntax for character set declaration:

<meta charset="utf-8">

For Daily website development, combined with the character set of HTML 5, the author provides the following suggestions:

Use the HTTP request header to specify the encoding priority.
Unified full-Site Character Set encoding, HTML 5 recommended UTF-8 character set.
Use meta tags to confirm character set encoding and try to place it at the first child element of the html Tag.
Third-party referenced scripts, when the character encoding is not confirmed, add the charset attribute to set the encoding format.

The best book to learn HTML5 is "HTML5 web development instance details". It is much more interesting to use code to learn and use case studies !!! One book handles HTML5, starting from now on.

Html5 doctype can be used for html4

Html5 is more concise than html4. HTML5 simplifies many subtle syntaxes, such as the doctype statement. You only need to write <! Doctype html>. HTML5 is compatible with HTML5 and XHTML1, but not SGML.
Html5 has the backward compatibility feature. It can completely display HTML 4 content. As for the tags you write and the problems that the browser explains, it mainly depends on the browser. This can be achieved through css. Yes.
Thank you.

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More