What is the HTML5 Semantic Layout?

Ok, this is a dumb question, but what does "HTML5 provide a semantic layout" mean. What is a semantic layout?

+6
source share
3 answers

This refers to changing how tags are named in HTML markup. Thus, in addition to things like a div , which can mean anything, there are new tags, for example:

  • header
  • article
  • aside
  • nav
  • footer
  • and etc.

Using these tags provides more information about the semantic content of the markup, rather than regarding specifications that are more about style than content (for example, <div class="header"> ).

The idea here is that the content itself tells you what. The obvious benefits are for things like screen readers for visually impaired people who can more effectively present content to the user in a more structured way.

+9
source

Semantic markup shifts focus from presentation to structure. For example, instead of using h tags to increase or decrease text, use h tags to indicate text that serves as headings for paragraphs or sections.

Instead of common divs with identifiers or classes, semantic markup will use tags such as header , footer and nav to clearly identify sections of the document to indicate their purpose.

HTML markup will become purely structural, and presentation information will be transferred to a separate layer, such as CSS.

+2
source

HTML5 site layout

 <!--[if lt IE 9]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script> <![endif]--> </head> <body> <header> </header> <nav><ul> <li></li> </ul> </nav> <section> <article><figure><img src=""/></figure></article></section> <footer>by siva </footer> </body> 
0
source

Source: https://habr.com/ru/post/888640/


All Articles