<footer>

<footer> Tag

The HTML <footer> tag defines the footer section of a webpage or a specific section. It typically contains copyright information, contact details, and important links. This tag helps in structuring content, improving accessibility, and maintaining a clear HTML layout.

Syntax

<footer>
  <!-- Footer content goes here -->
</footer>

<footer> Demo

<article>
  <p>Description and information of the page go here.</p>
</article>
<footer>
  Footer of Page - Copyright
</footer>

Purpose and Usage

The <footer> tag designates the footer of a webpage or a specific section within it.

A <footer> element typically includes:

• Author information
• Copyright details
• Contact details
• Links to a sitemap
• Navigation links (e.g., "Back to Top")
• References to related documents

Accessibility

Before Safari 13, VoiceOver did not correctly expose the contentinfo landmark role. To ensure compatibility with older Safari versions, add role="contentinfo" to the <footer> element.

Default CSS Settings

Most web browsers apply the following default styles to the <footer> element:

footer {
  display: block;
}

Conclusion

The <footer> tag is used to define the footer section of a webpage or a specific section. It commonly contains copyright information, contact details, and links. This element helps in structuring content clearly and improving accessibility. While multiple <footer> elements can exist in a document, it's important to use them to provide consistent footer information across sections. Styling can be applied to enhance the visual presentation.