HTML and CSS Reference
In-Depth Information
The spec continues, “A footer typically contains information
about its section, such as who wrote it, links to related docu-
ments, copyright data, and the like.”
Our footer holds copyright data, which we're wrapping in a
<small>
element, too.
<small>
has been redefined in HTML5;
previously it was a presentational element, but in HTML5 it has
semantics, representing side comments or small print that “typi-
cally features disclaimers, caveats, legal restrictions, or copy-
rights. Small print is also sometimes used for attribution, or for
satisfying licensing requirements.”
Yo u r s i t e ' s f o o t e r p r o b a b l y h a s m o r e t h a n a c o p y r i g h t n o t i c e .
Yo u m i g h t h a v e l i n k s t o p r i v a c y p o l i c i e s , a c c e s s i b i l i t y i n f o r m a t i o n
(why are you hiding that out of the way?), and other such links.
I'd suggest wrapping these in
<nav>
, despite the spec's advice
(see previous
<nav>
section).
The spec says “Some site designs have what is sometimes
referred to as 'fat footers'—footers that contain a lot of mate-
rial, including images, links to other articles, links to pages for
sending feedback, special offers . . . in some ways, a whole
'front page' in the footer.” It suggests a
<nav>
element, within the
<footer>
, to enclose the information.
When tempted to use a “fat footer,” consider whether such links
actually need
<nav>
at all—navitis can be hard to shake off. Also
ask yourself whether such links are actually part of a
<footer>
at
all: would it be better as an
<aside>
of the whole page, a sibling
of
<footer>
?
<article>
The main content of this blog's home page contains a few blog
posts. We wrap each one up in an
<article>
element.
<article>
is specified thus: “A self-contained composition in a document,
page, application, or site and that is, in principle, independently
distributable or reusable, e.g., in syndication. This could be a
forum post, a magazine or newspaper article, a blog entry, a
user-submitted comment, an interactive widget or gadget, or
any other independent item of content.”
A blog post, a tutorial, a news story, comic strip, or a video with
its transcript all fit perfectly into this definition. Less intuitively,
this definition also works for individual emails in a web-based
