Our website theme was originally developed in 2017, and then only slightly revised in 2021 for the website rebuild. It had great bones but we hadn't done a proper look at every little part of it for a long time.
So, in collaboration across IT & Digital, the graphic design team, and the incredible work of our external web designer, Harry Vann, we've looked at a lot of key elements to tidy up, improve, remove - a general zhuzh up.
We've also managed to resolve most of the pending issues on our Digital Accessibility Statement.
- Review your pages and flag if anything's not looking right - we can help either fix the issue or bring the page into the new world.
- Don't fight the theme - avoid adding horizontal rules or spacing to your pages; we've carefully set the padding between elements so generally it's intended to look that way, but if it's awkward-looking let us know and we can fix it
- Think about accessibility - use a clear heading structure on your page, provide meaningful alt tags on your images, and consider colour combinations carefully.
The toolbar is now at the top of the page, not down the left hand side, improving visual flow - and to avoid crowding, if there's a lot of options, click 'More' for more actions. Friendly icons have joined us on our journey.
Screenshot
Banner headings no longer obscure banner images:
Screenshot
Buttons are now more button-y, with a satisfying click animation:
Cards have been tidied up and simplified for a cleaner, less overwhelming look:
Navigation tiles ("link tiles") now come in image and non-image varieties, to avoid unnecessarily clunky navigation when there is no good reason for images to be used. They also come in three delightful pastels - purple (125 Plum), yellow (Bentham's Teeth) and grey (affectionately, eff-two-eff-two-eff-two).
So e.g. navigation tiles without images:
And with images:
Colour theming has softened our link style and brought in the pastel shades of our brand for slightly less blinding white
Like this!
Search has been improved both visually and behind the scenes, loading directly on the page with categorised results! Make sure to read about how our website search works to improve results in your area.
Screenshot
Duotone (colour treatments) have been removed everywhere, so we can enjoy the high quality photography
Screenshot before after
Padding and headings have been revised (so you can resist the urge to use horizontal rules...!)
Screenshot before after
Accordions are easier to read and nicer to look at:
- Teal heading
No grey background!
- Another heading
Also no grey background.
The sidebar is more visually distinct:
Screenshot
Table of contents is now a table at the top of the page rather than a stressful toolbar thing:
Screenshot
In this section is now similar to the table of contents, rather than a sad grey box:
Screenshot
We now have a "Jump to top" button in the bottom right for long pages:
Screenshot
At least a hundred other small things, like a Mully's at Midnight footer,