When I first transitioned into a web team almost seven years ago, I started hearing terms that I knew were important to designers and developers, but didn’t necessarily associate with my content-based role. One of those terms was accessibility.
Making the connection
Before joining the wonderful world of web, I helped organise university events, such as awards ceremonies. Our team would arrange accessible ramps for wheelchair users, British Sign Language (BSL) interpreters for students and delegates who were deaf or hard of hearing, and shift seating plans to accommodate students who had broken legs two days before graduation.
In all these cases, my role involved removing obstacles from getting those people from A to B. Web accessibility – and accessible content – is, in simple terms, no different.
A few years ago I attended the Future of Web Design and heard, then head of accessibility at GDS, Josh Marshall’s particularly informative session (similar to this Hot Source Norwich talk) on accessibility.
It was a bit of a ‘duh’ (ok, maybe ‘lightbulb’) moment and made me realise that accessibility goes beyond disability. Sure, different browsers, devices and screen sizes make a difference, but what about the age of your user, not to mention their PC (remember these old Packard Bells?) These elements will all have an impact on how accessible your content is to your users.
Some things are now so embedded into how I work that I forget they also tick the accessibility box.
Semantic markup of headings
I’ve lost count of the amount of times I’ve shared the parent:child metaphor for headings (and will now be checking and re-checking that I’ve done this justice on this post!)
In brief, headings and subheadings have two main uses (explained far more eloquently in this WebAIM resource on semantic structure):
- They help users to scan content
- (Most importantly) they give your content a clear easy-to-follow structure for screen readers
Download the NVDA screen reader for free and see them in action for yourself. Then test how well your web content is doing with the WAVE web accessibility evaluation tool.
Remember alt text
I remember a particularly memorable conversation with an accessibility enthusiast at UWE, who taught me to understand the importance of alt text on images (cheers Gavin).
When we redesigned the Jisc website back in 2013, we made sure alt text was a mandatory, integral part of the image uploading process. This, together with descriptive image naming, also comes with SEO bonus points – score! Google’s image publishing guidelines are an excellent bookmark.
We’re also encouraging people to give us text explanations for infographics. Pretty as they are, sometimes they convey much more meaning visually than you can fit into alt text. We’re making a start – see the maps on this learning analytics report for example – but there’s still room for improvement.
Write in plain English
Don’t even get me started (actually, I sort of already did in my web writing back to basics post).
I remember being told* the following: the higher your level of education, the more status you have, the more you have to do and so the less time you have to read stuff. It’s a good mantra to write by.
According to Readability Score (recommended by GDS in their social media playbook), any general content should aim for an (American) grade level of around 8. You can use their tool for free to test how well your writing is doing.
Publish all your information on web pages
Without wanting to sound too much like the scary TV licensing man, we’re closing in on pdfs and working towards getting all our guides onto the Jisc website.
Because pdfs are designed for print, this is often at the expense of on-screen readability. As Gerry McGovern said:
“PDFs are not a web format. They are a way of delivering print content using the web as a distribution channel.”
Use descriptive links
Spread the word. ‘Click here’ (50p in the swear jar) is not the way to help people when it comes to web links.
As Anthony T says in his blog for Smashing Magazine: ‘click’ puts too much emphasis on mouse mechanics (what if you’re using your finger, a keyboard, or even a stylus!), while ‘here’ conceals what users are clicking.
This second one in particular is a big no-no; not just for users of screen readers, but for everyone.
Spread the word – decorate your office
A few months ago, Benjamin shared these brilliant Home Office posters on accessibility. They clearly and succinctly lay out the dos and don’ts of accessible design and are an excellent reference for designers, developers and content teams alike – something for everyone.
We’re now displaying them proudly in the Jisc office in Bristol. They’re a great visual reminder never to be lazy when it comes to content design. Plus, they look pretty.
We’re proud to say that we’ve been working pretty closely to their standards for some time, but there’s always work to do. So please do get in touch with your comments and suggestions.
* Christine Cawthorne at Crocstar – I have a feeling I owe this one to you!
3 replies on “Access all areas”
Great article – really giving me food for thought for structuring new website that I’m launching soon. Especially like the posters you linked out to – some colleagues could probably do well to see those!
Thanks Dan – I’m glad you found it useful. Those posters are a lovely visual aid to help persuade colleagues to think a bit harder about their content 🙂
A few months ago, Benjamin shared these brilliant Home Office posters on accessibility.
They clearly and succinctly lay out the dos and don’ts of accessible design and are an excellent reference for designers, developers and content teams alike something for everyone.
We’re now displaying them proudly in the Jisc office in Bristol.
They’re a great visual reminder never to be lazy when it comes to content design. Plus, they look pretty.
We’re proud to say that we’ve been working pretty closely to their standards for some time, but there’s always work to do.
So please do get in touch with your comments and suggestions.