Skip Navigation
MarylandToday

Produced by the Office of Strategic Communications

Subscribe Now
Campus & Community

Where Your Wordle Post Went Wrong

Ahead of UMD’s First Digital Accessibility Empathy Lab, Check Out 7 Common Online Barriers—and How to Fix Them

By Annie Krakower

Closeup of a red keyboard key with a white accessibility icon showing a person using a cane

It’s important to consider how a wide spectrum of people experience online content, said Akosua (Kosi) Asabere, accessibility specialist in UMD’s Division of Information Technology. She and colleagues from the Office of Marketing and Communications and the Office of Diversity and Inclusion will discuss that commitment to inclusivity during tomorrow’s Digital Accessibility Empathy Lab.

Photo by iStock

Maybe you solved the day’s Wordle puzzle on your second guess and are dying to share your score. Or maybe you’re preparing a web presentation for your class or posting a video to hype your student club.

Without realizing it, though, you could be cutting people out of the fun, or making it significantly harder for them to get their work done.

Such everyday scenarios highlight the need to consider how a wide spectrum of people see, hear and experience online content, said Akosua (Kosi) Asabere, accessibility specialist in the University of Maryland’s Division of Information Technology.

“It’s really important that people understand what they can do to ensure that the doors are open,” she said. “A lot of people don’t think accessibility applies to them, but if you’re creating an event, sending an email, even sending a meme, writing a blog, creating a course, it all applies to you.”

That commitment to inclusivity will be the focus of tomorrow’s debut Digital Accessibility Empathy Lab, where Asabere and colleagues from the Office of Marketing and Communications and the Office of Diversity and Inclusion will discuss web accessibility awareness, fundamentals and testing, followed by an online scavenger hunt to pinpoint common oversights.

To prepare for the event, browse seven digital barriers and ways to eliminate them:

Provide Different Shades of Meaning

Wordle 361 4/6. Line 1: Nothing. Line 2: 1st perfect, but 2nd in the wrong place. Line 3: 1st and 2nd perfect, but 3rd in the wrong place. Line 4: Won!
(Image via wa11y.co)

Let’s say you end up posting that stellar Wordle score. While the array of squares might be clear to some, for a person with colorblindness, those emojis could be meaningless—“especially with colors like yellow and green, if they’re not distinguishable without any kind of texture,” said Auromita Nagchaudhuri, digital quality assurance specialist in the Office of Marketing and Communications.

Also, screen readers, which convert text to speech, would lump all the boxes together when narrating instead of separating them by line, making the results indecipherable. Using descriptive text in addition to color usually makes content more accessible. So, if you want everyone to know about your puzzling prowess, visit wa11y.co. There, you can paste in your green and yellow Wordle result, and the program will spit out sharable lines of text.

Power Past PDF Problems

Person uses their smartphone to scan a QR code on a package
(Photo by Pexels)

COVID-19 ushered in the widespread use of QR-coded restaurant menus, and while that might spread fewer germs than handling a physical copy, the codes often scan straight to PDFs that aren’t optimized for assistive technology.

To make sure everyone knows what entrees are available—or, for that matter, your organization’s policies, how to assemble a widget or any of the many other things PDFs are used for—use HTML instead. If a PDF is mandatory, refer to Adobe’s guidelines to tag it for accessibility. Bonus: Proper tagging improves search engine optimization.

Open Up Options to Learning

Relying on lectures with no visuals to teach a course or assigning quiz questions about an uncaptioned video could unintentionally isolate learners who absorb information in different ways.

Instructors can avoid this by providing students with multiple pathways to learn, collaborate and demonstrate their knowledge, like by using a combination of text, video, audio and images, and by assigning a variety of test items, presentations or projects. Referring to UMD’s Course Accessibility Checklist or Disabilities, Opportunities, Internetworking, and Technology’s 20 Tips for Teaching an Accessible Online Course are good places to start.

Paint a Picture With Words

Testudo statue in front of McKeldin Library on a January evening
(Photo by John T. Consoli)

Whether you’re throwing it back and sharing a “Success Kid” meme on social media or embedding a photo into a news article you’re publishing, people using screen readers won’t know what you’re posting unless you include the proper description.

All images, including those that display words, need “alt text,” or a short, written description of what’s shown. “Imagine you’re talking to somebody on the phone,” Asabere said. “How would you describe it?”

Context is important; for the above photo of a Testudo statue, for example, your alt text might be as simple as “Testudo statue at sunset in January.” But if you’re including the image as part of a gallery of all the Testudos on campus, “Testudo statue in front of McKeldin Library on a January evening” would be better. And if there’s text in the image, be sure to transcribe all of it.

Before clicking “publish,” fill in the alt text features on your social media platform or content management system, which will also boost search engine optimization.

Go Beyond ‘Click Here’

We’ve all gotten emails or read online articles that direct us to “click here” for more information. But that lack of context can create confusion and frustration for those using screen readers, which are able to compile a list of all the linked text on a page.

“If you’re saying, ‘click here,’ ‘click here,’ ‘click here,’ the screen reader is not able to know where that link is going to take them, the meaning of that link, the content,” Asabere said. “It is like a guessing game.”

A little more info is all that’s needed. Wording like “Read UMD’s latest quantum news” or “Learn about the IDEA Factory” is much clearer.

Create Captioned Content

Screengrab from UMD's commencement video with caption reading: "[Jeff] Congratulations to the class of 2021 and 2022!"

No matter how action-packed your latest video is or how much reporting went into your new podcast episode, the d/Deaf or hard-of-hearing community won’t be able to consume or appreciate your content without a text alternative.

The simple solution: Platforms like YouTube and Spotify auto-generate captions and transcripts. To ensure accuracy, it’s best to check the wording and manually edit any mistakes.

Beware of ‘Pseudo-headings’

Simply bolding or increasing the size of text might seem like an easy way to indicate subheads in an article or blog post. But relying on those “pseudo-headings” instead of using your content management system’s built-in feature to create headings can cause problems for screen readers.

“Someone who can see can see, for example, can scan a page and see what’s important, what stands out,” Asabere said. “But in order for someone who’s using a screen reader to do the same thing, it needs to be semantically marked up as a heading.”

Whenever possible, then, use the available page layouts and styles within platforms like Microsoft Office, Adobe and Canvas.

Maryland Today is produced by the Office of Strategic Communications for the University of Maryland community weekdays during the academic year, except for university holidays.