SimpleTOC – Table of Contents Block vs Editoria11y Accessibility Checker

Editoria11y (“editorial accessibility ally”) is a quality assurance tool built for an author’s workflow: It provides instant feedback in the post and page editors. Authors do not need to remember to press a button or visit a dashboard to check their work. It checks in context on pages, not just within the post editor, allowing it to test content edited in widgets or theme features. It focuses exclusively on content issues: assisting authors at improving the things that are their responsibility. This plugin is the WordPress adaptation of the open-source Editoria11y library. Tests run in the browser and findings are stored in your own database; nothing is sent to any third party. It is meant to supplement, not replace, testing your code and visual design with developer-focused tools and testing practices. The authoring experience Check out a demo of the checker itself. When logged-in authors and editors are viewing pages, Editoria11y inserts tooltips marking any issues present on the current page. Issues are also highlighted while editing in the Block Editor (Gutenberg) and Classic Editor (TinyMCE). Tooltips explain each problem and what actions are needed to resolve it. Some issues are “manual checks,” which have buttons to ignore the check or mark the content as OK. Clicking the main toggle shows and hides the tooltips. The main toggle also allows authors to jump to the next issue, restore previously dismissed alerts, visualize text alternatives for images on the page (“alts”), view the document’s heading outline, and view site-wide detection lists. The admin experience Filterable reports let you explore recent issues, which pages have the most issues, which issues are most common, and which issues have been dismissed. These populate and update when published content is viewed by logged-in authors. Various settings are available to constrain checks to specific parts of the page and tweak the sensitivity of several tests. The tests Text alternatives for visual content Images with no alt text Images with a filename as alt text Images with very long alt text Images with fake alt text to get around field validation (e.g. “TBD”) Alt text that contains redundant text like “image of” or “photo of” Images in links with alt text that appears to be describing the image instead of the link destination Embedded visualizations that usually require a text alternative Meaningful links Links with no text Links titled with a filename Links only titled with generic text: “click here,” “learn more,” “download,” etc. Links that open in a new window without warning Document outline and structure Skipped heading levels Empty headings Very long headings Suspiciously short blockquotes that may actually be headings All-bold paragraphs with no punctuation that may actually be headings Suspicious formatting that should probably be converted to a list (sequences of sentences that start with asterisks, emoji or incrementing numbers/letters) Tables without headers Empty table header cells Tables with document headers (“Header 3”) instead of table headers General quality assurance LARGE QUANTITIES OF CAPS LOCK TEXT Links to PDFs and other documents, reminding the user to test the download for accessibility or provide an alternate, accessible format Video embeds, reminding the user to add closed captions Audio embeds, reminding the user to provide a transcript Social media embeds, reminding the user to provide alt attributes Custom results provided by your JS Credit Editoria11y’s WordPress plugin is maintained by Princeton University’s Web Development Services team: John Jameson: Editoria11y JS and CMS integrations Jason Partyka: Devops Brian Osborne: Code review Michael Muzzie: Wapuu photos Editoria11y began as a fork of the Toronto Metropolitan University’s Sa11y Accessibility Checker, and our teams regularly pass new code and ideas back and forth.

Add a Table of Contents block to your posts and pages. The TOC is a nested list of links to all heading found in the post or page. To use it, simply add a block and search for “SimpleTOC” or just “TOC”. The maximum depth of the toc can be configured in in the blocks’ sidebar among many other options. There can hide the headline “Table of Contents” and add your own by using a normal heading block. Spin up a new WordPress instance with the SimpleTOC plugin already installed. User Feedback “It is lightweight, stable, and fully compatible with WordPress Full Site Editing. A reliable solution that integrates seamlessly and performs exactly as expected.” — @js100 on wordpress.org “Does the job perfectly, and adds no bloat.” — @clicknathan on wordpress.org “Simple yet powerful. Great plugin that does exactly what you need.” — @mixey on wordpress.org Accessibility This plugin is designed & developed for WCAG 2.2 level AA conformance. The plugin is tested with assistive technology and intended to be accessible, however some third party plugins or themes may affect the individual accessibility on a given website. If you find an accessibility issue, please let us know and we’ll try to address it promptly. Hidden TOCs use native and semantics without extra ARIA references that require custom IDs. Features Designed for Gutenberg. Zero configuration: Add the SimpleTOC block to your post and that’s it. Minimal and valid HTML output. Utilizes the browser’s built-in details tag for a collapsible interface. No JavaScript or CSS by default. Optional features such as the accordion menu, smooth scrolling, or box style add minimal assets only when enabled. Optional box style for the TOC with a default gray background. Style SimpleTOC with Gutenberg’s native group styling options. Inherits the style of your theme. Smooth scrolling effect using CSS. Accessibility built-in by following web standards. Optional ARIA Label and navigation role attributes. Translated in multiple languages. Including German, Japanese, Chinese (Taiwan), Dutch, Brazilian Portuguese, French, Spanish and Latvia. Ideal for creating a Frequently Asked Questions section on your website. Customization Administrators can utilize global settings to supersede the individual block settings. Add background and text color with Gutenberg groups. Native block support for wide and full width. Control the maximum depth of the headings. Choose between an ordered, bullet HTML list. Or indent the list. Enable a box style and choose a box color directly in the block sidebar. Select a heading level or turn it into a paragraph. Disable the h2 heading of the TOC block and add your own. Compatibility GeneratePress and Rank Math support. Works with popular AMP plugins. How to contribute SimpleTOC is open-source and developed on GitHub Pages. If you find a bug or have an idea for a feature please feel free to contribute and create a pull request. Credits Many thanks to Tom J Nowell and and Sally CJ who both helped me a lot with my questions over at wordpress.stackexchange.com And many more thanks to all the developers on GitHub who helped me making SimpleTOC what it is today! Thanks to Quintus Valerius Soranus for inventing the Table of Contents around 100 BC.