What Is WBAG?

WBAG (Website Builder Accessibility Guidelines) is a practical framework designed by DAPEN.org to help websites achieve strong accessibility compliance using modern website builders. It focuses on simple, high-impact actions that prevent the vast majority of accessibility-related legal issues — while improving usability for everyone.

‍

Digital Accessibility Protection with WBAG Certified

If you’d like complete peace of mind, DAPEN.org offers WBAG Certified, a program where our accessibility experts will make your entire website fully WBAG compliant and assume all legal responsibility for its digital accessibility.
‍
This means that if your website ever faces an accessibility-related demand letter, lawsuit, or settlement, DAPEN.org will handle all attorney fees, court costs, and payouts — protecting your business from financial and legal risk while ensuring your website remains inclusive and compliant.

‍

WBAG: Website Builder Accessibility Guidelines

These are the core accessibility actions every website should follow to drastically reduce the risk of lawsuits and create an inclusive digital experience.

1. Page Structure & Headings

• Every page must have one single <h1> that clearly describes the page’s main topic.
• Use headings in order: <h2> for sections, <h3> for subsections — never skip levels.
• Don’t use headings just for visual size; use them to organize content meaningfully.

2. Text Alternatives (Alt Text)

• Every image that conveys meaning must have a short, descriptive alt text (e.g., “Man holding a coffee mug in office”).
• Decorative images (purely visual, no information) should have empty alt text (alt="").
• Don’t include “image of” or “photo of” — screen readers announce that automatically.

3. Color & Contrast

• Text should have at least 4.5:1 contrast ratio against the background.
• Don’t rely on color alone to communicate meaning (e.g., red = error). Use icons or text as well.
• Avoid placing light gray text on white backgrounds.

4. Keyboard Navigation

• Users must be able to navigate your site fully using a keyboard (Tab, Shift+Tab, Enter, and Arrow keys).
• Ensure focus indicators (visible outlines around selected links/buttons) are not removed.
• Avoid “hover-only” menus or popups that can’t be opened with the keyboard.

5. Links & Buttons

• Every link and button should have clear, descriptive text (“View Menu” instead of “Click Here”).
• Avoid duplicate links with the same text that lead to different destinations.
• Make sure all buttons perform an actual action — no dead or placeholder buttons.

6. Forms & Labels

• Each input field (name, email, phone, etc.) must have a visible label or an ARIA label.
• Provide error messages that explain what went wrong (“Please enter a valid email”).
• Don’t rely on color alone to show required fields — use an asterisk (*) or label note.

7. Multimedia (Video & Audio)

• All videos must have captions.
• Provide transcripts for podcasts or audio content.
• Avoid autoplaying media — if autoplay is necessary, it must be muted and easy to pause.

8. Language & Readability

• Set a page language in your builder settings (usually in the page settings under “HTML lang”). Example: lang="en".
• Write in clear, plain language. Avoid jargon or overly complex sentences.
• Use lists, headings, and short paragraphs to make content easy to scan.

9. Popups, Modals & Dynamic Elements

• Ensure all popups or modals can be closed using the Escape key.
• When a popup opens, trap focus inside it so keyboard users don’t tab away accidentally.
• Don’t trigger automatic popups on page load unless required (like cookie banners).

10. Responsive & Zoom Accessibility

• The website must remain readable and usable when zoomed to 200%.
• Test your site on desktop, tablet, and mobile — no text or buttons should be cut off.
• Avoid layouts that break when resized.

11. Skip Navigation & Repetitive Elements

• Add a “Skip to main content” link at the top for keyboard and screen reader users.
• Keep navigation consistent across pages.
• Avoid moving or flashing elements unless essential (limit motion to reduce seizures or distractions).

12. Error Prevention & Feedback

• Before submission, forms should show confirmation or review steps for critical actions (like payments or forms).
• Provide clear feedback after users take actions (e.g., “Your message has been sent”).
• Avoid unexpected changes like automatic redirects or new windows opening without warning.

13. Accessible PDFs & Downloads

• Any downloadable file (PDF, DOCX, etc.) must also be accessible: tagged structure, searchable text, and alt text for images.
• Avoid uploading scanned images as “PDFs” — use text-based versions.

14. Accessibility Statement

• Include an Accessibility Statement page that explains your commitment and provides contact info for reporting issues.
• Example: “If you experience any difficulty accessing our site, please contact support@yourdomain.com.”

15. Regular Testing

• Test your site with:
  • Keyboard only (no mouse)
  • Screen reader (e.g., NVDA, VoiceOver)
  • Accessibility checker tools (WAVE, SiteImprove, or DAPEN’s WBAG audit)
• Review after every major update or design change.

‍

Want to Make It Easy?

If you’d rather not handle accessibility yourself, a DAPEN.org Accessibility Developer will make all WBAG changes to your website for free when you apply for WBAG Certification.
‍
WBAG Certified means your website is brought into compliance under this framework, and DAPEN.org assumes full legal responsibility for your digital accessibility.

👉 Get WBAG Certified Today → Get WBAG Certified