Problem Statement
What information typically goes in a <footer> element?
Explanation
The footer element typically contains author information, copyright notices, related links, contact details, or sitemap links. Like header, footer can be used multiple times on a page. You can have a main page footer and footers within article or section elements. A footer represents information about its parent element. Article footers might contain author bio, publication date, or category tags. Section footers might contain related links or summaries. Page footers usually have copyright, social media links, contact information, or legal links. Using footer improves document structure and helps assistive technologies identify concluding information. It is semantically more meaningful than div class equals footer.
Code Solution
SolutionRead Only
<!-- Page footer -->
<footer>
<p>© 2024 Company Name. All rights reserved.</p>
<nav>
<a href="/privacy">Privacy Policy</a>
<a href="/terms">Terms of Service</a>
<a href="/contact">Contact</a>
</nav>
<div class="social-media">
<a href="#">Facebook</a>
<a href="#">Twitter</a>
</div>
</footer>
<!-- Article footer -->
<article>
<h2>Article Title</h2>
<p>Article content...</p>
<footer>
<p>Written by John Doe</p>
<p>Published: January 15, 2024</p>
<p>Tags: HTML, Web Development</p>
</footer>
</article>
<!-- Section footer -->
<section>
<h2>Product Features</h2>
<p>Features content...</p>
<footer>
<p><a href="/features">View all features</a></p>
</footer>
</section>