Accessibility App

The Accessibility App delivers seamless, customizable accessibility for your dashboards without touching the source code– maintaining your load times and performance. Visual, content, and orientation adjustments allow you to meet users’ unique needs. AI leverages contextual understanding and visual analysis to handle complex requirements—like making your dashboards fully navigable by keyboard and compatible with screen readers.

The Accessibility App ensures your dashboards are WCAG2 and ADA compliant, ensuring every visitor can access your analytics— with confidence.

Notion image
Notion image
ℹ️

The Accessibility App does not edit, modify, or override prior accessibility adjustments that were made on the site since it takes into consideration that if you've manually implemented a feature, there was a reason for it.

Installation and configuration

The Accessibility App plugin can be installed by an Admin, following the directions in Installing QBeeQ Plugins.

Operating system and version support:

  • Linux - L2022.1 / Latest
  • Windows - V8.2.5 / Latest

You can easily customize the appearance and behavior of the accessibility icon - such as its position, color, and size. The Accessibility App uses config.js file which controls the global behavior of the Accessibility App across your entire Sisense instance.

Note that you do not have control or add or remove any of the accessibility features themselves. All profiles and adjustments will be displayed to all users.

To locate this file:

  1. Go to the Admin tab > App Configurations > File Management
  1. Continue to the plugins folder > QBeeQAccessibility folder > select the config.js file

You can edit the file's code directly in the user interface. Once you've completed your edits, a script will be generated specifically for your site.

const exportSettings = {
  paperFormat: "A4",
  paperOrientation: "portrait",
  preview: true,
  elasticubeBuiltValue: "string",
  layout: "asis",
  showDashboardTitle: true,
  showDashboardFilters: true,
  showDatasourceInfo: true
};

const acsbConfig = {
  statementLink: '',
  footerHtml: '',
  hideMobile: false,
  hideTrigger: false,
  disableBgProcess: false,
  language: 'en',
  position: 'right',
  leadColor: '#146FF8',
  triggerColor: '#146FF8',
  triggerRadius: '50%',
  triggerPositionX: 'right',
  triggerPositionY: 'bottom',
  triggerIcon: 'people',
  triggerSize: 'small',
  triggerOffsetX: 20,
  triggerOffsetY: 20,
  mobile: {
    triggerSize: 'small',
    triggerPositionX: 'right',
    triggerPositionY: 'bottom',
    triggerOffsetX: 20,
    triggerOffsetY: 20,
    triggerRadius: '20'
  }
};

exportSettings={}

You can customize the export to PDF behavior when any accessibility feature is enabled.

ℹ️

The Accessibility App does not make PDF files on the site accessible since they are not part of the source code. The Accessibility App only applies accessibility to the site itself

Setting
Description
Value/Example
paperFormat
Specifies the paper size used for rendering the report or export
Example: "A4" , “Letter”
paperOrientation
Sets the orientation of the paper
"portrait" (vertical) "landscape" (horizontal)
preview
Determines whether the output should be shown as a preview before final export or rendering
elasticubeBuiltValue
layout
Specifies how the dashboards are rendered. Note: Dashboards rendered this way have a different layout to dashboards displayed in the application
"as is" - Reporting layout "feed" - Each widget in it's own line
showDashboardTitle
Controls whether the dashboard title should be displayed in the output.
true false
showDashboardFilters
Controls whether dashboard-level filters should be visible in the export
true false
showDatasourceInfo
Controls whether information about the data source should be shown
true false
customDashboardFilters

acsbConfig={}

You can customize the Accessibility App’s visual appearance, positioning, and behavior by updating the settings below.

Setting
Description
Value/Example
statementLink
Link to your custom accessibility statement. If left blank, the default statement will be used.
"https://example.com/accessibility"
footerHtml
Text or HTML that appears in the widget footer — great for adding your company name or branding
"<p>© 2025 Acme Inc.</p>”
hideMobile
Show or hide the accessibility button on mobile devices
true false (Default)
hideTrigger
Hide the accessibility trigger button completely. Use when triggering the widget programmatically.
true false (Default)
disableBgProcess
(Optional) Disable background processes like AI-powered screen reader enhancements or continuous scans.
true false (Default)
language
Sets the language of the widget UI. Choose from a set of supported languages.
Language code string Example: "en"
position
Position of the widget on the screen
"left" "right"
leadColor
Primary color of the widget interface
Hex color code "#0057FF"
triggerColor
Color of the accessibility trigger button
Hex color code "#00000F"
triggerRadius
Shape of the trigger button, controlled by border radius
"0" - Square "5px" - Squircle Small "10px" - Squircle Big "50%" - Round
triggerPositionX
Horizontal placement of the trigger button
"left" "right"
triggerPositionY
Vertical placement of the trigger button
"left" "right"
triggerIcon
Icon displayed on the accessibility button. Choose from a predefined set of icons.
String (Icon ID) Example: "settings2"
triggerSize
Size of the accessibility button
"small" "medium" "big"
triggerOffsetX
Custom horizontal offset from screen edge. Useful for fine-tuning button placement.
Integer or pixel value Example: 20 or "20px"
triggerOffsetY
Custom vertical offset from screen edge. Useful for fine-tuning button placement.
Integer or pixel value Example: 50 or "50px"

Supported languages and codes

The Accessibility App supports 22 languages natively. You can include one or more languages, separating each with a comma.

Language
Code
English
en
Español
es
Deutsch
de
Português
pt
Français
fr
Italiano
it
עברית
he
繁體中文 (Taiwan)
zh-TW
Русский
ru
العربية (Jordan)
ar-JO
العربية (UAE)
ar-AE
Nederlands
nl
繁體中文 (China)
zh-CN
日本語
ja
Polski
pl
Türkçe
tr
Čeština
cs
Magyar
hu
Slovenščina
sl
Slovenčina
sk
Norsk Bokmål
nb
Svenska
sv

Predefined Icon Set

The Accessibility App has a library of icons that can be used as values for the triggerIcon.

Icon Values & Examples
  • display
  • display2
  • display3
  • help
  • people
  • people2
  • settings
  • settings2
  • wheels
  • wheels2
    • Notion image
 

mobile{}

Use the following settings to control how the accessibility trigger button appears and behaves on mobile devices. These settings are only relevant when hideMobile is set to false.

 
Setting
Description
Value/Example
triggerSize
Sets the size of the accessibility button on mobile
"small" "medium" "big"
triggerPositionX
Determines the horizontal position of the button on mobile screens.
"left" "right"
triggerPositionY
Determines the vertical position of the button on mobile screens
“top” ”center” ”bottom”
triggerOffsetX
Sets how far the button is from the left or right edge of the screen (depending on triggerPositionX)
Number or pixel string Example: 20 or "20px"
triggerOffsetY
Sets how far the button is from the top or bottom edge of the screen (depending on triggerPositionY)
Number or pixel string Example: 20 or "20px"
triggerRadius
Defines the shape of the trigger button using CSS border-radius
"0" - Square "5px" - Squircle Small "10px" - Squircle Big "50%" - Round

Performance

The Accessibility App does not interfere at all with a site’s source code and works through the use of JavaScript code that will only change the code on the browser level of an end-user.

The Accessibility App loads asynchronously, meaning that the browser does not wait for it to load to show your site or allow visitors to take action. Therefore the Accessibility App does not affect site loading times or the site optimization score.

Using the Accessibility App

Once installed, the Accessibility App is available for all users. Users can make further adjustments, either with the profiles or standalone adjustments. When an accessibility feature is configured, the dashboard will refresh when the user closes the accessibility popup. If the popup is closed by clicking outside of it, then the refresh will happen on the next click.

Select a profile

Accessibility profiles are pre-defined combinations of accessibility features designed to address the needs of specific user groups with disabilities. Users can activate a profile that matches their needs, and the relevant features will be activated simultaneously.

 
Notion image
 
Profile
Description
Seizure Safe Profile
The Seizure Safe profile enables epileptic and seizure-prone users to browse safely by eliminating the risk of seizures that result from flashing or blinking animations and risky color combinations.
Vision Impaired Profile
The Vision Impaired profile adjusts the website so that is is accessible to the majority of visual impairments such as degrading eyesight, tunnel vision, cataracts, glaucoma and others.
ADHD-Friendly Profile
The ADHD-Friendly Profile significantly reduces distractions to help people with ADHD and nuerodevelopmental disorders browse, read, and focus on the essential elements of the website more easily
Cognitive Disability Profile
The Cognitive Disability profile provides various assistive features to help users with the cognitive disabilities such as autism, dyslexia, CVA and others to focus on the essential elements of the website more easily.
Keyboard Navigation Profile
This profile enables motor-impaired persons to operate the website using the keyboard Tab, Shift+Tab, and the Enter keys. Users can also use shortcuts such as “M” (menus), “H” (headings), “F” (forms), “B” (buttons), and “G” (graphics) to jump to specific elements. Note: This profile prompts automatically for keyboard users.
Blind Users Profile
This profile adjusts the website to be compatible with screen-readers such as JAWS, NVDA, VoiceOver, and TalkBack. A screen-reader is software that is installed on the blind user’s computer and smartphone, and websites should ensure compatibility with it. Note: This profile prompts automatically to screen-readers.

Content Adjustments

This section enables users to adjust how your site’s content is displayed, making it as readable as possible to someone with a particular disability. Users with vision impairments, like blurred vision or aging sight, utilize these adjustments to customize your website’s content to their specific needs.

These adjustments include:

  • Content Scaling
  • Readable Font
  • Highlight Titles
  • Highlight Links
  • Text Magnifier
  • Adjust Font Sizing
  • Adjust Line Height
  • Adjust Letter Spacing
  • Align Center
  • Align Left
  • Alight Right
Notion image

Color Adjustments

This section adjusts colors and contrast. People with various degrees of color blindness or visual impairments may not see your content well enough, while light-sensitive users may not be able to surf websites with white backgrounds.

These adjustments include:

  • Dark Contrast
  • Light Contrast
  • High Contrast
  • High Saturation
  • Monochrome
  • Low Saturation
  • Adjust Text Colors
  • Adjust Title Colors
  • Adjust Background Colors
Notion image

Orientation Adjustments

These settings offer adjustments designed to enable people with vision impairments, cognitive disabilities, or motor impairments to better orient on your website.

This is achieved by providing them with shortcuts and guiding elements and by reducing distractions and noise.

These adjustments include:

  • Mute Sounds
  • Hide Images
  • Read Mode
  • Reading Guide
  • Useful Links
  • Stop Animations
  • Reading Mask
  • Highlight Hover
  • Highlight Focus
  • Big Black Cursor
  • Big White Cursor
Notion image

Exporting dashboards to PDF

If any accessibility feature is enabled, the PDF export function will bypass the configuration popup, automatically downloading the PDF using the exportSettings ={} in the config.js file.

Searching

Users who may find it hard to comprehend certain phrases, language, or slang can search within the Accessibility App to provide instant meaning.

ℹ️

At this time, there is no capability to scope the search functionality.

Hiding the Accessibility App

Users can choose to hide the Accessibility App from their screen. When hidden, the trigger will no longer be visible.

⚠️

To resume the display of the trigger, all browsing history and data must be deleted from the browser.

 
Did this answer your question?
😞
😐
🤩