footer элемент представляет подвал для ближайшего предка секционирования содержания или корневого элемента. Колонтитул обычно содержит информацию о разделе, например, кто написал его, ссылки на соответствующие документы, авторские данные, и тому подобное. Когда тег footer содержит целые разделы, они представляют собой приложения, индексы, длинные концовки, соглашения подробную лицензию, и другое подобное содержание.
Note: Контактную информацию автора или редактора раздела помещают в тег address, возможно, сам footer.
Нижние колонтитулы не обязательно должны появиться в конце раздела, хотя так обычно делают. Когда ближайший предок секционирования содержания или корневой элемент тег body, то это распространяется на всю страницу.
Note: footer элемент не вводит новый раздел.
Вот страница с двумя нижними колонтитулами, один вверху и один внизу, с тем же содержанием:
<body> <footer><a href="../">Back to index...</a></footer> <hgroup> <h1>Lorem ipsum</h1> <h2>The ipsum of all lorems</h2> </hgroup> <p>A dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> <footer><a href="../">Back to index...</a></footer> </body>
Вот пример, который показывает как footer используется для веб-узла в целом и для статьи отдельно.
<!DOCTYPE HTML> <HTML><HEAD> <TITLE>The Ramblings of a Scientist</TITLE> <BODY> <H1>The Ramblings of a Scientist</H1> <ARTICLE> <H1>Episode 15</H1> <VIDEO SRC="/fm/015.ogv" CONTROLS PRELOAD> <P><A HREF="/fm/015.ogv">Download video</A>.</P> </VIDEO> <FOOTER> <!-- footer for article --> <P>Published <TIME DATETIME="2009-10-21T18:26-07:00">on 2009/10/21 at 6:26pm</TIME></P> </FOOTER> </ARTICLE> <ARTICLE> <H1>My Favorite Trains</H1> <P>I love my trains. My favorite train of all time is a K?f.</P> <P>It is fun to see them pull some coal cars because they look so dwarfed in comparison.</P> <FOOTER> <!-- footer for article --> <P>Published <TIME DATETIME="2009-09-15T14:54-07:00">on 2009/09/15 at 2:54pm</TIME></P> </FOOTER> </ARTICLE> <FOOTER> <!-- site wide footer --> <NAV> <P><A HREF="/credits.html">Credits</A> — <A HREF="/tos.html">Terms of Service</A> — <A HREF="/index.html">Blog Index</A></P> </NAV> <P>Copyright © 2009 Gordon Freeman</P> </FOOTER> </BODY> </HTML>
Некоторые дизайны сайтов включают то, что иногда называют «жирные нижние колонтитулы» — подвалы, которые содержат большое количество материалов, включая изображения, ссылки на другие статьи, ссылки на страницы для отправки обратной связи, специальные предложения… В некотором роде исполняя роль «главной страницы» в подвале.
В этом фрагменте показан низ страницы на сайте с «жирным подвалом»:
... <footer> <nav> <section> <h1>Articles</h1> <p><img src="images/somersaults.jpeg" alt=""> Go to the gym with our somersaults class! Our teacher Jim takes you through the paces in this two-part article. <a href="articles/somersaults/1">Part 1</a> · <a href="articles/somersaults/1">Part 2</a></p> <p><img src="images/kindplus.jpeg"> Tired of walking on the edge of a clif<!-- sic -->? Our guest writer Lara shows you how to bumble your way through the bars. <a href="articles/kindplus/1">Read more...</a></p> <p><img src="images/crisps.jpeg"> The chips are down, now all that's left is a potato. What can you do with it? <a href="articles/crisps/1">Read more...</a></p> </section> <ul> <li> <a href="/about">About us...</a> <li> <a href="/feedback">Send feedback!</a> <li> <a href="/sitemap">Sitemap</a> </ul> </nav> <p><small>Copyright © 2015 The Snacker — <a href="/tos">Terms of Service</a></small></p> </footer> </body>