
內容簡介
Rayetun Accessible Blocks & Accessibility Toolkit 是一款結合可存取區塊與網站可存取性檢查工具的外掛,旨在提升網站的無障礙性,符合 WCAG 2.2 Level AA 標準,並提供詳細的可存取性報告。
【主要功能】
• 提供多種可存取區塊,如模態框、滑動條和表格
• 內建可存取性工具包,包含即時檢查與報告功能
• 支援鍵盤操作與螢幕閱讀器的互動元件
• 提供圖片替代文字審核與批次編輯功能
• 無需升級提示,所有功能皆可使用
外掛標籤
開發者團隊
② 後台搜尋「Rayetun Accessible Blocks & Accessibility Toolkit」→ 直接安裝(推薦)
原文外掛簡介
Rayetun Accessible Blocks combines two things in one plugin: accessible blocks, and a toolkit for checking and improving the accessibility of your whole site.
Accessible blocks. Interactive components — modals, sliders, tables, mega menus, carousels, before/after, and more — built to be keyboard-operable and screen-reader-correct against WCAG 2.2 Level AA, each with a published Accessibility Conformance Report you can hand to a compliance team.
An accessibility toolkit. An accessibility panel in the editor as you write, a site-wide axe-core scan with a dashboard and trend history, a front-end inspector that outlines problems on the live page, an image alt-text audit and bulk editor, readability and contrast help, scheduled email summaries, and an exportable accessibility report.
Every feature described here is included in the plugin — there are no locked panels or upgrade prompts. A separate add-on aimed at agencies (managing many client sites from one place, branded client reports, and the like) may follow later; it would only add to what is already here.
How Rayetun Accessible Blocks is organised
Accessible by default — WCAG 2.2 AA is the definition of done, not a setting you switch on
Local first — scan results, findings, and settings live in your own database; nothing is sent anywhere
Built on core APIs — the WordPress Interactivity API, Block API v3 (block.json), and server-side rendering. No jQuery, no framework runtime; each block’s script loads only where it’s used
Honest by design — it fixes markup, it never masks problems with an overlay, and it makes no compliance claim on your behalf
🧱 The Blocks
🪟 Modal — built on the native
/
, with the star rating exposed to screen readers as “Rated 5 out of 5” rather than five unlabelled symbols.
🗣️ Testimonials — lay out Testimonial items as a grid or carousel: choose how many show per view, with prev/next, dot pagination, and arrows below or on the sides.
🛍️ Product Card — a product card in three presets (Standard, Horizontal, Overlay). The title is a real heading, the image has proper alt text, a sale is announced as “Original price … Sale price …”, and each button’s name includes its product so identical “View product” links stay distinct. Author-populated — no WooCommerce needed.
🎠 Products — lay out Product Cards as a grid or a carousel. Grid wraps into rows (choose how many per view, per breakpoint). Carousel is a genuine scroll region — labelled, keyboard-scrollable, nothing hidden — with prev/next buttons, dot pagination, and arrows below or on the sides.Both carousels respect prefers-reduced-motion, and every dot and arrow meets the WCAG 2.2 24×24px target-size minimum.
🎛️ Works on Every Block
These apply to any block — ours or WordPress’s own.
👁️ Conditional Display
Show or hide any block by login state or user role. Hidden blocks are removed on the server, so screen readers, search engines, and feeds all see the same page a visitor does — not content hidden with CSS that assistive tech still reads out.
A note on Conditional Display: it controls presentation, not access. Hidden text still exists in the post, so it can surface in site search or an export. It’s stronger than CSS-hiding and weaker than a membership plugin — please don’t use it to protect genuinely private content.
✨ Motion
Entrance animations, parallax, and sticky positioning on any block. Every effect is skipped entirely for visitors who ask their system for reduced motion, and the code loads only on pages that actually use it.
🔍 In-Editor Accessibility Checker
Every block this plugin adds gets an “Accessibility” panel that checks its setup as you build, and shows a clear all-clear when it’s right.Flags what only the block author can fix — a dialog that only the Escape key can close, a table with no caption, a slide with no content, auto-advance set too fast, a control colour pairing below the contrast minimum
Reading-level readout — an advisory Flesch–Kincaid estimate over your prose (WCAG 3.1.5). Advisory only: it never gates or fails anything
Stays in its lane — interactive configuration, so it complements full-content checkers like Block Accessibility Checks rather than duplicating them📊 Site-Wide Accessibility Scan
An Accessibility screen in wp-admin scans your published pages with axe-core against WCAG 2.2 AA and keeps the results.Site-wide totals — errors, warnings, and dismissed findings, with a severity breakdown
Worst-first page list — see which pages need attention, with per-finding detail and the offending markup
Dismissed-issues log — dismiss a finding with a written reason; it’s kept with a timestamp, never silently dropped
Admin status column — accessibility status next to each page in your post list
Uncapped counts — totals are computed across the whole site, never a capped page, so nothing is quietly under-reported🖍️ Front-End Inspector
The same checks, on the live rendered page — for logged-in editors only.In-context outlines — each flagged element is boxed where it actually sits, with a popover explaining the problem
Contrast fix suggestions — for a colour-contrast failure, it computes the nearest passing colour (nudged toward black or white, whichever changes it least) and offers it with a swatch. A suggestion, never an automatic change
Never shown to visitors — gated on a real capability check in PHP, not just hidden with CSSThis is the opposite of an accessibility overlay. It changes nothing a visitor sees; it shows problems to the person who can fix them.
📧 Scheduled Email Reports
Have a summary of your accessibility findings emailed to you weekly or monthly. Off by default; you choose the address.
The email reports your last stored scan — it does not run a new one, because a real scan needs a real browser to render your pages. The email says so itself, and the settings screen tells you when the last scan actually ran.
📋 Accessibility Conformance Reports
Each block ships a published ACR documenting how it meets each relevant WCAG 2.2 AA success criterion, the testing environment, and any known limitations — including defects found and fixed during screen-reader testing.
Each block has been tested with a real screen reader (NVDA + Firefox), and its report records the testing environment along with any defects found and fixed during that testing.
🧭 What Rayetun Accessible Blocks Will Not Do
Worth stating plainly, so you know what to expect:❌ No overlay or accessibility widget — no floating toolbar, no “profiles” for blindness or dyslexia. Rayetun Accessible Blocks fixes the underlying markup rather than layering a widget over it
❌ No compliance claim — no plugin can make a site ADA or EAA compliant, and Rayetun Accessible Blocks does not claim to
❌ No auto-fix of your content — the inspector suggests; you decide. Silent rewrites hide problems instead of solving them
❌ No data collection — no telemetry, no phone-home, no accountAutomated checks are a floor, not a certificate. They catch a portion of WCAG failures; the rest needs a keyboard and a screen reader. A clean scan does not mean a page is accessible, and Rayetun Accessible Blocks says that on the dashboard itself.
Compatible WithBlock themes and classic themes — blocks inherit your theme’s colours, spacing, and typography via theme.json/global styles
WordPress core Navigation block (Mega Menu inserts inside it)
Block Accessibility Checks and other full-content checkers — complementary, not overlapping
Any standard block editor workflow — no page builder requiredExternal Services
Rayetun Accessible Blocks itself sends no data anywhere. Scan results, findings, and settings are stored only in your own WordPress database. There is no telemetry, no account, and no phone-home.
One block can embed third-party video — and only then, and only for a visitor who chooses to watch:
YouTube / Vimeo — Video Popup block (only when a visitor plays a video)
When you set a YouTube or Vimeo URL on a Video Popup block, the player is requested from that provider only when a visitor opens the popup, never on page load. At that point the visitor’s browser contacts YouTube (through the privacy-friendly youtube-nocookie.com domain) or Vimeo (with Do Not Track requested) to stream the video.
Data sent: the visitor’s IP address and their playback interactions, sent by their own browser to the provider.
Sent when: only when a visitor opens a Video Popup that points at a YouTube or Vimeo URL. A self-hosted video file, or a popup no visitor opens, contacts no external service.
Service URL: https://www.youtube.com — https://vimeo.com
Terms of Service: https://www.youtube.com/t/terms — https://vimeo.com/terms
Privacy Policy: https://policies.google.com/privacy — https://vimeo.com/privacy
Video thumbnail import (optional, editor-initiated)
If you use the Video Popup block’s optional “Use video thumbnail” button in the editor, your site fetches the poster image from the provider once, server-side, and saves it to your Media Library. The poster is then served from your own site, so visitors’ browsers do not contact the provider on page load. This request happens only when you click that button.
Development
Rayetun Accessible Blocks is open source and built with the official @wordpress/scripts toolchain (webpack). The complete, unminified source — every block, the editor checks, and the dashboard — ships in the plugin’s src/ directory; the files in build/ are compiled from it. Nothing is obfuscated.
To build from source:
npm install && npm run buildThat regenerates everything in build/. npm test runs the unit suite. No build step is needed to use the plugin — the compiled output is included.
Credits
Rayetun Accessible Blocks bundles axe-core by Deque Systems, Inc., which powers the accessibility scan. axe-core is licensed under the Mozilla Public License 2.0 (MPL-2.0); its copyright and license notice are preserved in build/axe.min.js. Everything else is original work under GPL-2.0-or-later.延伸相關外掛
