If you've reached this guide, it's likely because you encountered the "Accessibility Screen-Reader Guide, Feedback, and Issue Reporting" button on a website. This guide is for blind or low-vision individuals, focusing on utilizing accessWidget, one of accessiBe’s web accessibility tools. This guide doesn't intend to teach you how to use your screen reader, as most users who utilize screen readers daily already possess this skill set. Here's what you can expect from this guide:
- Practical tips and suggestions for visiting websites with accessWidget.
- Instructions on enabling or disabling accessWidget at any point.
- An explanation of what occurs on websites when accessWidget is active and how it impacts your screen reader.
- How to report issues, provide feedback, or get assistance.
Turning On/Off and Using accessWidget
Upon entering a website with accessWidget installed, your screen reader will announce a message, such as “Press Alt+1 (Windows) / Option+1 (MacOS) For Screen Reader Mode, Alt+0 (Windows) / Option+1 (MacOS) to Cancel” or “For screen reader mode, press the first button of the website.” The message will vary depending on your browser window size and the type of device you are using (desktop, mobile, or tablet). Here is what these messages mean:
- Alt+1 (Windows) / Option+1 (MacOS) Message - A chime will sound a second or two after hitting this keyboard combination, indicating you are now in screen reader mode.
- First Button Message - the “first button of the website” is a button labeled “Use Website In Screen-Reader Mode” and should be accessible at the very start of the webpage. This is a toggle button that you can use anytime to switch screen reader mode on or off.
Both actions (alt/option+1 or using the first button) activate “Screen Reader Mode.” Before explaining what "Screen Reader Mode" entails, here are a few keyboard combinations you can use to turn this mode on and off at any time:
- Alt+1 (Windows) / Option+1 (MacOS) – Activates screen reader mode.
- Alt+8 (Windows) / Option+8 (MacOS) – Deactivates screen reader mode. Note that the page will refresh, and the website will still read the alert message and provide the screen reader mode button.
- Alt+0 (Windows) / Option+0 (MacOS) – Turns off screen reader mode and stops announcing its availability. This also refreshes the page. To reset the functionality and make screen reader mode available again, use Alt+0 (Windows) / Option+0 (MacOS).
- Alt+9 (Windows) / Option+9 (MacOS) – Opens an accessibility widget, which offers options for users with different disabilities to customize the website to their needs. This includes increasing font size, stopping animations, changing color contrasts, and more. Use the Escape key (or the close button) to close the widget after opening it.
What Happens and What Doesn’t, When “Screen Reader Mode” is Activated
First and foremost, by enabling "Screen Reader Mode," you WILL NOT be tracked, and your privacy will not be compromised. We do not track any user, we do not collect any data about you, and we do not share any other personal information about you with any third party for any purpose. The only information we collect is how many times accessWidget’s features have been activated; this information is not associated with any user, IP address, or anything else which might be used to identify a specific user. Furthermore, accessWidget does not make use of cookies, so even other popular trackers on websites such as Facebook or Google Analytics cannot associate you with the activation of screen reader mode. To ensure your selection is saved for your subsequent browsing sessions on this website, we use local storage instead of cookies. Technically, it is not possible to read data from local storage on any server, be it ours or a third party's, intentionally or unintentionally. The last point on this topic is about the alert message you hear: it IS NOT a detection of your screen reader. Rather, it is an audible alert message that every website visitor receives, regardless of whether they have a screen reader or not. However, if they do not have a screen reader, they will not hear it. We do not detect screen readers.
When Screen Reader Mode is activated, you will observe many changes to the website that were not present prior to activating the mode. These changes occur because the fundamental code of the website has been significantly modified to be more accessible to your screen reader. This transformation is made by adhering to WCAG guidelines and implementing changes related to usability to make the website work better for assistive technology. This process, which includes both monitoring and remediation, is ongoing and occurs on a daily basis. This ensures that even if the website undergoes changes or updates, these will become accessible almost immediately. Please note that these changes do not create a different experience or a version of the website. You will be using the exact same website but with code changes that make it more accessible.
When Screen Reader Mode is activated, you can expect to observe the following modifications:
- Skip Links: Multiple skip links will be available as buttons at the very beginning of every page. These buttons allow you to jump to different page sections, such as the main content, the menu, or the footer. Alternatively, you can access these skip links by pressing Alt+2 on your keyboard regardless of your location on the page.
- Dropdown and Submenus: These should now be detectable by your screen reader. Typically, even when navigation regions are recognized, screen reader users might overlook the existence of additional submenus and dropdown menus, which often provide a broader set of navigational options for users. The sub-menus should now work with your screen reader.
- Alternative Text for Images: Images that previously lacked alternative text should now have it included. This alternative text is created based on the objects within the image, a description of the situation depicted, and any text embedded within the image. For example, a banner showing a Toyota vehicle on the move with a text offering a 20% discount would have an alt text along the lines of "20% OFF, BUY NOW, Toyota Camry driving on the road during daytime." Please note that we respect and retain the alt text added by the website authors themselves and do not replace existing alt text unless it is clearly an error, such as a random string of characters or the image's file name.
- Automated Carousels: Automated carousels should now pause and expose operational controls for your screen reader. These carousels will also be labeled as "Carousel Regions," allowing you to identify them easily.
- Icon Descriptions: Icons that were previously without a proper description should now have a screen-reader-compatible textual description to explain their functionality. This alteration makes icons such as a cart, search, login, close, next, previous, wishlist, and social channels, among others, more accessible to your screen reader if they exist on the page and don't already include appropriate text.
- Region Identification: The page has been altered to now include multiple distinct regions, intended to ease your navigation. These regions include the main content area, various navigation regions, footer (also known as "content info"), header regions, and others.
- Links and Buttons Differentiation: Your screen reader should now be able to distinguish between links and buttons. In cases where a link acts as a button or a piece of text functions as a button, which previously may not have been read as such by your screen reader (typically due to misuse of HTML tags), such elements should now be correctly identified by your screen reader as buttons.
- Expanded Descriptions for Ambiguous Links: Links that were previously empty or ambiguous, such as "read more," "learn more," "shop now," and other similar variations, should now have expanded descriptions. These descriptions will provide more context about what you'll learn more about or what you'll be shopping for when you use these links.
- Descriptive Labels for Form Fields: Form fields that previously lacked an associated label should now be read to you by your screen reader with a descriptive label, such as "email address," "full name," etc. In addition, the screen reader will also convey any necessary information, such as whether the field is required or if the data entered is invalid.
- Ordered Headings: When using Screen Reader mode, the headings on the page should now be arranged according to their level of importance. The most significant topics on the page will be given a higher heading level (heading level 1, 2, etc.), going up to heading level 6 for the less important topics on the page. You might also notice an increased number of headings compared to browsing without Screen Reader mode. This happens because websites often use visual headings that aren’t coded as such and therefore aren't recognized as headings by screen readers. With Screen Reader mode, these headings will be detected by screen readers.
- Popups and Modal windows: Popups and models on the site should now be accessible and should not break your browsing session. When a popup emerges (which can sometimes appear unexpectedly), your screen reader focus will automatically shift to the popup, enabling you to interact with it using the arrow and tab keys. Please note that you won't be able to interact with other parts of the website until you close the popup. You can do this by using the close button or pressing the Escape key while the popup is active.
- Other Alterations: There are many other changes that you may observe with the Screen Reader mode, including in tables, iframes, text decorations, ratings, and many other features. Including every detail here would make the article excessively lengthy, but if you have any questions or need additional information, please feel free to reach out to us using the contact information provided below.
Additionally, it's important to understand that there are certain limitations to the Screen Reader Mode, and it may not be able to address some elements, including:
- Some iframes: These are essentially third-party websites embedded within other websites, and it's technically impossible to alter their code directly.
- PDF files: Screen Reader Mode doesn't automatically remediate these files as they are not a part of the source code of the web page.
- Third-party integrations, services, or websites featured on the website: We may not be able to alter or adjust these elements.
- Faulty manual accessibility implementations: If a website has made manual, intentional accessibility efforts, we will respect these and will not override them.
- Image context: Images that lack alt-text by the website operators will receive alternative text using AI. This includes the image's text (with OCR), objects, and scenery. However, these descriptions could sometimes be generic and lack the exact context the website's operators wanted to convey.
Whenever we detect any of these issues on a website, we endeavor to bring them to the website owners' attention as swiftly as possible and address them using different means.
Lastly, if you encounter any issues on a website using Screen Reader Mode or any of the aforementioned features don't function as described, we kindly ask you to notify us so we can rectify the situation. You can email us directly at [email protected]. Please note that it may take us some time to process messages and conduct thorough technical reviews, but rest assured that this is an interactive inbox, and your queries won't be left unaddressed. We greatly appreciate your patience and cooperation.