Want to build your own knowledgebase?
Each LibraryH3lp subscription includes unlimited independent internal or public-facing knowledgebases (FAQs).



Search the LibraryH3lp Knowledge Base

 

 


Commitment to accessibility

2494 views   |   Last updated on Feb 14, 2017    508 ADA chat widget accessibility

 

Background

The guest-facing chat box has been designed for accessibility to users assistive technology since its first release way back in 2007. Since then, the chat box has received regular updates to support changes in web browsers and evolving accessibility standards in web browsers.

The chat box is designed to work with screen readers, including JAWS, and is responsive to screen magnifiers, browser zoom controls, and browser color contrast color schemes.

 

Supporting documents

 

Testing

We do basic in-house testing using the JAWS screen reader by Freedom Scientific. We welcome testing by campus and other accessibility offices and integrate actionable improvements made by accessibility experts whenever possible. The chat box has received numerous accessibility reviews by university campus offices over the years, with feedback folded into the chat box following receipt of results.

 

Suggestions

We strive to provide good accessibility out-of-the box in our default starting chat box skins. Customers can extensively customize these chat skins through CSS and can edit chat snippets to provide additional elements if desired.  

Embedded (iframe) chat boxes: The chat box is created as a full HTML document, and a title can optionally be provided. If a title is provided in the chat skin editor, this forms the HTML document's title. It is also possible to optionally provide a title for the iframe itself in the chat snippet, but this may be redundant if the chat box already has its own title.

Focus indicator: The chat box has visible focus for the various options like sound, email transcript, and send file. If desired, this can be emphasized by providing additional CSS customization to complement the specific chat skin design. Here is example CSS for focus:

#file:focus span.sprite{background-position:-45px 0;width:15px;height:14px; outline: 2px solid yellow; border:2px solid yellow;}

#mail:focus span.sprite{background-position:-27px 0;width:17px;height:14px; outline: 2px solid yellow; border:2px solid yellow;}

#sounds:focus span.sprite{background-position:0 0;width:10px;height:14px; outline: 2px solid yellow; border:2px solid yellow;}

#popout:focus span.sprite{background-position:-60px 0;width:17px;height:14px; outline: 2px solid yellow; border:2px solid yellow;}

 

Feedback

We welcome feedback or questions through any of our standard support channels.

Topics