HTML5 Introduction
HTML5 is the next-generation HTML standard specification following HTML4, which provides some new elements and attributes (such as <nav>
site navigation blocks and <footer>
). New labels are good for search engines and semantic analysis, and at the same time help small-screen devices and visually impaired people. In addition, there are some new features, such as video audio <video>
and <audio>
, in summary terms. There are several major features such as the following:
- Removed some obsolete element and attribute tags in the HTML4
There are markers that contain purely display effects, <font>
such <center>
as and, which have been replaced by CSS. HTML5 draws on some XHTML2 suggestions, including some features to improve the structure of the document. For example, the use of new HTML tags,,,, and header
footer
so on dialog
aside
figure
, will enable content creators to create documents more semantically, which are generally used by previous developers when implementing these features div
.
- Separation of content and presentation
b
and i
labels remain. But their meaning is different from before. These tags are meant only to identify a piece of text, rather than to set a bold or oblique sample for them. , and the u
font
center
strike
labels are completely removed.
- Add some new form input objects
Contains the date, Url,email address. Other objects have added support for non-Latin characters.
HTML5 also introduces micro-data. This method of labeling content using a label that the machine can recognize. Making the semantic Web easier to handle. Overall. These structure-related improvements enable content creators to create cleaner, easier-to-manage Web pages for search engines. More friendly to read screen software.
- Brand new, more reasonable labels
Multimedia objects will no longer be all bound in object
or embed
Tag. Instead, the video has the tag of the video, the audio has the audio tag.
This feature will embed a local SQL database to speed up the interactive search. Caching and indexing capabilities. At the same time, those offline Web programs will also benefit. There is no need for rich animations of plugins.
will give the browser the ability to draw vectors directly above, which means that users can move away from flash and Silverlight and display graphics or animations directly in the browser.
HTMLDocument
HTMLElement
provides a new API extension for and excuses.
- HTML5 instead of Flash and Silverlight
Syntax (Syntax) 1 Document Media type
Most of the HTML syntax defined by HTML5 is compatible with HTML4 and XHTML1. But a part of it is incompatible. Most HTML documents are saved as text/html media types.
HTML5 defines specific parsing rules (including error handling) for HTML syntax, which the user must follow to save it as a text/html media type.
For example, here is a sample that conforms to the HTML syntax specification:
<!DOCTYPE HTML><HTML> <Head> <MetaCharSet= "UTF-8"> <title>Example Document</title> </Head> <Body> <P>Example Paragraph</P> </Body></HTML>
HTML5 also defines a text/html-sandboxed media type for HTML syntax to be able to host untrusted content.
Other syntax that can be used in HTML5 is XML, which is compatible with XHTML1. With XML syntax, you need to save the document as an XML media type, and you need to set the namespace (namespace) to http://www.w3.org/1999/xhtml according to the XML specification.
The following sample document conforms to the XML syntax specification in HTML5, and it is important to note that the XML document must be stored as an XML media type. Like Application/xhtml+xml or Application/xml.
<?XML version= "1.0" encoding= "UTF-8"?><HTMLxmlns= "http://www.w3.org/1999/xhtml"> <Head> <title>Example Document</title> </Head> <Body> <P>Example Paragraph</P> </Body></HTML>
2 Character Encoding
In HTML5 's HTML syntax, there are three ways to declare the encoding type of a string:
- On the transport level (transport levels). Set the Content-type in the header of the HTTP instance.
- Set a Unicode byte Order Mark (BOM) at the beginning of the file. This character provides a signature for the encoding method of the file.
- In the content before the first 1024 bytes of the document, use the META element with the CharSet attribute to declare the encoding mode.
For example:<meta charset= "UTF-8" > indicates that the document is in UTF-8 format. It replaces the original <meta http-equiv= "Content-type" content= "text/html; charset=utf-8" > syntax declarations, although the original syntax is still available. But it is not recommended in HTML5.
FOR XML syntax in HTML5. is still the same as the previous XML syntax declaration.
3 DOCTYPE
HTML5 's HTML syntax requires the document to be declared DOCTYPE to ensure that the browser can present the page in standard mode. There is no other purpose for this DOCTYPE. And in XML is optional, because the XML media format of the document has been in the standard mode of processing.
DOCTYPE is declared by <! DOCTYPE html>, with no distinction between uppercase and lowercase.
The earlier version of HTML declares that the DOCTYPE need to be very long because the HTML language is based on SGML, so it is necessary to associate a reference to a corresponding DTD.
HTML5 and the previous version number is different, only need to declare DOCTYPE to be able to tell the document enabled is the HTML5 syntax standard, the browser will be <! DOCTYPE html> Do the rest of the work.
4 MathML and SVG
HTML5 's HTML syntax agrees to use the MathML (mathematical Markup Language) and SVG (scalable vector) elements in the document. Like what. A very easy HTML page includes a circle drawn by an SVG element:
<!DOCTYPE HTML><title>SVG in text/html</title><P>A Green Circle:<svg> <CircleR= " the"CX= " the"Cy= " the"Fill= "Green"/> </svg></P>
Many other complex combinations of tags are also supported, for example, using SVG's foreignobject element you can nest MathML, HTML, or nesting itself.
5 Other
HTML5 has natively supported IRI, although these IRI can only be used in UTF-8 and UTF-16 documents.
The Lang property assumes that the setting is not valid and will be updated to an empty string. To tell the browser that it is an unknown language. The function is the same as the Xml:lang in XML.
HTML5 Study Notes (1): HTML5 Introduction and grammar