Home > Article > Web Front-end > 6 principles that html5 needs to abide by (introduction)

6 principles that html5 needs to abide by (introduction)

青灯夜游Original: 2018-09-26 16:33:192694browse

What are the series of principles that enable HTML5 to be quickly promoted? This chapter introduces you to the six principles that HTML5 needs to abide by. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Principle 1: Avoid unnecessary complexity

html4

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

html5

<!DOCTYPE html>

html4

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

html5

<meta charset="utf-8">

Principle 2: Support existing content

The following four pieces of code are only available in xhtml The first paragraph is correct; and in html5, everything is correct

XML/HTML

<img src="foo" alt="bar" />  
<p class="foo">Hello world</p>

<img src="foo" alt="bar">  
<p class="foo">Hello world

<IMG SRC="foo" ALT="bar">  
<P CLASS="foo">Hello world</P>

<img src=foo alt=bar>  
<p class=foo>Hello world</p>

Principle 3: Solve real-life problems

In html4, even if two block-level elements have the same link address, they must be written separately, because inline elements cannot contain block-level elements

<h2><a href="/path/to/resource">Headline text</a></h2>
<p><a href="/path/to/resource">Paragraph text.</a></p>

And in html5 , due to the use of the content model, the 3499910bf9dac5ae3c52d5ede7383485 element can also contain block-level elements

<a href="/path/to/resource">  
    <h2>Headline text</h2>  
    <p>Paragraph text.</p>  
</a>

Principle 4: Be truthful and pragmatic

html5 has added multiple Elements, including: section, article, aside and nav, they represent a new content model - partitioning content. People have been using divs to organize content on pages in the past, but like other similar elements, divs themselves have no semantics. But section, article, aside, and nav are actually telling you clearly that this section is like another document within the document. Any content located within these elements can have its own summary, its own title, its own footer.

Principle 5: Smooth degradation

When the browser encounters an unrecognized type value, it will interpret the value of type as text

input type="number"
input type="search"
input type="range"
input type="email"
input type="date"
input type="url"

Principle 6: End user first

In case of conflict, the end user takes priority, followed by the author, followed by the implementer, followed by the standard The framer, in the end, is the theoretical perfection.

The above are the 6 design principles that HTML5 needs to follow. I hope it will be helpful to everyone's learning.

The above is the detailed content of 6 principles that html5 needs to abide by (introduction). For more information, please follow other related articles on the PHP Chinese website!

html5 html xhtml xml

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to wrap canvas text? Introduction to the method of wrapping text in canvasNext article：How to wrap canvas text? Introduction to the method of wrapping text in canvas

See more

6 principles that html5 needs to abide by (introduction)

Related articles