fbpx
Reading:
Accessibility

Accessibility

Accessibility refers to the inclusive measures done on websites to make it possible for everyone to enjoy the web. ONE BILLION PEOPLE (or 15% of the world population) suffers from some disability (source: ​​https://www.worldbank.org/en/topic/disability) so the problem is highly significant to all websites. It is not only the right thing to do, but also a lost monetary opportunity to not take measures for high accessibility.

At Leadoo we believe everyone should have the same possibility to enjoy the web. Interactive bot elements, such as the InpageBot are a great way to enhance accessibility to relevant information on your website.

But more importantly, accessibility is about technical implementations that help screen readers read the page, people navigate with a keyboard instead of a mouse and people with colorblindness see the information.

Leadoo’s bots and other technologies have the following improvements to remove barriers thus complying with WCAG and WAI-ARIA (where applicable):

  • ARIA labels and roles for UI components – imperative for screen readers and web browsers to ensure keyboard navigation
  • Base themes adjusted for color contrast – Color contrast or WCAG is a mathematically easy thing to check. Leadoo’s basic themes have been improved for better contrast but more importantly, you can create your own themes and ensure every page and every bot uses the theme you choose.
  • Keyboard-accessible UI components – we’ve added keyboard shortcuts for multi-line inputs and chat inputs and we’ve ensured and enhanced to calendar widget to be keyboard accessible.
  • Image alts for non-visual description – all images include alt tags that help screen readers know what the image is about. E.g. closing down a chatbot.
  • ARIA-live areas for constantly updating information (livechat, bot flow)
  • Hover/focus states for UI inputs, buttons and links – we’ve also disabled state on not-yet-ready components that are still in the DOM tree
  • Input placeholders for example content
  • Input labels with “required” status indicators

And probably many more that already worked out of the box. We’ve also used external parties to test our different bot solutions and are working closely with our larger customers with their own accessibility experts to ensure Leadoo works on the specific technologies they use.

Accessibility is not a one-time thing – technology evolves and so do needs and what is possible to do. At Leadoo we feel everyone should have the same chances to enjoy the web and we are committed to improving accessibility in our technologies.

Evaluation of Leadoo’s Visual Bot

About the Evaluation

Report CreatorIn-house evaluation.Evaluation CommissionerLeadoo Tech LeadEvaluation dateTue May 07 2024

Executive Summary

While Leadoo’s visual bot is not a web page per se, it helps users on the website find relevant information faster. At the same time it complies to standards, implements assistive attributes and does not include bloated DOM structures of heavy JavaScript usage – which results in compliant accessibility for its part and possibly even enhancing the accessibility of the overall site.

Scope of the Evaluation

Website nameLeadoo Visual BotScope of the websiteThe Leadoo Visual Bot’s webcontent. Used https://bot.leadoo.com/bot/visual.html?code=58901085 as an example.WCAG Version2.1Conformance targetAAAccessibility support baselineEvergreen browsers as of May 2024.Additional evaluation requirementsNot provided

Detailed Audit Results

Summary

Reported on 50 of 50 WCAG 2.1 AA Success Criteria.

  • 33 Passed
  • 0 Failed
  • 8 Cannot tell
  • 9 Not present
  • 0 Not checked

All Results

1 Perceivable

1.1 Text Alternatives
Success CriterionResultObservations
1.1.1: Non-text ContentEntire sampleResult: PassedEntire sampleObservations:All visual elements have a text associated with them.
1.2 Time-based Media
Success CriterionResultObservations
1.2.1: Audio-only and Video-only (Prerecorded)Entire sampleResult: PassedEntire sampleObservations:In Leadoo Visual Bots it is possible to add text together with video & audio to describe the content. However, captions etc have to be created by the author of the video/audio (see next point).
1.2.2: Captions (Prerecorded)Entire sampleResult: Cannot tellEntire sampleObservations:Up to the creator of the video/audio.
1.2.3: Audio Description or Media Alternative (Prerecorded)Entire sampleResult: Cannot tellEntire sampleObservations:Possible in Leadoo, but up to the creator of the bot & media.
1.2.4: Captions (Live)Entire sampleResult: Cannot tellEntire sampleObservations:Up to the creator of the media.
1.2.5: Audio Description (Prerecorded)Entire sampleResult: Cannot tellEntire sampleObservations:Up to the creator of the media.
1.3 Adaptable
Success CriterionResultObservations
1.3.1: Info and RelationshipsEntire sampleResult: PassedEntire sampleObservations:Both true visually as well as technically in the DOM tree.
1.3.2: Meaningful SequenceEntire sampleResult: PassedEntire sampleObservations:Tested with screenreader & tabbing order.
1.3.3: Sensory CharacteristicsEntire sampleResult: Passed
1.3.4: OrientationEntire sampleResult: Passed
1.3.5: Identify Input PurposeEntire sampleResult: PassedEntire sampleObservations:Leadoo has predefined input types which maximizes the possibility of compliance in meaningful input types.
1.4 Distinguishable
Success CriterionResultObservations
1.4.1: Use of ColorEntire sampleResult: PassedEntire sampleObservations:Text is the primary way to convey information.
1.4.2: Audio ControlEntire sampleResult: Not present
1.4.3: Contrast (Minimum)Entire sampleResult: Cannot tellEntire sampleObservations:The use of themes in bot solutions ensures that custom non-compliant solutions aren’t used. But this is up to the customer’s own theme and color palette. If this color palette has for instance low contrast then technically it can be used in Leadoo’s case as well.
1.4.4: Resize textEntire sampleResult: PassedEntire sampleObservations:Using the browser’s native zoom works.
1.4.5: Images of TextEntire sampleResult: PassedEntire sampleObservations:Text is the primary way to convey information and the only meaningful reason for using Leadoo Visual Bots.
1.4.10: ReflowEntire sampleResult: Passed
1.4.11: Non-text ContrastEntire sampleResult: Cannot tellEntire sampleObservations:By default yes, but can be changed by the customer according to their visual theme.
1.4.12: Text SpacingEntire sampleResult: Passed
1.4.13: Content on Hover or FocusEntire sampleResult: Passed

2 Operable

2.1 Keyboard Accessible
Success CriterionResultObservations
2.1.1: KeyboardEntire sampleResult: Passed
2.1.2: No Keyboard TrapEntire sampleResult: Passed
2.1.4: Character Key ShortcutsEntire sampleResult: Not present
2.2 Enough Time
Success CriterionResultObservations
2.2.1: Timing AdjustableEntire sampleResult: Not present
2.2.2: Pause, Stop, HideEntire sampleResult: Not present
2.3 Seizures and Physical Reactions
Success CriterionResultObservations
2.3.1: Three Flashes or Below ThresholdEntire sampleResult: Passed
2.4 Navigable
Success CriterionResultObservations
2.4.1: Bypass BlocksEntire sampleResult: Not present
2.4.2: Page TitledEntire sampleResult: Not presentEntire sampleObservations:The website that Leadoo Visual Bots are added to need to comply with page title requirements.
2.4.3: Focus OrderEntire sampleResult: PassedEntire sampleObservations:Leadoo bots can be navigated sequentially alone and as a part of a website.
2.4.4: Link Purpose (In Context)Entire sampleResult: Cannot tellEntire sampleObservations:Implementation issue. Technologically Leadoo Visual Bots support this.
2.4.5: Multiple WaysEntire sampleResult: Not presentEntire sampleObservations:No applicable for Leadoo bots.
2.4.6: Headings and LabelsEntire sampleResult: Passed
2.4.7: Focus VisibleEntire sampleResult: Passed
2.5 Input Modalities
Success CriterionResultObservations
2.5.1: Pointer GesturesEntire sampleResult: Passed
2.5.2: Pointer CancellationEntire sampleResult: Passed
2.5.3: Label in NameEntire sampleResult: PassedEntire sampleObservations:By default this is the primary use-case of Leadoo’s Visual bots.
2.5.4: Motion ActuationEntire sampleResult: Not present

3 Understandable

3.1 Readable
Success CriterionResultObservations
3.1.1: Language of PageEntire sampleResult: PassedEntire sampleObservations:Html lang defined in bots.
3.1.2: Language of PartsEntire sampleResult: Passed
3.2 Predictable
Success CriterionResultObservations
3.2.1: On FocusEntire sampleResult: Passed
3.2.2: On InputEntire sampleResult: PassedEntire sampleObservations:By nature Leadoo’s Visual Bots consist of buttons that navigate within a sub context to the next desired logical state.
3.2.3: Consistent NavigationEntire sampleResult: Cannot tellEntire sampleObservations:Leadoo is not a webpage but a subset of it.
3.2.4: Consistent IdentificationEntire sampleResult: Passed
3.3 Input Assistance
Success CriterionResultObservations
3.3.1: Error IdentificationEntire sampleResult: Passed
3.3.2: Labels or InstructionsEntire sampleResult: Passed
3.3.3: Error SuggestionEntire sampleResult: PassedEntire sampleObservations:Email, phonenumber etc have default error messages that instruct users.
3.3.4: Error Prevention (Legal, Financial, Data)Entire sampleResult: Not present

4 Robust

4.1 Compatible
Success CriterionResultObservations
4.1.1: ParsingEntire sampleResult: Passed
4.1.2: Name, Role, ValueEntire sampleResult: Passed
4.1.3: Status MessagesEntire sampleResult: Passed

Sample of Audited Web Pages

  1. Leadoo Visual Bot – https://bot.leadoo.com/bot/visual.html?code=58901085

Web Technology

HTML,CSS,WAI-ARIA,JavaScript,SVG