Customise focus styles, do not delete them.
What good looks like
- 2px+ contrast ring that survives on images and dark headers.
- Consistent across components—buttons, links, form fields.
- :focus-visible patterns to reduce mouse-user noise while preserving keyboard cues.
Brand cohesion
Use brand colours that still meet contrast against adjacent backgrounds—designers can own this with tokens.
Testing
Check focus in high-contrast modes and zoomed layouts where outlines clip.
Frequently asked questions
Can we show focus only on keyboard?
Often yes via :focus-visible—verify across browsers you support.
Do carousels need special focus?
Yes—pausing, announcing slide changes accessibly, and not trapping users.
Putting this into practice on your NZ website
This guide sits in our Accessibility & inclusive UX collection. The goal is practical advice you can act on without a computer science degree. Start with one change, measure whether enquiries or usability improve, then tackle the next item. Small businesses across Auckland, Wellington, Hamilton, Christchurch, and regional New Zealand face the same constraints: limited time, real customers, and a website that must earn its keep.
For Focus indicators: why invisible outlines hurt real users, the highest-leverage move is usually to align your live site with what the guide recommends, then fix anything that blocks Google from crawling pages or stops visitors from contacting you. If your site runs on WordPress, many of these tasks are configuration and content work rather than custom development.
Document your starting point: note current enquiry volume, average page speed from PageSpeed Insights, and any errors showing in Google Search Console. Without a baseline, improvements are guesswork. Revisit the same metrics after 90 days—SEO and UX changes rarely produce overnight miracles, but sustained progress should be visible in leads and user behaviour.
Share this guide with whoever maintains your site—an employee, a contractor, or your hosting support desk—so terminology and priorities align. The FAQ section on our main site answers common project questions if you are weighing a rebuild versus incremental fixes.
When to involve a web partner
Some tasks—migrations, checkout changes, security incidents, or a full redesign—benefit from experienced help. If you are comparing providers, look for clear scoping, realistic timelines, and measurement tied to business outcomes rather than vanity metrics. Our team builds and maintains business websites nationwide; explore relevant services below or request a quote when you are ready.
A good partner will ask about your customers, geography, and capacity to publish content—not only colour preferences. Review our recent website projects for examples of brochure, WordPress, and ecommerce work across New Zealand.
Related NZDH services
More guides in this topic
- Keyboard navigation checks every SME site should pass
- Form labels, errors, and screen reader basics (starter level)
- Colour contrast for text and icons: practical tips
- Image alt text that helps people (not keyword spam)
- Heading hierarchy that matches the real page outline
Browse the full Accessibility & inclusive UX guide hub or return to the guides home.
Explore on NZDH.co.nz
- All practical guides
- Website design services
- SEO services
- Recent website projects
- Frequently asked questions
Authoritative further reading
These independent resources complement this guide. Search engines and customers both reward accurate, helpful information—we link out where official documentation or regulators explain the topic better than a generic blog post could.