Official banner
A thin dark blue bar confirming this is a genuine government website.
On this page
Preview
import { OfficialBanner } from '@govtech-bb/react';
<OfficialBanner
imageSrc="/assets/images/govbb-crest.svg"
imageAlt=""
showLearnMore
learnMoreHref="/government/website-information/"
/>;<div class="govbb-official-banner" style="width: 100%">
<div class="govbb-width-container govbb-official-banner__inner">
<div class="govbb-official-banner__crest">
<img
class="govbb-official-banner__icon"
src="/assets/images/govbb-crest.svg"
alt=""
/>
</div>
<div class="govbb-official-banner__text">
<span>Official government website</span>
<a
class="govbb-official-banner__link"
href="/government/website-information/"
>
Learn more
</a>
</div>
</div>
</div>The official banner is a thin dark blue bar at the very top of the page,
above the header. It shows the coat of arms and a short
message confirming that users are on a genuine Government of Barbados website,
with an optional link to more detail. The crest image is decorative, so keep
alt="". It ships in the @govtech-bb/frontend package under
assets/images/.
Usage
When to use
- Use the official banner at the very top of a Government of Barbados website or service.
- Use it to help people recognise the site as an official government destination.
When not to use
- Do not use the banner on a site that is not an official Government of Barbados service.
- Do not use it for alerts, service updates or page-level messages.
Best practices
Use the standard message and position
Keep the banner above the header and use the approved wording without adding campaign copy, navigation or service-specific messages.
Support trust without making unsupported claims
Link any expanded explanation to useful information about the government domain and secure connection. The banner should identify the site; it should not promise that a particular transaction or third-party destination is safe.