Digital Accessibility Guide
About this guide
Use this guide to make make images, text, audio, video, and tables in your course more accessible, and to improve course readability and usability through good organization and navigation principles. You might use this in conjunction with DELTA’s Online Course Usability and Accessibility Checklist, which can help you identify which areas you need to work on first.
Making digital course content more “accessible” means removing barriers to content, interaction, communication and full engagement presented by any sort of disability. In this guide, we approach accessibility from a Universal Design for Learning (UDL) perspective. UDL tells us that when we offer one and only one way to access or engage with course material, we are likely excluding some members of our broad student community. Thus, for the purposes of this guides, we broadly define accessibility as including
- Accessibility – Enabling full access for people with disabilities
- Usability – Providing an effective, efficient learner experience
- Inclusion – Designing for variability and diversity in all its forms
Principles for making your course accessible can be remembered using the acronym POUR. Your course and its content should be fully:
- P = Perceivable
- O = Operable
- U = Understandable
- R = Robust
Most of this guide pertains to perceivability, operability, and understandability. When you consider whether your course is robust, you are ensuring that content and tools are compatible across platforms and assistive devices. You also make sure to include a link to the accessibility information for each tool in your syllabus, perhaps linking to this list of the accessibility information for all enterprise technologies at NC State. It is important to learn about the accessibility limitations of any tools that you are using. You can check with the Office of Information Technology or learntech@ncsu.edu for help.
Sections of this guide
- Available accessibility checkers
- Accessible images
- Accessible text
- Accessible audio and video
- Accessible tables
- Accessible organization and navigation
Available accessibility checkers
Accessibility checkers are powerful tools that can identify accessibility problems in your content and help with solutions. One smart, proactive strategy is to run these checkers on each piece of content as well as on your Moodle site to check for and fix accessibility issues.
- For Google products, download and use Grackle. Once installed, follow these guidelines for scanning and remediating all of your Google Docs.
- Note: users will need to go to Tools > Accessibility and tick “Turn on screen reader support” to use a screen reader with Google docs, sheets or slides.
- Learn more about using screen readers with Google products at Accessibility for Google Docs, Sheets, Slides & Drawings.
- For Microsoft products, use Microsoft’s built-in accessibility checker.
- Note: If you make your slides in PowerPoint and use Microsoft’s Accessibility Checker to verify accessibility and want to share them in Google Slides, we strongly recommend saving the original .pptx file on your hard drive and upload a copy of it to Google. Transferring the slides from PowerPoint to Google can overwrite some of the accessibility work you have done. You can then safely either share your original PowerPoint slides knowing that they are still accessible, or convert the original .pptx file to an accessible PDF to share them (see the next bullet). If you want to share them as Google slides, you should run Grackle on the slideshow after uploading the slides to Google.
- For Adobe (i.e. PDF) files use Acrobat Pro to create and verify PDF accessibility.
- If you convert PowerPoint files to .pdf in order to share them with students, follow this workflow for converting accessible PowerPoints to PDFs.
- For content native to your Moodle course site, use the Brickfield Accessibility+ Toolkit.
Accessible images
Alt text for still images
About alt text
Information conveyed through images, figures and graphs can be difficult or impossible to perceive when someone has limited or no vision, color-blindness, or when technology breaks and an image is not displayed. To make images fully accessible, we tag the image with alternative (“alt”) text. An alt text tag provides textual representation of the image that is stored in the background. If someone is using a screen reader, the reader will read the alt text to the user, thus ensuring that they are not denied the content contained in the image. Learn more by watching this Understanding Alternative Text video (5 min 13 sec).
Composing alt text
Alt text should offer a complete, text-based version of all relevant and unique instructional content that is provided in an image. Thus, you must consider the intention, context, and purpose of an image before creating the alt text, and note that the same image could have very different alt text in two settings, depending on the context and purpose of including the image in each setting. Learn more at this “Alternative Text” article by WebAIM and Writing Better Alt Text from the NC State Libraries
Is alt text enough? Complex images or detailed images may need a more thorough description than is reasonable for alt text, which is usually around 125 words maximum length. In this case, link to a full text description that conveys the full meaning of the item, perhaps adding a hyperlink to that description near the image that reads, “Access a long description of this image.”
Adding alt text to an image
- In Google Docs / Slides: To add alt text, right click the image and select “Alt text.” Alternatively, select the image and press “Ctrl+Alt+Y”. If an image is purely decorative, use Grackle to tag the image. In the tagging pane, check “Mark as artifact”. It’s a good idea to check all your images in Google, as the Grackle accessibility checker only identified images without alt text, but cannot check if the alt text is appropriate.
- In Moodle: In Moodle, every time you upload an image it includes the prompt “Describe this image for someone who cannot see it.” This description becomes the alt text. If the image is purely decorative, such as a border or page design, click the box that says “description not necessary,” in which case the image will be ignored by the screen reader. The Brickfield Accessibility+ Toolkit will provides a wizard that will find images with alt text issues, including missing alt text, alt text that is a placeholder like “image,” alt text that is a file name (e.g. image.jpg) and alt text that is longer than 125 words.
- In Microsoft Office products: Right-click on the image and select “View Alt Text” from the menu. Write your alt text in the box on the pane that appears on the right, or check “mark as decorative” if that is appropriate. NOTE: PowerPoint will try to automatically identify and describe your images using AI, so it’s a good idea to check all your images manually, as the Microsoft Accessibility Checker cannot check if the alt text is appropriate.
Other image accessibility considerations
When images are at a low resolution (<300 dpi), they lose definition and become difficult to perceive when zoomed in. To make images more accessible, upload images at the highest resolution that makes sense, especially if the image is detailed or contains text. You might also consider using scalable vector images (.svg) rather than .jpeg, for example. SVG’s are generally much more zoomable.
To learn more, read “How to Create High Resolution Images for Users with Low Vision” (article from Perkins School for the Blind) and “Alternatives to Alt Text” (DELTA News Article), under the heading “Alternative Solutions: Ways to Make Images More Accessible”.
Accessible text
About accessible text
Text can be difficult to perceive when someone
- has limited or no vision, color-blindness
- is in poor lighting conditions or has poor screen resolution
- needs to multitask (e.g. read while driving, cooking dinner or caring for a loved one)
- has a learning disability or is otherwise neurodivergent
Features of accessible text
- It is true text and not an image of text.
- If text cannot be highlighted and copied/pasted, it is likely an image of text and is not accessible. Pay special attention to PDF’s on this one, as many PDF’s are scans of text. For more information, see the section on accessible PDFs below.
- It is also common for tables to be included as images rather than text. In this case, creating a text-based table of the data to replace the image is necessary. Learn more in the accessible tables section below.
- It maximizes ease of reading.
- Avoid using text that blinks or moves
- Use typefaces that are simple and easy to read. Sans serif typefaces (e.g., Arial, Calibri, Verdana, Roboto) are good choices.
- Limit the number of different typefaces used to no more than 2 in a given document / page.
- Avoid small font sizes. In a document, use text size at least 12; in a presentation to be shown live, use a text size at least 24.
- Limit font variations (e.g., bold, italics, all caps).
- Limit the use of all caps, which is particularly difficult to read.
- Break up “walls of text” with some white space to reduce eye fatigue, and increase the spacing between lines to 1.15 or 1.5 spaces instead of single-spaced
- Minimize distracting grammatical, spelling and syntax errors
- See WebAIM’s Typefaces and Fonts article for more information.
- The color of the text is chosen wisely.
- Make sure your text color strongly contrasts with its background. See “Accessible Color Use and Color Contrast” from IT Accessibility
- Do not use color alone (either the text or highlighting, etc.) to convey meaning. That meaning will be lost to those with colorblindness or those using screen readers. Emphasize text in another way, by making it bold/strong, for example.
- If the text is a section heading, heading styles are used
- Use built-in heading styles to communicate the hierarchy of information and organizational structure of the text. Simply changing the formatting of your text is not enough as a screen reader will not communicate the format change. Word processing programs (Microsoft Word, Google Docs) use heading styles to automatically generate an outline, which is useful for anyone.
- How to apply headings in Microsoft Word
- How to apply headings in Google Docs
- How to apply headings in Moodle (choose the Style button in Row 1 of the editor)
- If the text includes a list, built-in bulleted or numbered list tools are used.
- Built-in bullet and numbered list tools format lists to stand and be obvious as lists.
- How to use lists in Microsoft Word
- How to use lists in Google Docs
- How to use lists in Moodle (buttons 5 and 6 of Row 1 in the editor)
- Accessible text maximizes comprehension for all learners, regardless of background and native language
- Do not using unnecessarily complex language where simpler language will do
- If you use acronyms and jargon, be sure to define them clearly and provide a glossary
- Avoid the use of idioms, which are often unique to one culture and do not translate well to other languages.
Accessible hyperlinked text
Using easy to understand, self-describing, meaningful names for hyperlinks facilitates understanding and navigation. Additionally, hyperlinks must work properly; there should not be broken links in the course. See How to write meaningful link text from the NC State Libraries for more information.
- Linked text should be descriptive, instead of a URL
- Do this: Lesson 2.6: Hyperlinks
- Not this: https://classroomaccess.oit.ncsu.edu/simple-wayslesson2/part-6-hyperlinks/
- Rationale: A screen readers would pronounce every single character of a URL, which would have no meaning. Sighted users also have difficulty interpreting where a URL will take them. The only time it is important to include a URL is in material that is likely to be used as a printed resource.
- Linked text should be concise
- Do this: Creating Accessible Hyperlinks
- Not this: This page lists ways in which accessible hyperlinks can benefit screen reader users
- Rationale: Users can scan a page and quickly determine what is linked and where it goes. Screen reader users also can ask their programs to just read all the links on a page, and more concise links will make this easier.
- Linked text should be precise
- Do this: Benefits of Accessible Hyperlinks
- Not this: Benefits
- Rationale: Precise hyperlinks clearly explain what specific information they link to and will improve the experience of all users.
- Linked email addresses should be written out
- Do this: accessibility@ncsu.edu
- Not this: Accessibility Help
- Rationale: This makes it clear that it is an email address and not a link
- Other hyperlink best practices
- Alert users if a hyperlink downloads a file. Example: “Campus Map (PDF, 5.62 MB)”
- Alert users if a hyperlink opens in a new browser tab or window. Example: NC State University Homepage (opens in new tab)
- Don’t underline text that is NOT a hyperlink.
- Give hyperlink text a different color from surrounding text. Hyperlink text is usually blue but may be any color that contrasts sufficiently with surrounding colors. Use the same color for all hyperlinks in a given document or web page.
Accessible PDFs
PDFs can be a great format for portability, because the reader software is free and platform agnostic. However, to make them truly accessible, there are a few things you must do when creating your PDF. Note that all of the guidelines for alt text, headers, tables and text formatting) also apply to PDFs. Here, you’ll find issues specific to the PDF format. Learn more at PDF Accessibility from the NC State University Libraries.
Include a link to Adobe Reader
The best practice according to the WCAG standards is to include a link to download Adobe Reader any time you are posting a PDF. Be sure to include a link to download the reader somewhere in your Moodle course.
Ensure accessible scanned or otherwise sourced PDFs
If you have a PDF scanned document or a PDF you downloaded from another source, such as a journal article, you may need to make it accessible without the original source document. Some options for doing this include
- Use Adobe Acrobat Pro.
- Adobe Acrobat Pro can recognize text, establish a reading order and headers, and create a tagged document.
- Open the document, click “Edit,” and Adobe Acrobat will use optical character recognition (OCR) to create a text version of the document. For more information, see Create and verify PDF accessibility (Acrobat Pro)
- Note that the document must be an unprotected PDF for this tool to work.
- Ask for help from the library.
- Use the “Chat now” feature from University Libraries to contact someone who can help you find an accessible PDF for journal articles.
- Use Moodle’s built-in document conversion tool.
- For files added to Moodle, you will see a small, multi-colored icon that is a circle of arrows to the right of a file. Clicking on this icon will allow you to select the type of file that you’d like to convert a document to.
- Note that the document must be an unprotected PDF for this tool to work.
- DELTA’s Knowledge Base Article: Using Brickfield’s File Conversion Tool
Ensure accessible documents you convert to PDF
- When converting a Word document to PDF, it must be converted to a tagged format. Enable the “Document structure tags” option in Word, or the “Tagged PDF” option in OpenOffice when exporting, or use the “Make Accessible” plug-in for Adobe Acrobat.
- If you convert PowerPoint files to .pdf in order to share them with students, follow this workflow for converting accessible PowerPoints to PDFs
Accessible tables
Tables are useful for visually organizing information, but they can be problematic for screen readers. Tables that are used purely for formatting or layout must be tagged as such so that a screen reader does not try to interpret them as a data table.
Strategies for accessible tables
- Tag each table as either containing data or as a formatting tool, and for data tables define the header rows and columns..
- In Moodle, it is not possible to tag a table as a formatting tool. In the text editor, use the table button to insert or format a table. The resulting dialog box (see image at right) will allow you to caption your table and choose whether to define the header on columns, rows, or both.
- In Microsoft Word, select the row (Table > Select > Row); right click on the row and select “Table Properties;” in the Table Properties dialog box, click the Row tab and check the box that says, “Repeat as header row at the top of each page.” Learn more about the built-in Microsoft Accessibility Checker.
- In Google Docs, use the free Grackle Accessibility Checker for Google to tag tables.
- Avoid empty cells and merged cells.
- Use captions or alt text to describe a table.
Accessible audio and video
Descriptive text for images in video
When the transcript and captions of a video do not fully describe what is being shown on screen in the video, descriptive text must be provided for the on-screen visual in order for the video to be fully perceivable by a person with limited sight. For example, if a speaker says, “Watch the animation of this process” but does not describe what is happening on the screen, that instructional content is lost for some users.
To learn more about this topic, watch the video “Using Descriptive Language in Videos” (1 min, 55 sec) or read WebAIM’s article “Captions, Transcripts and Audio Descriptions”. You might consider using this Video Long Description Template.
Captions and transcripts
Audio content (including that within videos) can be difficult to perceive by
- someone with permanent or temporary hearing loss
- someone for whom English is not their first language
- neurodiverse students, those with learning disabilities or cognitive impairment
- someone who needs to be quiet due to environmental conditions
- someone in a noisy location
To make audio content accessible, provide an accurate visual equivalent, i.e. captions and transcripts, for all audio content.
- General resources
- Watch “Using Transcripts and Captions in Videos” (56 sec)
- Apply for an NC State captioning grant, which will provide funds to have your videos captioned accurately by a third party vendor.
- Information from NC State IT Accessibility
- Tool-specific resources and help documents
Accessible organization and navigation
Use clear, consistent naming conventions in Moodle
- Use descriptive, concise and consistent Moodle module / topic titles.
- Making the topic titles descriptive helps students know what they’ll find within that course section, and keeping the topic title concise means it won’t take up too much space in the course index.
- Include the dates when you’ll be covering that item in the topic title (if applicable), to further help student find where they are in the course.
- Use descriptive, concise and consistent resource and activity names.
- Consider starting each item with an action verb that lets students know what they are expected to do with it. For instance, READ, WATCH, COMPLETE, etc.
- Use clear, distinct names for items so that when they show up on the Moodle page or in the course index it’s clear what they are.
Organize content for clarity, usability and consistency
- Chunk content into digestible-sized pieces.
- Avoid overly long videos and long “walls of text” on your Moodle page and course documents. This can help with focus, reduce eye fatigue and be less likely to overwhelm students.
- Limit video length to one topic and <10 minutes in length – it is documented that students often lose focus to stop watching if videos are too long.
- Group content and activities in a way that reflects how you want students to interact with your course and help students find what they need.
- Use blocks on the right side of your Moodle course to further group content that you want students to have quick access to. Learn about blocks in Moodle.
- Consider breaking up long Moodle pages into an NC State Book or separate Moodle pages. Learn about NC State Book.