What’s Alt Text?

Hey students! Hope ya had a good Thanksgiving, this week we’re gonna come back from break with a light, easy topic: Alt Text.
So, first off,

What is alt text?

In this context, alt text is a little bit of text attached to an image. If used correctly, it will describe, in brief, what the image is.

Why is it important?

For people who have vision impairments, they need to use a screen reader in order to access the internet. This is a software, that, well, goes through a web page and reads it off to them. Sounds simple, but think of how complicated some documents can be: you can have figures, animations, pictures. For a lot of web-pages, these are just decorative and can be ignored. However many documents might have an image that it’s at least useful to understand is there in order to properly understand the text. Alt text is therefore a brief description of the image in question that a screen reader can pick up, explaining to the user what the image is.

How do I edit it?

Well, that very much depends on the platform you’re using. For the sake of this post, we’ll only go over Microsoft Office Products, Adobe Acrobat, and This Website.

Microsoft Office Products

The Good News:
It’s very easy to access and edit alt text with Microsoft Word. All you need to do is right-click on the image, and click on “View Alt Text” on the drop-down menu.

An image of a Microsoft Word document

From there, you’ll get this sidebar menu:

A screenshot of the alt text editing toolbar

You can edit the alt text in that little box. Apparently Microsoft Word will also be able to auto-generate alt text for you in some cases, though this was not one of them. (And it is the unofficial stance of the Help Desk that you should not rely on AI to write for you!)

The Better News:
PowerPoint is the same! Exact same UI and everything. This was expected, but it was worth double-checking and noting it here.

Adobe Acrobat

PDFs are notoriously difficult to work with regarding accessibility. Luckily, Adobe Acrobat has a whole suite of tools that you can access using the Toolbar on the left.

A screenshot of the Adobe Acrobat toolbar

(Unfortunately, the red box is supplied by the Help Desk, you’ll need to bring your own)

From there, you’ll want to click on “Add alternate text” (simple enough, to be honest).

A screenshot of the Accessibility toolbar

Now, from here it might get a little intense. It will ask your permission to scan the document and detect all figures to display their alternative text. From there, you’ll move through the figures one-by-one to view their alt text and edit it to your liking. It certainly can take a long time, which is why it’s probably good to make sure you have all your alt text sorted when you’re working in Microsoft before formatting it to a PDF.

This Website

Now, I know it probably seems kind of pointless to go over how to edit alt text on a website that most of you will probably never use. So why would we do this? Well, this website is actually a great case study in a platform that has no in-built tool to edit alt text (something I learned the hard way when making our last post). To edit it, we would actually need to edit is as an HTML file. Yes, that means Coding!

So, if you click on an image here, you can access its HTML by clicking on the three dots on the far-right of a toolbar that appears, like so:

A screenshot showing this website's image-editing toolbar

From here, you’ll be given a dropdown that lets you select “Edit as HTML”. Once you do so, it will replace the image with this line of code:

See where alt is highlighted? Well from there, you can just type your alt text within those quotation marks! Easy as that!
Now, different platforms may have different means of accessing a photo’s HTML code, but once there it should all be more or less the same. That leaves only one last question I feel should be answered…

What Makes Good Alt Text?

What makes good alt text is, it turns out, complicated. I fully wanted to do a how-to within the scope of this article, but a proper overview on good alt text would be an article of its own. So I’m going to outsource it to this website. It’s a good read, and not particularly long, but it is about as long as what I have already written and in all honesty I expect all my readers are at least as busy as I am.

Till next time!

Accessibility Checkers

Hey folks! Long time no post! We’ve been really busy at the Help Desk with doing accessibility checks these last few weeks in preparation for changes to ADA Title II. What is ADA Title II, you may ask? Well, here is a quick run-down of ADA Title II changes if you want more details, but in short: The University has to make all of digital materials accessible to disabled persons. In a web format, much of this takes the form of making sure that everything is formatted properly so a screen reader can intelligibly read it to a user.

There are a lot of things to consider, and while they’re pretty intuitive once you understand how a screen reader works, it’s a bit out of the scope of this blog post to go over all of the details, what we will do today is show you how to use accessibility checkers!

What is an Accessibility Checker?

It’s a program included in an application that runs a quick AI-driven check for accessibility concerns. They are easy to find and easier to use, but it should be noted that like everything automated, a human should double-check manually. Certain things just can’t be picked up by a machine. For example: Alt Text! (to be explained later)

How do I use it?

We’ll only go over accessibility checks for Microsoft products today. There are programs in Adobe Acrobat Reader for PDFs, but PDFs are a nightmare to check anyways, so we’re just not going to worry about that now.

Where do I find it?
The Microsoft Toolbar where you can find an Accessibility Check

So, for both PowerPoint and Word the Accessibility Check can be found under Review. Pretty straightforward, all things considered. Once you click on it, you’ll have an Accessibility Check bar show up on the righthand side of your screen. It will show you what accessibility concerns it’s found and, perhaps best of all, will give you a brief description of just why it’s a problem! You can keep it running while you work and dismiss the sidebar at any time to check later. It’s a great tool to not only check accessibility in general, but also to educate yourself about it!

That’s all for this week. Accessibility is a huge task that’s quickly become the theme of our semester here, so expect more of these posts as a sort of series in the near future!

Tech Tip: Accessible Web Media

Are you interested in social media outreach? Then you might want to make sure your content is accessible to as many people as possible. We’re going to discuss a few ways you can do this.

WCAG: The Web Content Accessibility Guidelines can be found here, WCAG 2 Overview. This is the current standard we at the Help Desk use when writing up our own social media content and it’s one we recommend.

Social Media Accessibility: How do I make my social media content more accessible

Hyperlinks

If you want to link to something on Facebook, you have to past the full link, at which point a clickable image link will appear. Make sure there are no other forms of media on the post (i.e., graphics, polls, etc.), delete the actual link you pasted in, and make sure that the clickable image link at the bottom is still there (it should be). Now you’re ready to post. Unfortunately, Facebook does not support simplified hyperlinks (trust us, we’ve tried).

Twitter behaves similarly, but instead of deleting the initial link, you just leave the link there in its entirety and Twitter will automatically remove it upon posting while maintaining the blip. And just like Facebook, be sure to clear out any other non-text media attached to the post to ensure the clickable image link remains. Also, if your link is not accessible to viewers, a clickable image link will not appear. Is this the least obvious way to do it? Yes.

Alt Text and Captions

If you can, you’ll want to add alt text or captions to graphics. This can be difficult depending on the format of your social media platform.

For example, Facebook/Meta only allows for alt text and captions when using the Meta Business Planner. Instagram only allows for alt text and captions if you own a professional account.

Twitter posts are easy enough to add alt text to to a graphic just by selecting the “edit” option on a post’s image and then selecting “alt” above said image and entering the text you think best summarizes the image.

TL;DR

Check out the WCAG guidelines linked above for some handy tips and tricks to making your content more accessible. It can be difficult navigating the UI of some social media accounts, so be sure to poke around and do some research.

Tech Tip of the Week: Add Another Language to Video Captions

Video captions in Illinois Media Space are added in English but there may be times that you wish to add captions in another language, too. You can do this by downloading the captions file from Media Space and then paste them into Word or a similar text file to translate. Once you are done translating the captions into the desired language, go back to the video page in Media Space and click “edit” under the “Actions” heading. Click on “captions” and then select “Upload captions file.” You’ll be able to select the language of the translated captions to be added to the video. After you save the captions to the video file, users will be able to select the language of the captions when they view the video.

Tech Tip of the Week: Accessible Links

Whenever you need to include a link in an email or on a webpage, make sure you follow accessibility guidelines to ensure easy access for all. Creating accessible links helps those using screen readers determine exactly what information they will find by choosing a link. When links do not have meaningful associated text, those using screen readers might be unsure of where a link leads. The following tips avoid this issue. 

  • Embedded hyperlinks should be included within meaningful text. Avoid wording such as “learn more” or “click here.” 
  • Do not display the URL as the hyperlink. 
  • If directing someone to email for more information write, “Questions about [topic] can be directed to [written out email address]” and attach link to the written out email address. 

For more accessibility tips, check out the accessibility training on the iSchool Technology Training page located on Canvas.

Tech Tip of the Week: Learning Resources from CITL   

Here at the University of Illinois we have an amazing resource with the Center for Innovation in Teaching and Learning (CITL), and they provide resources for both instructors and students.  In their own words: “The Center for Innovation in Teaching & Learning is a hub of innovation and hands-on support for those who want to discuss and work with higher education trends, models, projects, and resources. CITL uses leading pedagogical approaches, research-based methodologies, innovative instructional technologies, and comprehensive assessment practices to strengthen teaching efforts and improve student learning outcomes.”  Today’s Tech Tip will break down some of the resources CITL provides for both online and in-person instruction and learning.
    1. To learn more about CITL:
3. Instructor Resources
4. Visit the CITL Innovative Space!
      • The studio is a 25-seat interactive visualization, makerspace, and VR classroom all in one. We have a video wall for visualizations, 10 VR/video editing/gaming workstations, and an array of emerging technologies, including virtual reality, laser cutting, 3D printing, 3D modeling, mixed reality, and much more. Check it out here!

Tech Tip of the Week: Zoom Live Transcriptions

It is now possible to activate a live, computer-generated transcript in your Zoom meetings. There will be a Live Transcript button in your Zoom meeting controls for any meeting that you are hosting where you will be able to start the auto-transcription.

This will create computer-generated subtitles during the meeting as well as a transcript that you will be able to download after the meeting.

Further details about this feature are available via UofI Tech Services here: Zoom Live Transcription explanation.

Important!
You should not assume that this will meet the requirements for a captioning accommodation. Contact DRES in case of a letter of accommodation to assure you are meeting requirements.

Tech Tip of the Week: Online Learning Resources from CITL

With most classes being entirely online, the Center for Innovation in Teaching and Learning (CITL) is an extremely valuable resource. Below, we are going to highlight some of the most prevalent resources and information CITL offers for this unique academic year.

Student Resources

Student resources

Instructor Resources

Instructor Resources for transitioning to online Instruction

To help you develop an online class, CITL offers ‘Online Course in a Box’

CITL also has information for instructors specifically about using Zoom, including potential uses and best practices

While not created by CITL, they do recommend this article on the basics of online teaching

CITL also recommends the Tukam if you are interested in hand-writing notes during lectures, as opposed to using slides. You can learn more about Tukam here.