The banner identifies your site as an official website of the United States government and helps visitors understand how to tell that it is official.
When to use the banner component
- To identify as an official government site. Most government sites should use the banner.
When to consider something else
- If you use neither https nor a .gov/.mil domain. The banner text calls out https and .gov/.mil domains as ways to communicate that this is an official government site. Don't use the banner if your site doesn't do those things.
- Any time it would be misleading. The banner should be used to reduce confusion. Avoid using the banner on sites meant only for testing or experiments, or are otherwise not meant to be seen as an official website.
- Show the banner on every site page. Use the gov banner at the top of every page of a site. It can be confusioing or misleading if it appears on some site pages and no others.
- Don't use more than one. Don't use multiple banners at the top of a page to communicate multiple identities, like an agency banner, and a gov banner. Consolidate into a single banner instead.
- Keep the text up-to-date. Use the most current version of the banner. Use the "Here's how you know" text from the most current version and avoid modification.
- Use the proper TLD. If your project uses a .mil top-level domain, change the text in the "Here's how you know" section to "The .mil means it's official."
- Avoid distraction. The banner appears on every page of your site. Choose background colors that fit with your site theme and avoid color combinations that draw excessive attention to the banner.
aria-labelto give the banner a useful name. Our default markup uses
aria-label="official government website"to distinguish the banner
headerfrom the main
- The banner should directly follow the
- Set the width of the banner content area with
- Set the banner font with