Skip to content

Instantly share code, notes, and snippets.

@MWins
Last active January 25, 2017 02:23
Show Gist options
  • Select an option

  • Save MWins/b360dd1ff41c6a090781 to your computer and use it in GitHub Desktop.

Select an option

Save MWins/b360dd1ff41c6a090781 to your computer and use it in GitHub Desktop.
HTML5-Page-Structure

Sectioning for HTML5 but it isn't implemented by browsers. The other option would be semantic HTML. But again, it isn't going to provide hard and fast rules for the entire document, it's more about how to tag specific sections.

With HTML5, the method is to use defined tags for each individual part of the page. An ARTICLE tag for the main content or focus of the page. Items which are tangential relevant to the ARTICLE either go into an ASIDE or a FIGURE. Otherwise use a DIV. SECTION should be mentioned but it's vague how they are to be used (see article below).

<HTML>
<body>
<header><h1> Site Name</h1></header>
<nav><a href="">About</a></nav>
<div>Ads go here</div>
<article><header><h1>Article Name</h1></header>
<p>Article text</p>
<aside>Some tangential fact</aside>
<p>More Text</p> </article>
<footer>Copyright</footer>
</body>

MDN-HTML5 Sections & Outlines

HTML5Doctor - Talk about Semantics

HTML5 Sections - Usage

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment