Brizy Builder is committed to supporting accessibility best practices in line with the Web Content Accessibility Guidelines (WCAG 2.1). These guidelines ensure that websites are perceivable, operable, understandable, and robust (POUR) for all users, including those with disabilities.
Our goal is to provide tools that enable creators to design accessible websites. While Brizy includes several built-in accessibility features, ultimate compliance depends on how site owners apply these principles during the design and content process.
Web Content Accessibility Principles in Brizy
|
Perceivable |
|
|
Operable |
|
|
Understandable |
|
|
Robust |
|
Use these accessibility features
The Brizy builder provides these features to help you make your website accessible to all users, including those with disabilities.
Aria Labels for Icons
|
ARIA labels provide a clear, descriptive name for interactive elements that lack visible text, which helps users who rely on screen readers. In the icon element, click on the "Settings" icon and add an Aria Lebel in the side panel. |
Alt Titles for images |
For those who use screen readers and other assistive devices, an "Alt Title" gives a picture a text description that helps them grasp the image's content and purpose. In the image element, add an "Alt Title" in the styling panel under the "Advanced" tab. |
Title for Custom Audio |
Adding a descriptive title to an audio file helps users who use screen readers, understand the content of the audio and its purpose. This ensures that the audio content is understandable for everyone. When uploading a custom audio using the Brizy Builder, enable the "Title" option under the "Advanced" tab and provide a meaningful name to the audio file. Audio file name will be displayed as its Title. |
Captions for Custom Audio |
Adding captions to audio files help those who are hard of hearing to access and understand the content by providing a text equivalent of the spoken word and meaningful sounds. Captions also benefit a much wider audience by helping people with hearing difficulties, those learning the language, individuals in noisy or soundless environments, and even the general public who prefer to read along for better comprehension and focus. In the Brizy builder, along with a custom audio, you can upload a WebVTT file with .vtt extension. It is a text file that provides synchronized captions and subtitles for audio content. The file usually contains a transcript of the audio along with specific timecodes indicating when each piece of text should appear and disappear on screen. You could use online tool like https://www.happyscribe.com/subtitle-generator to generate the VTT file for your custom audio. When uploading a custom audio, kindly upload its WebVTT file under the "Advanced" tab. |
Captions for Custom Videos |
Adding captions to videos enable people who are hard of hearing to understand spoken content, and they benefit a wider audience by improving comprehension for those in noisy environments, non-native speakers, or when audio is off. Along with custom videos, you can upload a WebVTT file .vtt extension. It is a text file that provides synchronized captions and subtitles for video content. You can use an online tool like https://www.happyscribe.com/tools/add-subtitles-to-video to generate WebVTT file for your custom video. For guidelines, kindly refer to https://gotranscript.com/blog/how_to_create_a_web_vtt_file_for_your_videos In the Brizy Video element, kindly upload the WebVTT file under the "Player" tab |
Pause/Play option for Carousels |
Screen reader users may not be aware that a carousel is playing, or the information might be difficult to read at fast auto-play. A pause icon ensures they have enough time to access the content. The Brizy Pause/Play icon looks like this
This feature can be enabled for auto playing carousels by turning ON the "Stop Animation" toggle switch.
|
Detailed error messages on forms |
Users with disabilities, such as low vision, or color blindness, may not perceive errors conveyed by color or icons alone. Brizy form provides detailed messages for errors including specifying the required format for an email address. |
Zoom on Image Lightbox |
For users with low vision, the zoom feature helps them to enlarge an image and view the content more closely. When enabling the Lightbox for images, Brizy displays + and - zoom in and zoom out icons. Users can click on these icons to enlarge and shrink the image. |
Focus Indicators |
Focus indicator shows a user who navigates using the Tab key which element on a webpage is currently "in focus". in Brizy, a violet outline indicates the element in focus.
|
Design guidelines for web accessibility
According to the Web Accessibility Initiative by W3C at https://www.w3.org/WAI/tips/designing/, you must follow these guidelines while designing for web accessibility. As a designer of websites, it is your responsibility to ensure that both the design and the content are accessible. This includes getting your content, graphics, photos, and site structure ready making use of the accessibility features in the builder.
- Add meaningful alt titles to all images
- Use headings in logical order (H1 → H2 → H3)
- Ensure sufficient color contrast between text and background
- Avoid using color alone to convey meaning
- Provide clear labels for all form fields.
- Use headings and spacing to group related content
- Use descriptive link text (e.g., “View Pricing Plans” instead of “Click Here”).
- Test all pages with keyboard navigation.
- Provide captions/transcripts for audio and video content.
- Provide clear and consistent navigation options
- Ensure that interactive elements are easy to identify
Built in Accessibility widget
In addition to the accessibility features and compliance standards built directly into Brizy’s codebase and editor, we’ve also included an optional Accessibility Widget that can be enabled or disabled as needed.
This widget appears on the published website and provides visitors with disabilities tools to customize their browsing experience in real time. It includes helpful options such as adjusting color contrast, enabling reading focus, enlarging text, and more, ensuring that websites built with Brizy are inclusive and easy to navigate for all users.
The widget comes turned OFF by default and can be turned on from the General website settings in the editor:
Here is how it looks on the website:
Keep this in mind
While Brizy complies with WCAG 2.1 AA guidelines, keep this in mind:
- Custom ARIA role assignment is not fully exposed in the editor. No need to add an aria-label attribute if the text is clear and visible, as browsers automatically infer the accessible name from the element’s content or value
- Content provided by third-party embeds (e.g., YouTube, iFrames, custom code) may not always meet accessibility requirements and this is out of Brizy's control.
- Site owners are responsible for ensuring that their written content, media, and custom code follow WCAG standards.
Brizy’s Compliance
Brizy is committed to improving accessibility and aligning with WCAG 2.1 AA standards. We regularly review our features to enhance inclusivity and provide resources to our customers for building accessible websites. For questions, suggestions, or to report accessibility issues, please contact our support team at support@brizy.io