Third-party suppliers

This guide is designed to help our partners integrate their products with our website while maintaining consistent branding and adhering to our accessibility standards.

Ensuring that third-party products align with our design and usability guidelines is crucial for providing a consistent and inclusive user experience for our users.

By following this checklist, it will help your product look cohesive with our website and meet the level of accessibility and usability we aim to achieve.

The header for third-party applications is a simplified version of the main website header.

More information can be found on the third-party header page.

The footer for third-party applications is a simplified version of the main website footer.

More information can be found on the third-party footer page.

Colours used on Gateshead Council's website

The colours we used throughout the website can be found on the colours page.

Colour contrast

We test all our colour contrast ratios on the website to make sure they meet accessibility guidelines.

More information can be found in our colour contrast guidelines.

Gateshead Council logo

As a minimum the website should meet the following accessibility standards.

WCAG 2.1 compliance:

Adhere to at least Level AA standards.

Keyboard navigation:

All interactive elements must be accessible via keyboard.

Text alternatives:

Provide alt text for all images.

Contrast ratios:

Text and background contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text.

Resizable text:

Ensure text can be resized up to 200% without loss of content or functionality.

ARIA landmarks:

Use ARIA landmarks to help screen reader users navigate your content.

These are some of  the tools we use to check accessibility:

Browser based checking

• Axe browsers extensions (opens new window)
• WAVE browser extensions (opens new window)
• Lighthouse - integrated with Chrome Dev Tools

Colour contrasts

• WebAIM Color Contrast Checker (opens new window)

External accessibility checking

• Siteimprove (opens new window)

Browser display checking

• BrowserStack (opens new window)

Further information on the styles used on the Gateshead Council website can be found in the styles section.

Further information on the components used on the Gateshead Council website can be found in the components section.

Further information on the patterns used on the Gateshead Council website can be found in the patterns section.