What is HTML <footer> Tag?
The HTML footer tag is used to define the footer section of a webpage or a section. It usually contains information such as copyright details, contact links, site navigation, or author information. The footer tag helps structure the webpage and makes it easier for users and search engines to understand the bottom section of your site. It appears at the end of a webpage or a content block and improves accessibility and readability. It is one of the semantic HTML5 tags that clearly defines the purpose of its content, helping search engines like Google identify footer information effectively.
Syntax of the HTML <footer> Tag
<footer>
<!-- Footer content goes here --> </footer>
The footer tag begins with the footer tag and ends with the closing footer tag. It can include text, images, links, or other HTML elements like lists or paragraphs.
Examples of HTML <footer> Tag
Example 1: Basic HTML Footer Tag
<!DOCTYPE html>
<html lang="en">
<body>
<footer>
<p>© 2025 Scholar247. All rights reserved.</p>
</footer>
</body>
</html>
In this example, the footer tag simply displays copyright information at the bottom of the page. It helps users identify the website’s ownership details.
Example 2: SEO Optimized Footer Tag
<!DOCTYPE html>
<html lang="en">
<body>
<footer>
<p>© 2025 Scholar247 | Best Educational Resources and Tutorials</p>
<nav>
<a href="https://www.scholar247.com/about">About Us</a> |
<a href="https://www.scholar247.com/contact">Contact</a> |
<a href="https://www.scholar247.com/privacy-policy">Privacy Policy</a>
</nav>
</footer>
</body>
</html>
This example shows an SEO-friendly footer that includes internal navigation links and a brief keyword-rich phrase. Search engines can use this to better understand the site’s structure and topic.
Attributes of the HTML <footer> Tag
The footer tag does not support any specific attributes. However, it can include global HTML attributes such as:
• id – Assigns a unique identifier to the footer section.
• class – Helps apply CSS styling to the footer.
• style – Allows inline styling directly in the tag.
• lang – Specifies the language of the footer content.
These attributes make it easier to style and manage the footer area in web design.
Best Practices for HTML <footer> Tag
• Place the footer tag at the bottom of your HTML document or section.
• Include copyright, important links, and contact information.
• Keep footer content concise and relevant.
• Use internal links for SEO improvement and better site navigation.
• Ensure the footer design is mobile-friendly and visually clear.
• Avoid stuffing unnecessary keywords; maintain natural language.
FAQs About HTML <footer> Tag
What is the purpose of the HTML footer tag?
The footer tag defines the bottom section of a webpage and usually contains copyright notices, navigation links, and contact details.
Can a webpage have more than one footer tag?
Yes, multiple footer tags can be used. For example, one for the entire page and another inside a section or article.
Does the footer tag help with SEO?
Yes, when used properly, the footer helps search engines understand key links and website information, improving site structure for SEO.
What can I include inside the footer tag?
You can include text, hyperlinks, contact forms, images, or navigation menus. It is commonly used to provide site-wide links and author information.
Where should the footer tag be placed?
The footer tag should be placed at the end of a webpage or section, typically right before the closing body tag.