Home > Developer > Web Develop
This article for the previous period of time the team produced, and small partners XI round the results of the study, accidentally on the company's today recommended, move today, for the newly opened blog first warm field.
First, the common label Second, label introductionThe
There can be more than one
Example scenario:
Precautions:
Do not overuse Bad:
Good:
<footer>The <footer> tag represents the end of a page or fragment (the "foot"), usually containing some basic information about the page (or fragment), such as the author, copyright, links to related documents, contact information, and so on.
There can be more than one <footer> tag in a page.
Example scenario:
<nav>The <nav> tag represents the navigation area of the page, usually containing a set of navigation links.
A page can have more than one NAV element, as a whole or different part of the navigation of the page.
Not all of the link groups on the page need to be included in <nav>-only those parts that are made up of the main navigation links apply. For example, the link group in <footer> usually does not need to be placed in <nav>, directly with <footer> inclusion.
<nav> is very useful for accessibility, you can skip/skip to links directly (assuming, of course, that most disabled users already use a screen reader that supports H5).
Example scenario:
<aside>The <aside> tag represents a page area that contains content that is related to the main content of the page, but which can exist separately. Usually shown as sidebar, advertising, etc.
Example scenario:
When a title has multiple levels,,
Do not misuse Example scenario:
<section><section> tags are used to block content on an article or page, usually consisting of the content of the same topic and its title.
Do not misuse <section> If a piece of content is only visually a whole, semantically not a topic, use div.
Example scenario:
The <article> tag represents a separate, complete, externally referenced content in the page. Typically a forum post, comment, article, news, agreement content, etc., or it can be an interactive widget, or any other independent content item.
A <article> element usually has its own title.
Example scenario:
The <main> tag represents the main content area of the page.
The contents of <main> must be unique to the page, not to be in other pages (like side, navigation and other public content).
There can be only one <main> in a page.
<main> cannot be in <article>, <aside>, Example scenario:
Chrome "Tools--Extensions-->HTML5 outliner--> enabled", when enabled, the icon shown in the upper right corner of Chrome will appear and click.
Local files cannot be viewed with the tools described above and can be glued to the online tool HTML 5 outliner for viewing.
Precautions1, the proposal for each <nav>, <aside>, <article>, <section> added title, on the one hand, for the sake of semantics, on the other hand, if there is no title, H5 outline will show "Untitled XXX ",
Headings that are visually unwanted to display can be hidden through styles.
2, H5 <nav>, <aside>, <article>, <section> elements are independent, will create a new "section", which is a new node in the document outline. In H5, each section can have its own The above nodes can have their own
This is the test results under Chrome, the preliminary guess is that the page resolution can not be found in the independent node <section> (two
3, with the developer tool can be seen, H5 algorithm automatically for <body> and <nav>, <aside>, <article>, <section> elements add ID, and elements < Header>, <footer> and <main> did not, which means that the three elements did not create separate "knots".
4, the default display, the "section" of the more hierarchical, its internal hn size smaller,
Iv. Study Questions1, according to H5 the new rules,2, for the content of relatively high degree of the module, we can use <section> division, such as the "Common label", "Label Introduction", "H5 outline", "study questions" several modules are used <section> package, at the same time, We can also use the original way-the document title with
3, this article discusses so many, then, why should we pinching irritate D to discuss each label how to use, what will be wrong? Why should we follow the H5 outline, and what will be the bad outline? As you know, good structure and outline will make the page semantic, which is very helpful for accessibility (mainly read screen software) and SEO, in addition, there are other more deeper meaning? The label is easy, easy to use, and thoughtful ...
2014.4.2
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
