If you’ve heard anything about web accessibility, you’ve probably heard of screen readers – devices that allow blind or vision-disabled people to access websites by listening to a speech synthesizer or, in some cases, via a braille display. There are a number of different screen readers; this recent review of three popular screen readers is interesting – the comments in particular illustrate that “accessibility” is different for different users with different needs, an important thing to keep in mind.
If you’ve never seen a screen reader in use, by the way, there are some good videos out there. I like the one embedded below; using JAWS – one of the more popular screen readers – the narrator goes through the BBC website and shows you how it works. Pay particular attention to how the screen reader handles links and headings, and you’ll understand why we always say that you should use heading tags when your page has sections rather than just making the section title bold and why we always say that your links should be semantically meaningful rather than just saying “click here.”
WebAIM, a great source for web accessibility information in general, has an extensive overview of how screen readers work and how to design for them. One of the most important points they make is that, while sighted users tend to quickly scan the entire screen and focus on what stands out as looking important to them, screen readers present content in a linear fashion. (Another “what it’s like to use a screen reader” video I found mentions that in another context: if a student receives a lengthy email from an instructor, they have to go through the entire email and remember what they have to do or respond to once they’re finished, or even literally take notes on the email as they listen – they can’t just scan the email or easily go back and forth between the email and the response they are composing.)
But I’m not a web designer. Should I care?
What does this mean for those of us who don’t design entire websites, but who do write and publish content on the web? Well, for one thing, a giant block of text is going to be a huge pain for someone using a screen reader. Since they can’t quickly scan to figure out what the most important points are, they are going to have to sit and listen to the entire block of text. It would be much easier for these users to break up your content into smaller portions, using heading tags to separate them.
You’re not breaking it up at random, of course – more than just controlling font size and weight (for sighted readers), heading tags describe how your content is structured. Think of how an outline works – you have section I, and below that sub-sections A, B, C – then section II, and so on. Headings work the same way. H1 is generally your title, then H2, then on down as far as H4 if your content is that complex – then back to another H2, and so on. Or, think about a book with sections and chapters – or even feature story in the newspaper, which may have a headline and multiple sections, each with its own smaller title or headline.
This post, for example, uses heading tags instead of just rambling on and on nonstop. Ta-da!
Great news: Structuring your content using these semantically meaningful, well-organized heading tags also makes it easier for sighted users to scan your page and quickly spot the content they are looking for.
Accessibility benefits everyone.
This is a recurring theme that you find once you start learning about accessibility: many of the measures you take to make your website usable for disabled users are actually usability improvements for most of your users. This is true of accessibility features in the offline world, too – the button that lets someone using a wheelchair open a door is also helpful for a non-disabled (I love the term “temporarily able-bodied“) person whose arms are full of packages.
The thoughtful folks over at GOV.UK (run by the Government Digital Service, the group responsible for designing digital services for the UK government) recently published a great post, “How to create content that works well with screen readers.” They don’t offer a bulleted to-do list, but rather discuss how screen readers work and some of the potential implications for writers of web content. For example, it’s useful to think about how screen readers interpret acronyms. It shouldn’t come as any surprise that this article concludes that writing content that works well for everyone will benefit screen reader users. Proofreading your content to make sure words are spelled correctly and using consistent standards for how you deploy acronyms and abbreviations, for example, will benefit everyone.
Of course, blind and vision-disabled users aren’t the only people with disabilities who use the web. People with color-blindness, deaf or hard-of-hearing people, people with limited fine motor control or who have difficulty using a mouse, and people with cognitive or memory disabilities can all have a better experience on the web if content is thoughtfully designed.
Captioning your videos will make them usable not only by deaf users but also by those who may want to watch your video in a public place but don’t have a pair of headphones handy. Plain language helps dyslexic users, those for whom English is a second language, and people who are in a hurry. And breaking up those intimidatingly huge blocks of text into more manageable chunks helps pretty much everybody. Making your web content accessible isn’t about providing “special” access to a few users – it’s about providing good access to ALL users, including those with disabilities, while remembering that for some users it means the difference between being able to access your content and being told “no, this content is not for you.” (Besides being a violation of the ADA, that’s just plain rude.)
Want to learn more?
If you find yourself intrigued by these issues, WebAIM’s Introduction to Web Accessibility is a great place to start. For IU-specific accessibility information and some great resources to help you create accessible content, visit Accessibility at IU. The UITS Assistive Technology & Accessibility Center, conveniently located in the Wells Library, has tremendous expertise in web accessibility and is available for consultations, trainings, and presentations. And we in DUX are always happy to answer – or find an answer to – any specific questions you might have!
That’s right, we’re back for installment two. Join us monthly for a lively discussion – or follow along on the internet, perhaps? If anyone is interested in asynchronous, remote participation, holler out and let us know; we’ll try to loop you in. This is a friendly book club – we bring snacks, you don’t have to have pored over every word to attend, etc.
Below, the info as it appeared in our staff newsletter yesterday:
Happy new year, and welcome to the second installment of DUX BÜX (ducks boooks). This book club, founded by us in fall 2016, is open to all librarians and staff with the goal of encouraging discussion of UX issues throughout the Libraries.
This semester, we are pleased to be reading Intertwingled: Information Changes Everything by Peter Morville. Why this book? This much-praised title is “a spirited tour of information architecture, user experience, and systems thinking that reveals how everything is connected from code to culture.” Sounds fun to us!
We will shortly have an office copy of this title (inquire within) and one circulating copy within the collection (on-orderas of today, Jan 19). It is available for purchase via Amazon in print format for $15 or via Kindle for $9.99 (remember that you can read Kindle books using the Kindle app on any phone, tablet or laptop [https://www.amazon.com/kindle-dbs/fd/kcp]).
Earlier this week, we released an update for our Serials Solutions E-Journal Portal and IU-Link services. In addition to refreshing and rebranding the interface to reflect updated IU brand standards & the library website design, you’ll notice that both these platforms are now responsive and mobile friendly.
Other improvements include:
Search by DOI/PubMed ID
Journal browse now includes Medical Subjects
Results listings note peer-reviewed and open access titles, include cover images (where available)
The IU-Link citation pages share the newly updated header and footer.
I’ve picked a few from the list to highlight in brief, but I recommend you take a few minutes & have a look at the full article. What’s interesting to me is that although this is a list about design problems, at its most basic level it’s a list of content problems: where is the content, what words do we use for labels, repetitive content, siloed content, circuitious content.
Unexpected Locations for Content
“When the site structure doesn’t match the users’ mental models of how information should be organized, people are unable to locate what they need.”
I think libraries have been having this conversation on and off for some time. Where does it make sense for us to integrate search or design elements that are commonly experienced in the commercial web? If we can’t, or don’t feel we should, how do we build bridges and provide the necessary information and context?
Competing Links and Categories
“When users can’t clearly distinguish between similar navigational categories or links, they struggle to find the right path to content… If multiple sections or pages could address a specific information need, users must explore each or make their best guess.”
This is why Anne & I send so many polite little notes about small tweaks we’ve made to page titles, and why we encourage you to search within our own site as you are creating new content to see what content already exists & to be able to write unique and informational page/news/event titles.
Islands of Information
“Some sites offer small bits of information scattered around the site, with little or no connection between them. When users find one such island of information without links to other related information, they have no reason to think that another area of the site offers supplementary material… Consider why information is scattered throughout the site, consolidate it as appropriate, and pick the best spot for it.”
We’ve made great strides toward this kind of positive consolidation since we migrated to Drupal in 2014 – we migrated approximately 8500 pages and right now we have about 900 basic pages (plus resources, news/exhibits/events items, subject posts, user profile pages, etc). Across all our content types I estimate that we have approximately 2500 ‘objects’ right now, so that means we’ve made good progress toward pruning and updating our site.
“Even if users can determine the right site location for their information needs, they can still be stymied by unexpected or lengthy workflows. Users should get closer to the information goal as they click through pages. Teams sometimes build pages in isolation and do not consider the route to the content they’ve created.”
The example used in the article was of the NYC.gov site: “Users were frustrated when they selected a link labeled Find a Firehouse only to have to select the differently spelled Find a fire house link on the next page.” Oof. Yes, we do this too, and we are ever on the lookout for this sort of thing. And let’s not even talk about how many clicks it can take to finally get to the full text.
That’s it for now, folks! TGIF and all that stuff. Until next time …
Google’s virtual reality efforts are getting a lot of press these days, so what’s all the commotion? For the past two years, Cardboard has been the flagship of Google VR. If you’re new to the world of virtual reality, Google Cardboard is essentially housing made of cardboard that turns your smartphone into a virtual reality viewer. Similar products include Oculus Rift and Samsung’s Gear VR, but they come with a hefty price tag. A Cardboard viewer, on the other hand, will run you about $20 or less; Google even provides the blueprints if you want to create your own from scratch.
If you’re still scratching your head, think back to the good ‘ole View-Master. With Cardboard, you’re also looking at images through a viewer, but the experience is more interactive. Instead of viewing stagnant images, you can watch 360-degree videos that respond to your movements. For instance, in Bjork’s 360-degree music video, you’ll see Bjork standing on a beach in front of you, but you can also look up at the sky, down at the sand, even behind you. Pretty impressive stuff, eh?
Unfortunately, creating a 360-degree video isn’t quite as affordable as viewing one. GoPro has a VR camera rig called Jump that can be yours for the low low price of $15,000. That said, you can create your own 360-degree still images for free with the Google Street View app! In Google terms, these images are called “photo spheres”, or a series of images stitched together to recreate a 360-degree experience. I took one of my office and the process was incredibly simple; the app prompts you to move your phone around as you take photos to capture your whole environment. The final product isn’t 100% seamless, but the price is right and sharing is remarkably easy. If you’re eager to try out Google Cardboard, check out the #360Video YouTube channel. Even without the viewer, this will give you an idea of what we mean when we say virtual reality.
In addition to Cardboard, Google recently announced a new virtual reality viewer platform called Daydream, set for release this November. Daydream is considered an upgrade to the existing Google Cardboard viewer at more than double the price ($80). If you’re curious about VR, Cardboard remains an excellent choice for beginners. Daydream may be the latest model, but it’s unlikely to rival the simplicity, DIY quality, and accessibility of Cardboard.
If you’re interested in emerging technologies and digital creativity, join us on Mondays this semester at the IQ-Wall for Maker Mondays workshops, presented as part of the Scholars’ Commons Workshop Series – yet to be covered are stop-motion animation, internet of things and logo design: