How to Build an Accessible Digital Platform (LumApps Accessibility Features)

Why Accessibility Matters

The first computers were the size of conference rooms with highly specialized usage instructions. The evolution of technology, and the growth of the internet democratized the ability for people to improve their quality of life with computers. Digital experience accessibility is about moving this ability forward, and creating a standard of equal access quality.

Several frameworks inform today’s digital accessibility standard. These include:

• Web Content Accessibility Guidelines – The most commonly used framework for accessibility  was created by the World Wide Web Consortium (W3C). Their success standards are designed for the needs of individuals, organizations, and governments around the world.
• The A11Y Project – The A11Y Project is a community-driven, open-source project with style guides, code examples and checklists to help teams design accessible products.
• Usability.gov – The U.S. government has its own standards for internet usability due to section 508 which requires all government information to be accessible for individuals with disabilities. Countries such as Australia, Germany, Italy and more apply similar concepts.

LumApps Compliance with WCAG 2.1

SaaS platform design and development should start with WCAG compliance. The latest version, WCAG 2.1, was published in 2018. WCAG ranks accessibility features on a three-point scale, A-AA-AAA. A represents the minimum standard for accessibility while AAA equals the highest possible form of accommodation.

LumApps is focused on delivering at least the AA standard on each WCAG success criteria. WCAG maintains a list of success components that range from distinguishable text and audio, keyboard access, navigation, predictability and more. The LumApps platform currently scores at least the AA qualification for 47 of the 49 listed criteria.

Every LumApps release dedicates development and testing efforts toward achieving higher compliance within these fields.

Read our Docs

LumApps Accessibility and Best Practices

LumApps is a highly customizable and collaborative platform, the range of customization options allows users to further improve their accessibility by applying best practices. Here’s a list of examples.

Contrast

LumApps contributors can apply appropriate contrast ratios on page designs and text overlays. Tools such as Contraste allow you to check if the contrast of a given component is WCAG approved.

Fonts

Readable fonts are important for accessibility and should be above 14px. Special fonts should only be used for headings with sizes above 16px.

Images

Just as SEO experts recommend alternative texts (alt-texts) for the vision impaired, images within LumApps can include descriptive text. Placing text over images should be avoided.

Layouts

Pages within LumApps should be clear and uncluttered. This includes appropriate headings, page titles and the right amount of padding and spacing. The WCAG standard, focus order, looks at this element of accessibility.

Colors

Color palettes should avoid extreme colors that can be distracting or hard to see. Color decisions also affect contrast effectiveness.

Media

Videos should include high quality subtitles when possible. Additionally, auto-play videos should be disabled as it can be a trigger for vestibular and seizure disorders.

Links

Clickable elements, icons or text, should be clear with appropriate descriptions and color contrasts.

LumApps Navigation Enhancement

A specific accessibility mission for LumApps was improving the navigation based on standards from the A11Y project. These updates made significant improvements.

Better semantics

The overall html semantic has been improved. Previously, all menu entries were anchors (html “<a>” tag), even if they didn’t redirect to a new page or were not clickable. Now, each element has its corresponding html tag and behavior.

Better screen reader support

As a side effect of having better semantics, screen readers will have an easier time detecting each element’s purpose. Accessible Rich Internet Applications (ARIA)  attributes were added to give more context to screen readers by adding labels to buttons that don’t have text, sub-menus states (open/closed), etc.

Better focus management (simplified keyboard navigation)

Good focus management makes an accessible website for those using assistive technologies. Before introducing the new improved top bar within LumApps, sub-level menus couldn’t be reached using only the keyboard. The new top bar helped with this issue, but further polishing was completed.

Unified styling

Sub level items now have a similar look and feel as main level items.

Learn More About LumApps Accessibility

Read the Docs

Visit the Accessibility page