Accessible Website Services

ACCESSIBLE EQUATIONS: Use MathML Rather Than Images

Posted on December 15, 2018November 12, 2021 by Mary Gillen

$Mathematics background with formulas$

In order to create semantically accurate math equations that are accessible to all, use MathML, the markup language that provides semantic understanding and proper syntax to assistive technologies like screen readers.

Why Not Use an Image With Alt Text?

According to info included in Princeton University’s MathML for Accessible Math Markup Tutorial, there is a good reason not to use images to display math equations:

“Whereas an alternative text description on an image of a math equation is better than nothing, it still a violation of Success Criterion 1.4.5 Images of Text. Presenting an equation as an image denies the ability of the non-sighted user to derive the understanding through semantics in an equivalent fashion to a sighted user.”

MathML Tutorials

W3C MathML Guide
Mozilla Guide to MathML
Princeton University’s MathML for Accessible Math Markup Tutorial
The Connexions Guide to MathML.

===

WEBSITE ACCESSIBILITY TESTING & REMEDIATION SERVICES: Mary Gillen is an experienced Website Accessibility Compliance Auditor and Remediator. She can test your website to determine if it meets accessibility standards:

WCAG 2.1: 312 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 59 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

ACCESSIBLE WEBSITE DESIGN TIP: Always Include a Skip Navigation Link

Posted on December 13, 2018December 13, 2018 by Mary Gillen

FAIL: The inability to skip repetitive links (such as a navigation menu) can be a problem for those with mobility disabilities who use the keyboard to navigate instead of a mouse.

SOLUTION: Add a simple hyperlink at the very beginning of your HTML page that allows keyboard users to skip to the main section of page content:

<a class=”skiptomain” href=”#main-content”>To Skip to Main Content – Press Enter</a>

To prevent sighted users from seeing the Skip to Main Content – Press Enter link at the top of the page, add these declarations to your CSS file:

.skiptomain {
position: absolute;
top: -1000px;
left: -1000px;
height: 1px;
width: 1px;
text-align: left;
overflow: hidden;
}
a.skiptomain:active,
a.skiptomain:focus,
a.skiptomain:hover {
left: 0;
top: 0;
width: auto;
height: auto;
overflow: visible;
}

This will position the Skip to main content link 1000px off the screen for sighted users, without hiding it from screen readers. When keyboard users hit the tab key the first time, the link will receive focus and be visible at the top left corner of the page.

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

META TAGS: How Not to Use Them When Coding for Compliance

Posted on November 5, 2017November 12, 2018 by Mary Gillen

Hello I Am Waiting words on a nametag sticker to illustrate being patient, late, tardy or delayed for a trip, appointment, meeting or event

FAIL: Do not use the META tag to automatically refresh a page as this can be disorientating for users.

PASS: If the time interval is too short, people who are blind will not have enough time to make their screen readers read the page before the page refreshes unexpectedly and causes the screen reader to begin reading at the top.

Section 508 (2000) 1194.22 (p)
WCAG 2.0 F58 (Success Criteria: 2.2.1 level A)
Section 508 (2017) F58 (Success Criteria: 2.2.1 level A)

===

FAIL: Do not use META REFRESH with a non-zero timeout to automatically refresh the page, since it causes an unexpected interruption for screen reader users.

PASS: If you cannot avoid using META REFRESH, change the refresh time to zero, since the redirect is instant and will not be perceived as a change of context.

Section 508 (2000) 1194.22 (p)
WCAG 1.0 7.5
WCAG 2.0 F40 (Success Criteria: 2.2.1 level A, 2.2.4 level AAA, 3.2.5 level AAA)
Section 508 (2017) F40 (Success Criteria: 2.2.1 level A, 2.2.4 level AAA, 3.2.5 level AAA)

===

FAIL: Do not use the Refresh HTTP header to automatically refresh a page as this can be disorientating for users.

People who are blind will not have enough time to make their screen readers read the page before the page refreshes unexpectedly and causes the screen reader to begin reading at the top.

Section 508 (2000) 1194.22 (p)
WCAG 2.0 F58 (Success Criteria: 2.2.1 level A)
Section 508 (2017) F58 (Success Criteria: 2.2.1 level A)

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

32 Ways to Test PowerPoint Presentations for Compliance

Posted on November 2, 2017November 12, 2018 by Mary Gillen

Powerpoint Presentation Background

Making content accessible to people with disabilities online begins with making all types of files compliant from the start. Do you have links to PowerPoint presentations on your website? If so, be sure these documents are compliant.

Here are 32 items to test:

1. Does the document file name not contain spaces and/or special characters?

2. Is the document file name concise, generally limited to 20–30 characters, and does it make the contents of the file clear?

3. Have the Document Properties for Title, Author, Subject (AKA Description), Keywords, Language, and Copyright Status been applied?

4. Does the document utilize recommended fonts (i.e., Times New Roman, Verdana, Arial, Tahoma, Helvetica, or Calibri)?

5. Have track changes been accepted or rejected and turned off?

6. Have comments been removed and formatting marks been turned off?

7. Does the document refrain from using flashing/flickering text and/or animated text?

8. Is the document free of background images or watermarks?

9. Do all images, grouped images, and non-text elements that convey information have meaningful alternative-text descriptions?

10. Do complex images (i.e., charts and graphs) have descriptive text near the image (perhaps as a caption)?

11. Do all URLs contain descriptive hyperlinks (i.e., avoid generic phrases like “Click here” and, instead, use phrases that let users know about the content of the linked page prior to selecting it

12. Are all URLs linked to correct Web destinations?

13. Are e-mail links accessible?

14. Has a separate accessible version of the document been provided when there is no other way to make the content accessible?

15. If there are tables, are blank cells avoided?

16. Is all of the text easy to read in comparison to the background of the document (i.e., has a color-contrast ratio of 4.5:1)?

17. Can all slide text be viewed in the Outline View?

18. Do all of the slides avoid using flickering/flashing text and/or animated text?

19. Do all of the slides avoid using text boxes or graphics with text within them?

20. Is the list style being used as opposed to manually typed characters (e.g. Hyphens, numbers, or graphics)?

21. If multimedia is present, did the multimedia pass the Multimedia Checklist?

22. Is the presentation free of SmartArt?

23. Are multiple associated images on the same page (e.g., boxes in an organizational chart) grouped as one object?

24. Have all multilayered objects been flattened into one image and does that image use one alternative text description for the image?

25. Do images/graphics appear crisp and legible?

26. If the document (or a section of the document) has a tabular appearance, is the tabular structure made using the table option (as opposed to manual tabs and/or spaces)?

27. Do all tables have a logical reading order from left to right, top to bottom?

28. Do data tables have the entire first row designated as a ‘Header Row’ in table properties?

29. Is the table free of merged cells?

30. Are all tables described and labeled (where appropriate)? Note: In some cases naming/numbering of tables may not be appropriate. For example, a small data table in a presentation may not need a reference.

31. In table properties, is “Allow row to break across pages” unchecked?

32. Has the document been reviewed in Print Preview for a final visual check?

[SOURCE]

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

8 Ways to Make Excel Worksheets Compliant

Posted on August 22, 2017November 12, 2018 by Mary Gillen

Making content accessible to people with disabilities online begins with making all types of files compliant from the start. Do you have links to Excel worksheets or spreadsheets on your website? If so, be sure your these documents are compliant.

To get you started, here are eight items to test:

FAIL: Excel worksheet images, charts and graphics are published without ALT text. PASS: To add alternative text (Alt text) to an image, chart or graphic: Right Click (Shift+F10) on the image, click Format, choose Alt Text. Type a descriptive name that describes the content of the image, chart or graphic.

FAIL: Excel file name contains spaces.
PASS: Use dashes (-) to separate words in your Excel file name. Keep the total number of characters in the file name between 20-30.

FAIL: Excel file info is not complete.
PASS: Fill in the Document Properties for Title, Author, Subject (AKA Description), Keywords, Language, and Copyright Status.

FAIL: Document contains background images and watermarks.
PASS: Be sure the document is free of background images or watermarks.

FAIL: Tables contain blank spaces.
PASS: If there are tables, avoid using blank cells.

FAIL: If there are merged or split cells contained in a data table, these will not be correctly interpreted by assistive technology.
PASS: Do not use merged or split cells.

FAIL: Track changes have not been accepted or rejected and turned off.
PASS: Turn track changes off before publishing your Excel document to the Web.

FAIL: Sheet tabs do not have unique names.
PASS: Sheet names in an Excel file should be unique and provide information about what can be found on the worksheet.
To rename a sheet: Right-click (Shift+F10) the sheet tab, and then click Rename. Type a brief, unique name that is descriptive of the sheet contents.

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

MathML: Tutorials for Accessible Math Markup

Posted on August 21, 2017November 12, 2018 by Mary Gillen

$Mathematics background with formulas$

In order to create semantically accurate math equations that are accessible to all, check out MathML, the markup language that provides semantic understanding and proper syntax to assistive technologies like screen readers.

Why Not Use an Image With Alt Text?

According to info included in Princeton University’s MathML for Accessible Math Markup Tutorial, there is a good reason not to use images to display math equations:

MathML Tutorials

W3C MathML Guide
Mozilla Guide to MathML
Princeton University’s MathML for Accessible Math Markup Tutorial
Daniel Scully’s Beginner’s Guide to MathML
The Connexions Guide to MathML.

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

JAVASCRIPT: Avoid Using Duplicate IDs

Posted on January 9, 2017November 12, 2018 by Mary Gillen

Blue html Code Background FACT: Web pages that contain duplicate IDs can cause problems in screen readers.

If two or more elements on the same page share the same ID, this can cause problems in screen readers which use IDs for labeling controls and table headings.

It can also cause problems in JavaScript methods like getElementById and querySelector, which behave inconsistently when duplicate IDs are present.

Change the IDs so all are unique for each element.

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

LINKS: Click Here…Click Here…and Click Here Again

Posted on January 9, 2017November 12, 2018 by Mary Gillen

Click Here Buttons. 4 icons shown When you use generic text like “Click Here” or “Read More” as instructions in link text, it is confusing because it says nothing about the content that will appear once the link is clicked. Remember: link targets are read out loud by screen readers.

Another thing to note: screen readers often tab from one link to the next.

Tabbing between links labeled “click here” sounds like “click here, tab, click here, tab, click here”.

REMEDIATION: Change the link text so it is an explanation of the target content. This will make more sense when read by a screen reader.

EXAMPLE

Original Instruction Text: Click here
Revised Instruction Text: Click here to read the latest news

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

7 Ways to Make Word Documents Compliant

Posted on December 20, 2016November 12, 2018 by Mary Gillen

icon of Word document Making content accessible to people with disabilities online begins with making all types of files compliant from the start. Do you have links to Word documents on your website? If so, be sure your Word documents are compliant.

To get you started, here are seven items to test:

FAIL: Word document contains a graphic without ALT text.
PASS: Use the ‘Format Picture’ command in Word to add ALT text

FAIL: Document file name contains spaces.
PASS: Use dashes (-) to separate words in your Word file name. Keep the total number of characters in the file name between 20-30.

FAIL: Word file info is not complete.
PASS: Fill in the Document Properties for Title, Author, Subject (AKA Description), Keywords, Language, and Copyright Status.

FAIL: Document contains background images and watermarks.
PASS: Be sure the document is free of background images or watermarks.

FAIL: Color is used as a way to instruct. Colorblind visitors may not able to follow the instructions when reading your Word document.
PASS: Use an instruction description that does not depend on color.

FAIL: Table data created using manual tabs and/or spaces.
PASS: Use the Insert Table option to create tables.

FAIL: Track changes have not been accepted or rejected and turned off.
PASS: Turn track changes off before publishing your Word document to the Web.

===

WCAG 2.1: 118 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 55 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===

<accessible-website-services>

Tag: Accessible Website Services

ACCESSIBLE EQUATIONS: Use MathML Rather Than Images

ACCESSIBLE WEBSITE DESIGN TIP: Always Include a Skip Navigation Link

META TAGS: How Not to Use Them When Coding for Compliance

32 Ways to Test PowerPoint Presentations for Compliance

8 Ways to Make Excel Worksheets Compliant

MathML: Tutorials for Accessible Math Markup

JAVASCRIPT: Avoid Using Duplicate IDs

LINKS: Click Here…Click Here…and Click Here Again

7 Ways to Make Word Documents Compliant