Navigation
Footer
Footer provides access to secondary navigation, organizational information, legal links, contact details, and related resources. It serves as the concluding navigation area of a website.
Examples
AccessibilityWCAG 2.1 Level AA Compliant
Features6 checks
- Landmark role="contentinfo" on the <footer> element
- Navigation regions within link columns use <nav> with aria-label
- External links include visually hidden "(opens in new tab)" text
- New badge conveys meaning through text, not colour alone
- Social icon links have aria-label attributes naming each platform
- Minimum 4.5:1 contrast ratio met across all three colour themes
When to use this component
✓Do's
- •You need a consistent place for legal, policy, and accessibility statement links
- •Secondary navigation and departmental information belong at the end of every page
- •Contact details, grievance channels, and helpline numbers must be reachable site-wide
- •You need to surface last-updated dates, copyright, and ownership for a government service
✗Don'ts
- •The link is part of the main task flow, keep it in the page body where users will act on it
- •Content is time-critical or needs immediate attention, use System Alert instead
- •You are collecting it as a dumping ground for links no other page wanted
- •A single page needs bespoke navigation, the footer is shared and should stay consistent
Do's and Don'ts
✓ Do's
© 2026 - Copyright UX4G. All rights reserved. Powered by NeGD | MeitY Government of India®2026 UX4G
Always include the bottom strip with copyright notice and legal links. This is a mandatory element regardless of footer type.
✗ Don'ts
Footer used for primary navigation
HomeApplyTrackHelp
Don't use the Footer for primary page navigation, use a Navbar instead. Footer links should be secondary, supplementary content.