Accessibility in Digital Content v1
kirsteen allison
Created on August 4, 2024
Over 30 million people build interactive content in Genially.
Check out what others have designed:
ANCIENT EGYPT
Learning unit
MONSTERS COMIC "SHARING IS CARING"
Learning unit
PARTS OF THE ANIMAL CELL
Learning unit
PARTS OF THE PLANT CELL
Learning unit
PARTS OF A PROKARYOTIC CELL
Learning unit
Transcript
Accessibility in Digital content
Start
Objectives
You will be able to
- identify the purpose and importance of making digital content usable for diverse groups of people.
- identify common accessibility issues that arise in digital content.
- utilise tools and techniques to evaluate and improve the accessibility of digital content.
The Importance of Digital Accessibility
View More
24%
In the United Kingdom, about 24% of adults identify as having a disability or long term condition. The true figure is likely to be much higher.
97%
of the world's top 1 million websites fail to comply with WCAG 2.0 (accessibility standards.)
Data
Data from Bureau of Internet Accessibility, Inc.
Data from Family Resources Survey 2021/2022
Table of Contents
Microsoft Files
05
Hyperlinks
04
Colour and Contrast
03
Alternative Text
02
01
Adobe PDFs
06
Closed Captions
Alternative Text
IntroductionAlt-text is useful because it can be read by screen readers to make images accessible to people with visual impairments or learning difficulties. It can be displayed in browsers if an image does not load properly, and it provides a meaningful description of images that can be read by search engines.Select the icons below for more info.
How to write alt text?
Module 1
What about complex images?
Colour and Contrast
Module 2
Accessibility goes beyond screen readers for individuals with complete blindness; it also addresses various visual impairments, including low vision, peripheral or central vision loss, blurred vision, light sensitivity, and colour blindness.
Colour Contrast Examples
HyperlinksSince hyperlinks are widely used among web design, it is best practice to make sure that links are accessible to everyone, read by a screen reader, or allow for keyboard navigation.
Module 3
View More
View More
View More
View More
Do not use the word "link" in your links.
Use meaningful link text and keep it concise.
Do not capitalise links.
Avoid using URLs, punctuation or typographic symbols as link text.
Module 4
Closed Captions
Closed captions (which can be toggled on and off) provide content to people who are deaf or cannot otherwise hear audio. They are also used by people who process written information better than audio, whose first language is different than what is spoken in the audio, or those who do not have the proper technology to play audio. Closed captions can benefit many users.
Are automatic captions sufficient?
Select the link at the right for more info.
Making Documents Accessible
Module 5
Microsoft Office applications offer built-in Accessibility Checkers, whicih can help you to identify and fix potential accessibility issues, ensuring your materials reach everyone.The accessibility principles discussed in this training apply to Microsoft products as well. But, to make the most of these tools, there are specific best practices and resources to consider.Click the links below to access detailed best practices for each tool. Bookmark them for easy reference as you create your accessible documents and presentations.
Making Excel Accessible
Making PowerPoints Accessible
Portable Document Format (PDF) files can be created from scanned documents, converted Microsoft Office documents or Google documents, and/or Adobe InDesign. In terms of accessibility in PDFs, we are talking about features such as, document properties, structured tags, navigational aids, tables, and forms that allow for access of screen readers. Select each card below to learn about the different components of PDFs.
Accessibility Checker
Module 6
Document Properties
Structured Tags
Headings
Tables
Forms
Knowledge Check
start
Now that you have completed the training, it is time to take an assessment! It will take you 5 minutes to complete the four questions and one hands-on activity.Select Start to begin.
What is NOT best practice for writing alt text?
01
Be accurate and equivalent.
Be succinct and not redundant.
Include a short alt text and indicate where to find the long description of a complex image.
Use the phrases “image of …” or “graphic of …” to describe the image.
Quiz
The colour contrast ratio between text and its background is at least 4:1.
Quiz
02
True
False
When creating hyperlinks, we should use meaningful link text, not the whole URL.
Quiz
03
True
False
Scenario: You are creating a video and will post it online for all people to view. What are you expected to do?
Quiz
04
There is nothing else that I need to do.
Use automatic captions, like those in YouTube and Zoom.
Use a captioning tool to transcribe the content and upload the closed captions along with the video after reviewing it.
Practice: I want to use the Adobe Accessibility checker, how should I activate it?
Quiz
05
start Practice
You got this!
Now the last step is?
Whoop!
Now you have added the accessibility tool to your right-hand side menu!
Now you have added the accessibility tool to your right-hand side menu!
Bibliography Write a title here
Resources
01
02
03
Leonard Cheshire Training and Consultancy
W3C’s Web Content Accessibility Guidelines
Microsoft Accessibility Videos
Thanks!
Alternative Text
IntroductionAlt-text is useful because it can be read by screen readers to make images accessible to people with visual impairments or learning difficulties. It can be displayed in browsers if an image does not load properly, and it provides a meaningful description of images that can be read by search engines.Select the icons below for more info.
How to write alt text?
Module 1
Review the content & Try Again
Back to Quiz
What about complex images?
Colour and Contrast
Module 2
Accessibility goes beyond screen readers for individuals with complete blindness; it also addresses various visual impairments, including low vision, peripheral or central vision loss, blurred vision, light sensitivity, and colour blindness.
Colour Contrast Examples
Back to Quiz
Review the content & Try Again
HyperlinksSince hyperlinks are widely used among courses and web design, it is best practice to make sure that links are accessible to everyone, read by a screen reader, or allow for keyboard navigation.
Module 3
View More
View More
View More
View More
Back to Quiz
Review the content & Try Again
Do not use the word "link" in your links.
Use meaningful link text and keep it concise.
Do not capitalize links.
Avoid using URLs, punctuation or typographic symbols as link text.
Module 4
Closed Captions
Closed captions (which can be toggled on and off) provide content to people who are deaf or cannot otherwise hear audio. They are also used by people who process written information better than audio, whose first language is different than what is spoken in the audio, or those who do not have the proper technology to play audio.
Are automatic captions sufficient?
Select the link at the right for more info.
Review the content & Try Again
Back to Quiz
Some screen readers read capitalised text letter by letter, and people find it difficult to read capitalised text - especially people with reading disabilities.
LEONARD CHESHIRE
Leonard Cheshire
Website accessibility is not just a nice to have. In the UK – it’s a legal requirement for both public and private sector organisations. While countries have different laws for accessibility, many – including the UK – base their legislation on the international golden standard for web accessibility, the Web Content Accessibility Guidelines (WCAG). WCAG explains how to make your website more accessible to disabled people.
Click on the left icon to access the Web Content Accessibility Guidelines (WCAG)
Some screen readers read capitalized text letter by letter, and people find it difficult to read capitalized text - especially people with reading disabilities.
TEXAS A&M AGRILIFE
Texas A&M AgriLife
To meet accessibility requirements, the color contrast ratio between text and its background is at least 4.5:1.
Go to next question
Correct!
Colour should NOT be used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. To avoid this, ensure that information conveyed by colour differences is also conveyed in text.
Appropriate colour contrast also makes it easier to read content in low light or extremely sunny conditions. Make sure there is a contrast ratio of at least 4.5:1 between text and its background, and at least 3:1 for large-scale text, incidental text, or logos. To ensure sufficient colour contrast, you can use the
WebAIM Contrast Checker.
Be accurate and equivalent.
Be succinct and not redundant.
Do NOT use the phrases “image of …” or “graphic of …” to describe the image.
Do not use the phrases “image of …” or “graphic of …” to describe the image, as screen readers will identify the item as image before reading the alt text.
Go to next question
Correct!
- Do not use “Click here” or “Read more” as link text.
- Restricting the length to a maximum of 100 characters, as screen readers must read the entirety of a link.
Click here
Leonard Cheshire
Screen readers are going to read the URL letter by letter OR might not be able to identify punctuation and typographic symbols. Therefore, use meaningful text as links instead.
www.leonardcheshire.org
Leonard Cheshire
Imagine reading a newspaper with no headlines? How would you choose which story to read? PDFs with correctly tagged headings and subheadings provide a blueprint to the document content.
Headings
To meet accessibility requirements, automatic captions need to be reviewed to ensure they are fully accurate. Normally, automatic captions are only 60-70% accurate.
Go to next question
Correct!
What about complex images?
Complex images typically include graphs and charts (like flow charts and organizational charts), diagrams and illustrations, and maps showing locations or other information.
It is best practice to include a short alt text of the image and indicate where to find the long description of the image. This could include putting a link to the long description near the image, OR describing where the long description is in the alt attribute.
Screen readers will tell people when they encounter a link. Thus, there is no need to use the words “link,” “links to,” or “goes to” in the link text.
Texas A&M AgriLife Link
Texas A&M AgriLife
Color should NOT be used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. To avoid this, ensure that information conveyed by color differences is also conveyed in text.
Appropriate color contrast also makes it easier to read content in low light or extremely sunny conditions. Make sure there is a contrast ratio of at least 4.5:1 between text and its background, and at least 3:1 for large-scale text, incidental text, or logos. To ensure sufficient color contrast, you can use the
WebAIM Contrast Checker.
You would want to find and click on the tab that could take you to locate the accessibility tool.
What about complex images?
Complex images typically include graphs and charts (like flow charts and organisational charts), diagrams and illustrations, and maps showing locations or other information.
It is best practice to include a short alt text of the image and indicate where to find the long description of the image. This could include putting a link to the long description near the image, OR describing where the long description is in the alt attribute.
You would want to click the add button for the accessibility tool.
Screen readers are going to read the URL letter by letter OR might not be able to identify punctuation and typographic symbols. Therefore, use meaningful text as links instead.
https://agrilife.tamu.edu/
Texas A&M AgriLife
- Do not use “Click here” or “Read more” as link text.
- Restricting the length to a maximum of 100 characters, as screen readers must read the entirety of a link.
Click here
Texas A&M AgriLife
Be accurate and equivalent.
Be succinct and not redundant.
Do NOT use the phrases “image of …” or “graphic of …” to describe the image.
Many of the programs such as YouTube or Zoom, offer options for automatic captions. Automatic captions do not meet accessibility requirements until after they have been reviewed to ensure they are fully accurate, which usually requires significant editing. Think of automatic captions as a starting point for your video caption needs, not the final product. Strive for 100% in terms of caption accuracy, completeness, and timing.
While the most accessible forms are built using native HTML or third-party services, if you need to create a fillable form in a digital document format, PDF forms are the best choice for accessibility.
Forms
This is a tool that performs a thorough check of a PDF file. If you do not see this tool on your right-hand side menu after opening Acrobat, you can locate it under the “Tools” tab.
Adobe Accessibility Checker
We should not use URL as the link text, because screen readers will read the link letter by letter, which makes no sense.
Go to next question
Correct!
Screen readers will tell people when they encounter a link. Thus, there is no need to use the words “link,” “links to,” or “goes to” in the link text.
Leonard Cheshire Link
Leonard Cheshire
Many of the programs such as YouTube or Zoom, offer options for automatic captions. Automatic captions do not meet accessibility requirements until after they have been reviewed to ensure they are fully accurate, which usually requires significant editing. Think of automatic captions as a starting point for your video caption needs, not the final product. Strive for 100% in terms of caption accuracy, completeness, and timing.
PDF tags are the key to accessing a PDF document’s content with screen readers. Each tag identifies the type of content and arrange the document content into a hierarchical architecture (or a “tag tree”).
Structured Tags
This Shows basic information about the document. For instances, the title, author, subject, and keywords. Choose the "File" tab > Document Properties.
Document Properties
Every table in a PDF file should have a proper table tag structure - it is important to identify the number of rows and columns as well as column (or row) headers, and which heading each data entry corresponds to.
Tables