Elementele header, footer și address
Header
Elementul header este ca un element introductiv, precedând conținutul principal. Aici pot fi titluri, elemente de navigație sau alte elemente auxiliare, de exemplu, logo, formular de căutare etc. De exemplu:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Semantica în HTML5</title>
</head>
<body>
<header>
<h1>Magazin online de telefoane</h1>
<nav>
<ul>
<li><a href="/apple">Apple</a>
<li><a href="/microsoft">Microsoft</a>
<li><a href="/samsung">Samsung</a>
</ul>
</nav>
</header>
<div>
Informații despre noutățile lumii mobile....
</div>
</body>
</html>Elementul header nu poate fi plasat în elemente precum address, footer sau un alt header.
Footer
Elementul footer conține de obicei informații despre autorul conținutului de pe pagina web, dreptul de autor, data publicării, un bloc de link-uri către resurse similare etc. De obicei, aceste informații sunt plasate la sfârșitul paginii web sau al conținutului principal, dar footerul nu are o poziție fixă și poate fi utilizat în diferite locuri ale paginii web.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Semantica în HTML5</title>
</head>
<body>
<h1>Xiaomi Mi 5</h1>
<div>
Xiaomi Mi 5 este echipat cu un procesor octa-core Qualcomm Snapdragon 820.
Dimensiunea memoriei interne - 32 și 64 MB.
</div>
<footer>
<p><a href="/license">Acord de licență</a><br/>
Copyright (c) 2016. FDC.com</p>
</footer>
</body>
</html>Aici este definit un footer pentru întreaga pagină web. Acesta conține un link către acordul de licență al serviciului și informații despre dreptul de autor.
Footerul nu trebuie neapărat să fie definit pentru întreaga pagină. Acesta poate fi și o secțiune separată de conținut:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Semantica în HTML5</title>
</head>
<body>
<section>
<h1>Ultimele articole</h1>
<article>
<h2>Anunț Samsung Galaxy S7</h2>
<p>Lansarea noului flagship Samsung Galaxy S7.....</p>
<footer>
Data publicării: <time datetime="2016-03-16T15:16-00:00">16.03.2016 15:16</TIME>
</footer>
</article>
<article>
<h2>Reduceri la Microsoft Lumia 950</h2>
<p>De la 1 martie, smartphone-ul Microsoft Lumia 950 este cu 10.000 de ruble mai ieftin</p>
<footer>
Data publicării: <time datetime="2016-03-01T14:36-00:00">01.03.2016 14:36</TIME>
</footer>
</article>
</section>
</body>
</html>Elementul footer nu ar trebui să fie plasat în elemente precum address, header sau alt footer.
Address
<footer>
<address>
Informații de contact <a href="mailto:js@example.com">Tom Smith</a>.
</address>
<p>(c) copyright 2016 Example Corp.</p>
</footer>