Blueprint by Tiny
Return to Tiny.cloud
Return to Tiny.cloudTry TinyMCE for Free
Search by
Artwork by N/A

Make your content accessible with TinyMCE

Ben Long

September 5th, 2019

Written by

Ben Long
Ben Long

Category

Tips & How-Tos

Here at Tiny, we are committed to providing developers and content creators with the means to apply web content accessibility requirements with minimal effort.

The A11Y Project and the World Health Organisation provide perspective here:

Blind and visually impaired make up 285,000,000 people according to the World Health Organization (June 2012) with 39,000,000 categorized as legally blind and the remaining 246,000,000 visually impaired. Deaf and hearing impaired make up 275,000,000 (2004) in the moderate-to-profound hearing impairment category.

There are two sides to this challenge. Firstly, content authors need to provide content that is accessible by their audience. And secondly, developers need to enable content authors to do this with ease and ensure that the editing experience is accessible to those authors as well.

Creating accessible content can often be both complex and time-consuming. Luckily, you don't necessarily need to spend your own time researching web accessibility guidelines, or worrying about which set of 10 accessibility tips are the right ones to tick all the boxes.

How rich text editors can help with accessibility

The best WYSIWYG rich text editors provide content authors with accessibility checking tools based on well-defined standards such as WCAG and Section 508. Standards like these aim to ensure that technologies and web content (including audio and visual elements) are accessible to people with disabilities. For example, you need to ensure that all images are accompanied by alternative text that can be read aloud by a screen reader, and that users can navigate effectively with only a keyboard (without a mouse).

And if they're walking the talk, the same level of rigor is applied to the editors themselves to ensure that the authoring experience is accessible too.

TinyMCE and the Accessibility Checker plugin

Tiny's developers have done extensive research, based on WCAG and Section 508, to ensure that the TinyMCE editor is accessible to content authors; and we have developed an Accessibility Checker plugin for content authors to do the same for their audiences.

The front-end developers at Tiny care deeply about web accessibility and ensuring that all of our users can experience TinyMCE in the same way.

The Accessibility Checker plugin enables content authors to check their content for various WCAG and Section 508 accessibility issues using an in-editor dialog. There is also a repair feature that steps users through identified problems and, in many instances, will automatically correct the error for them.

Try the live demo

Check out the live demo on the Accessibility Checker page. Or try the full TinyMCE experience with the demo on our home page.

Screenshot of the Accessibility Checker plugin demo.
Screenshot of the Accessibility Checker plugin demo.

Hear from the devs behind the tech

Lawanya is a developer at Tiny, based in our Brisbane, Australia office, and is responsible for accessibility of the TinyMCE editor itself.

Lawanya, what are you doing to ensure accessibility for users of TinyMCE?

At Tiny, we approach accessibility as part of the UI design process. TinyMCE is developed and tested to comply with the WAI-ARIA specification. It is designed with keyboard users, low vision users, and screen reader users in mind. We make sure the UI is understandable and presents no blockers to the users. We aim to provide non-visual alternatives to all editor functionalities, smooth navigation between UI components, and compatibility with all modern platforms, browsers, and most widely used devices. We test our UI using a range of screen reader software, including JAWS and VoiceOver, and we keep our Accessibility Checker plugin updated with the latest WCAG specifications and guidelines. By leveraging HTML5 semantic markup, colors, metadata, and other best practices, TinyMCE not only offers a quality experience to everyone using the editor, but also helps its users create accessible content.

Why is web accessibility important to you?

The front-end developers at Tiny care deeply about web accessibility and ensuring that all of our users can experience TinyMCE in the same way. Our view of UX design goes beyond applying a shiny coat of paint and building a product that is just beautiful to see. Our design centers on being intentional and intuitive as well as having visual appeal. We believe in finding and removing barriers to fully access and interact with the editor as part of our vision to democratize the process of web content creation.

We have seen for ourselves, through a web accessibility training program, how users with visual, motor, cognitive and hearing disabilities access information on the web, and this has ingrained in us a sense of deep empathy and commitment towards making TinyMCE universally inclusive. It is important to us that every single user feels catered for by meticulously improving TinyMCE's usability.

Get started with TinyMCE

By using TinyMCE and our Accessibility Checker premium plugin, you know that we've taken care of accessibility requirements around the editor and resulting content for you. It's one less thing you have to think about.

Get started with a free trial of TinyMCE or get in touch with us if you have any questions.

Accessibility
Ben Long
byBen Long

Developer Advocate at Tiny. Computer scientist turned storyteller. Reminisces about programming on the MicroBee. Writes picture books for kids. Also the wearer of rad shoes. “Science isn’t finished until you share the story.”

Related Articles

  • Depiction of three ways to try TinyMCE
    Tips & How-Tos

    3 ways to try TinyMCE (with live examples)

    by Ben Long in Tips & How-Tos

Build beautiful content for the web with Tiny.

The rich text editing platform that helped launch Atlassian, Medium, Evernote and more.

Begin my FREE 30 day trial
Tiny Editor