Keywords: UserWay; Accessibility; Accessibility Widget; High Contrast; Dyslexia Friendly
Overview
Accessibility is an important part of creating a positive experience for everyone using Better Impact. To support this, we’ve added the UserWay Accessibility Widget, a tool that helps make the system easier to read, navigate, and interact with for people with different accessibility needs.
When enabled, the UserWay icon appears in the bottom-right corner of your screen. Clicking it opens a menu with a variety of tools that can adjust the appearance and behavior of the page—such as contrast, text spacing, font style, and more—to improve readability and accessibility.
Even if you don’t turn on any specific settings inside the widget, having it enabled still helps screen readers and other assistive technologies interact more effectively with Better Impact.
The goal of UserWay is to make Better Impact more inclusive, user-friendly, and accessible for all administrators and volunteers.
Note: This feature is only available in certain packages. Contact Better Impact Support to learn more about availability for your organization.
This tool allows each person to adjust the interface in ways that best suit their needs, making Better Impact more inclusive and user-friendly.
UserWay – Features & Tools
Once enabled, the UserWay Accessibility Widget appears as a small icon in the bottom-right corner of your screen. Clicking it opens a menu with several accessibility options that improve readability and navigation.
Language
This controls the language the userway widget is rendered in. It will default to match the page language, where possible (which would be the language the user has set in their "Region" setting)
This does NOT translate the page or any content outside of the widget.
Accessibility Profiles
This allows the user to select from a variety of pre-set setting combinations tailored to the specific disability.
Oversided Widget (XL)
Makes the widget bigger and easier to use for users with low visible or limited motor skills.
Screen Reader
Built in screen reader to read the page, you can choose slow, medium or fast reading.
Contrast +
Adjusts the color scheme of the page. There are three options:
Invert Colors – Flips darks to lights and lights to darks.
Dark Contrast – Makes the page mostly dark with high contrast.
Light Contrast – Makes the page mostly light with high contrast.
Smart Contrast
Uses algorithms and AI to dynamically adjust the background and foreground colours of elements to maintain an accessible contrast ratio.
Highlight Links
On/Off toggle.
Highlights links with black text on a yellow underline for better visibility. (Note: This can look visually “loud” or unconventional.)
Text Spacing
Three levels: Light, Moderate, Heavy.
Increases the horizontal space between letters to improve readability (does not affect line height).
Pause Animations
Two options: Pause Animations / Play Animations.
Reduces motion on certain elements, such as image galleries or embedded animations.
Does not stop all movement entirely.
Hide Images
Two options: Enabled / Disabled.
Hides most images, including icons, banners, and images embedded in content.
Warning: This may make the interface harder to use since it hides visual buttons and icons.
Dyslexia-Friendly / Legible Fonts
Three states:
Off
Dyslexia-Friendly – Changes fonts to a custom UDF font developed for easier reading.
Legible Fonts – Replaces difficult-to-read fonts (like decorative or script fonts) with standard, clear fonts like Arial.
Cursor Tools
Big Cursor – Enlarges the cursor for better visibility.
Reading Mask – Highlights a horizontal band of the page while greying out the rest, helping to focus on one line at a time.
Reading Guide – Displays a line with an arrow that follows the cursor, helping track text in tables or long lists.
Page Structure
Pops up a dialog with 3 different tabs, to help users navigate the page. Headings, Landmarks, and Links.
Clicking the element in this dialog will bring the user to it.
Line Height
Three options: 1.5x, 1.75x, 2x.
Increases vertical spacing between lines for improved readability.
Text Alignment
Four options: Align Left, Align Right, Align Center, Justify.
Changes text alignment, mostly noticeable in tables and lists. (Can sometimes disrupt layout.)
Dictionary
When enabled, highlighting text will then popup a dictionary definition of the word(s).
Saturation
Three options: Low, High, Desaturate.
Adjusts color intensity:
Low – Colors are darker and less vivid.
High – Colors are brighter and more vivid.
Desaturate – Colors appear mostly grayscale.
Reset All Accessibility Settings
Resets all UserWay settings back to default/off.
___________________________________
Notes & Considerations:
Using multiple settings at once can sometimes make the application hard to use or visually “messy.”
Settings persist across different accounts and interfaces as long as the widget is enabled in that browser.
How to Turn On the UserWay Widget
The widget is optional and can be enabled per user. Settings are stored in your browser, so:
You’ll need to enable it on each browser or device you use.
If browser data is cleared, the widget will need to be re-enabled.
Admin and volunteer views are separate, so enabling it in one does not affect the other.
In the Admin Portal:
Click My Profile in the top-right menu.
Select Customization Preferences.
Under General Settings, toggle on Accessibility Tool.
The widget will now appear at the bottom-right of your screen.
____________________________________________
In My Impact Page (volunteer portal):
Go to My Profile → Contact Information.
In the Accessibility section, toggle on Accessibility Tool.
____________________________________________
In My Impact Page Mobile or App:
Go to My Profile → Preferences.
Toggle on Accessibility Tool.
By enabling the UserWay widget, you’re helping make Better Impact more accessible and inclusive for everyone.