awsm.in

<p><strong>AccessMate</strong> scans your WordPress site for WCAG 2.1 AA accessibility issues, scores each page, and provides guided fixes — all from your WordPress dashboard.</p>
<p><strong>Zero running cost for you.</strong> AccessMate is 100% free. AI features (code fixes, plain-English explanations) use your own API key from Anthropic, OpenAI, Google Gemini, or a local Ollama instance. Your key is stored encrypted in your database and never proxied through our servers.</p>
<h4>♿ Core features</h4>
<p>✔  <strong>Accessibility scanner</strong> — checks 12 WCAG 2.1 AA rules on every page of your site<br />
✔  <strong>Score & grade</strong> — A–F accessibility score with POUR (Perceivable, Operable, Understandable, Robust) breakdown<br />
✔  <strong>Issue detail panel</strong> — shows the offending HTML, WCAG criterion, and affected element count<br />
✔  <strong>Issues by page</strong> — stacked bar chart showing critical/warning/notice counts per page<br />
✔  <strong>Visitor accessibility toolbar</strong> — minimal floating widget with 10 user-controlled accessibility features<br />
✔  <strong>AI auto-fix</strong> <em>(requires API key)</em> — generates corrected HTML for fixable issues<br />
✔  <strong>AI explanations</strong> <em>(requires API key)</em> — plain-English summaries for non-technical site owners</p>
<h4>12 WCAG rules checked</h4>
<ol>
<li>Images missing alt text (WCAG 1.1.1)</li>
<li>Colour contrast heuristic (WCAG 1.4.3)</li>
<li>Data tables missing headers (WCAG 1.3.1)</li>
<li>Missing landmark elements (WCAG 1.3.6)</li>
<li>Interactive elements not keyboard accessible (WCAG 2.1.1)</li>
<li>CSS animations without reduced-motion guard (WCAG 2.3.3)</li>
<li>Links with non-descriptive text (WCAG 2.4.4)</li>
<li>Skipped or empty heading levels (WCAG 2.4.6)</li>
<li>Focus indicator removed via CSS (WCAG 2.4.7)</li>
<li>HTML lang attribute missing (WCAG 3.1.1)</li>
<li>Form inputs missing label association (WCAG 4.1.2)</li>
<li>Invalid ARIA role attributes (WCAG 4.1.2)</li>
</ol>
<h4>Visitor accessibility widget features</h4>
<p>✔ Font size<br />
✔ High contrast<br />
✔ Dyslexia font<br />
✔ Grayscale<br />
✔ Reading guide<br />
✔ Pause animations<br />
✔ Line height<br />
✔ Large cursor<br />
✔ Highlight links<br />
✔ Screen mask</p>
<h4>AI providers supported</h4>
<ul>
<li><strong>Anthropic Claude</strong> (claude-haiku-4-5, claude-sonnet-4)</li>
<li><strong>OpenAI</strong> (gpt-4o-mini, gpt-4o)</li>
<li><strong>Google Gemini</strong> (gemini-1.5-flash, gemini-1.5-pro)</li>
<li><strong>Ollama</strong> (local, no key needed — llama3.2, mistral, phi3)</li>
</ul>
<h4>Privacy</h4>
<p>AccessMate makes no external requests unless you configure an AI provider and trigger an AI action. When an AI action is triggered, your WordPress server makes a direct request to your chosen provider using your key. No data passes through AccessMate servers. The API key is encrypted at rest using AES-256-CBC with your WordPress auth salt.</p>
<h3>Third Party Libraries</h3>
<ul>
<li><a href="https://github.com/dequelabs/axe-core" rel="nofollow ugc">axe-core</a> by Deque Systems — Mozilla Public License 2.0 (MPL-2.0)</li>
<li><a href="https://fontsource.org/fonts/opendyslexic" rel="nofollow ugc">OpenDyslexic font via Fontsource</a> — Bitstream Vera Fonts License — loaded on demand from jsDelivr CDN only when the dyslexia font feature is enabled by the visitor</li>
</ul>
<h3>External Services</h3>
<p>This plugin can connect to the following external services. No external requests are made unless you explicitly configure and trigger the relevant feature.</p>
<h4>AI providers (optional)</h4>
<p>When you add an API key and click an AI action (auto-fix suggestion, alt-text generation, or accessibility report summary), your WordPress server sends a direct HTTPS request to your chosen AI provider. The request contains the page HTML snippet and accessibility issue context being analysed. No data passes through AccessMate servers. These requests are only sent when you have entered an API key in Settings and manually trigger an AI action.</p>
<p><strong>Anthropic</strong> — <code>https://api.anthropic.com/</code><br />
Used for: AI fix suggestions, alt-text generation, accessibility report summaries.<br />
Data sent: page HTML snippet, accessibility issue context, and your Anthropic API key (in the request header).<br />
<a href="https://www.anthropic.com/legal/consumer-terms" rel="nofollow ugc">Terms of Service</a> | <a href="https://www.anthropic.com/legal/privacy" rel="nofollow ugc">Privacy Policy</a></p>
<p><strong>OpenAI</strong> — <code>https://api.openai.com/</code><br />
Used for: AI fix suggestions, alt-text generation, accessibility report summaries.<br />
Data sent: page HTML snippet, accessibility issue context, and your OpenAI API key (in the request header).<br />
<a href="https://openai.com/policies/terms-of-use" rel="nofollow ugc">Terms of Service</a> | <a href="https://openai.com/policies/privacy-policy" rel="nofollow ugc">Privacy Policy</a></p>
<p><strong>Google Gemini</strong> — <code>https://generativelanguage.googleapis.com/</code><br />
Used for: AI fix suggestions, alt-text generation, accessibility report summaries.<br />
Data sent: page HTML snippet, accessibility issue context, and your Gemini API key (as a URL parameter).<br />
<a href="https://ai.google.dev/gemini-api/terms" rel="nofollow ugc">Terms of Service</a> | <a href="https://policies.google.com/privacy" rel="nofollow ugc">Privacy Policy</a></p>
<p><strong>Ollama</strong> — <code>http://localhost:11434/</code> (local only)<br />
Ollama runs entirely on the user’s own machine or local network. No data is sent to any external server.</p>
<h4>jsDelivr CDN (visitor-facing, on demand)</h4>
<p>When a site visitor enables the <strong>Dyslexia Font</strong> feature in the accessibility toolbar, their browser loads the OpenDyslexic font stylesheet from jsDelivr. This is a standard browser-initiated HTTP request that includes the visitor’s IP address and User-Agent string. The font is cached locally after the first load; no further requests are made on subsequent pages. This request is triggered only by the visitor explicitly toggling the dyslexia font feature — it is never loaded automatically.</p>
<p><strong>jsDelivr</strong> — <code>https://cdn.jsdelivr.net/</code><br />
<a href="https://www.jsdelivr.com/privacy-policy-jsdelivr-net" rel="nofollow ugc">Privacy Policy</a></p>


AccessMate – AI Accessibility Scanner & Widget

AI-powered WCAG 2.1 AA accessibility scanner with auto-fix suggestions and a visitor-facing accessibility toolbar. Free — bring your own AI key.

LewisCowles

daronspence

<p>This short, handy plugin will add playback buttons to your audio, video & playlist elements added via the built-in WordPress shortcodes for media using mediaelement.js.</p>
<p>Each set of buttons is configured for it’s corresponding element on the page, so you can adjust the speed of multiple files independently.</p>
<p>There is currently no persistence implemented in this plugin. It just scratches an itch to be able to broadly adjust media playback speeds using the HTML api.</p>
<p>NOTE: This uses the HTML5 media Element API. Any browser not supporting these or using the Flash Player fallback will miss out on this functionality.</p>
<h4>Developers</h4>
<p>Two hooks are provided within this plugin.</p>
<ul>
<li>
<p><code>media-playback-speed-generate-controls</code> provides a single argument which is a boolean. If you return this as false, this will stop buttons being added to a media player. This is intended for advanced setups where markup for controls might be placed manually elsewhere on the page such as a sticky footer. So long as controls follow the built-in markup (being within the body tag and have a playback-rate-button class (no default styling, used for enabling DOM access only).</p>
</li>
<li>
<p>‘media-playback-speed-data’ provides the default array containing arrays as items with <code>rate</code>, <code>title</code> and <code>label</code> entries, which set the playback rate, the title and aria-title for the buttons as well as adjust the button text.</p>
</li>
</ul>
<h4>Theme & Front-end</h4>
<p>The <code>.playback-rate-button.mejs-active</code> and/or <code>.playback-rate-button.active-playback-rate</code> CSS-selectors allow you to style the active speed (per-player).</p>
<p>Initially mejs-active class was added in order to create media-playback-js compatible / familiar class names.</p>
<p>Now that Gutenberg does not add these, it makes sense to for-now add two sets of classes.</p>
<p>The <code>.playback-rate-button.mejs-active</code> selector will be deprecated in version 2.</p>
<h4>Troubleshooting</h4>
<p>This works with the traditional <code>audio</code>, <code>video</code> and <code>playlist</code> shortcodes so long as WordPress uses the JavaScript player.</p>
<p>With the latest 1.1.1 release this also works for HTML5 audio and video too, however you will need to implement your own controls which have the <code>playback-rate-button</code> class and follow the patterns of this.</p>
<p>HTML5 raw controls do not have a playlist the author is aware of, and they use global state, so playback rate is per-page.</p>
<p>There is currently no history as part of this plugin, however a sister plugin could be authored and hooks added to it to store playback rate.</p>
<p>Please ensure that you have no broken javascript, or wrap all functions in <code>(function() { // do things })()</code> blocks to ensure nothing interferes with this plugin. This plugin does this so that it should not interfere with your site, even in browsers and pages which do not support this plugin.</p>
<h4>Feedback</h4>
<p>Please feel free to <a href="https://github.com/CODESIGN2/media-playback-speed/issues" rel="nofollow ugc">suggest</a> improvements, report conflicts, and/or make suggestions for integration hooks etc.</p>


Media Playback Speed

Add speed controls to audio and video hosted from your WordPress blog.

AccessMate – AI Accessibility Scanner & Widget vs Media Playback Speed