govuk-design-system
govuk-design-system copied to clipboard
Add guidance on illustration and photography style to the images page
For July 2022 firebreak.
What
Add guidance on illustration and photography style to the Images page.
Tentatively this would include (please add and edit @christopherthomasdesign):
- what makes a good image in a service
- best file format based on content
- accessibility considerations
Why
Currently, the images page offers nearly no guidance on how to create or choose images to for use in services. With other edits, it's a bit of a gap.
Who needs to work on this
Interaction designer, content designer, accessibility specialist
Who needs to review this
Wider team review, (anyone else?)
Done when
- [x] Gather advice we want to add
- [x] Investigate and decide on best practice
- [x] Draft guidance
- [ ] Source examples, if needed
- [x] Raise PR
- [ ] Team review and approval
- [ ] Publish
Prior and concurrent work:
The work in progress for image alt text guidance includes a small bit of info on file formats:
Avoid images that contain text Use written content instead of an image that contains text, wherever possible.
If you need to use an image that contains text, create it as a vector graphic (SVG) so that it remains readable when the user zooms in. Text can become pixellated or unreadable when zooming into images, especially PNGs and JPGs.
Any important text you display in an image should be included in the written content — or in alt text if this not possible.
It's unknown when this PR will be ready to merge, so a version of this guidance could be moved into a PR for this issue to publish.
@davidc-gds has also suggested we could adapt useful image information from ontario.ca's Design System.
Thanks for writing this up @calvin-lau-sig7 – I've actually done a load of work on this that I haven't had a chance to share with the team yet.
Will find time for us to catch up soon!
We're merging the PR for this with #1988, as the content is being consolidated together as a single update (see 'headings sort' in this doc)
Moving forward, PR for both issues will be #2059
@calvin-lau-sig7 can this issue be closed as it's been moved to done?
I reckon so @kellylee-gds !