<p>Two years ago, we published a post near the time that we were <a href="https://www.elastic.co/blog/making-kibana-accessible">kicking off our accessibility work</a>. Since then, we’ve come a long way in our understanding of what it means to build an accessible product and best practices for doing so. With 7.6, we’ve shipped quite a few accessibility improvements and fixes all over Kibana, and thought now would be a good time to highlight some of our recent work.
</p>
<h2>Introducing our accessibility statement</h2>
<p>The goals for our accessibility efforts go beyond compliance: We want all humans to feel empowered to understand and effect the world when they use Elastic products. Not as focused on minutia as a traditional <a href="https://www.section508.gov/sell/vpat">VPAT</a> might be, we hope that by putting our accessibility work front-and-center in an easy-to-read format, we can show our commitment to building an inclusive product for everyone. You can find our statement under <a href="https://www.elastic.co/guide/en/kibana/master/accessibility.html">Accessibility</a> in the Kibana docs. (If you are interested in our formal VPAT, please message <a href="mailto:accessibility@elastic.co">accessibility@elastic.co</a>.)
</p>
<h2>Recent highlights</h2>
<h3>An accessible EUI</h3>
<p><a href="https://github.com/elastic/eui">EUI</a>, or Elastic UI, is the component library that’s behind all of the UI that we create at Elastic. An accessibility focus at this foundational layer of our work ensures solid building blocks supporting every piece of UI we create. By consolidating all of our most used patterns in one area, we’re able to provide consistent experiences and <a href="https://github.com/elastic/eui/issues/2262">handle lots of accessibility concerns</a> before the scores of implementing developers — from Kibana, to Elastic Cloud, to every other UI team, internal and external — even get to work. We still have a <a href="https://github.com/elastic/eui/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3Aaccessibility+">list of improvements</a> we're looking to implement in EUI, but we’re quickly approaching a point where we’ve checked off all of the obvious boxes and can move on to improving Elastic-specific use cases.
</p>
<p>To see some of the things we strive to instill in EUI and in our consuming app, take a look at our recently published <a href="https://elastic.github.io/eui/#/guidelines/accessibility">Accessibility Guidelines</a> or jump into <a href="https://github.com/elastic/eui/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3Aaccessibility">EUI’s Github issue tracker</a> to get involved with the details.
</p>
<p><img src="https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/blt5c3ff9f34f679ab4/5e4bf98d7c62095ce7b38116/accessibility-guidelines-eui-shot-blog.jpg" data-sys-asset-uid="blt5c3ff9f34f679ab4" alt="Elastic EUI Accessibility Guidelines" style="display: block; margin: auto;">
</p>
<h3>Navigating around Kibana</h3>
<p>Kibana’s big. And loaded with features. And built by a huge, diverse, and growing team. So, sometimes, we can miss the little things that make a UI that’s quick and easy to navigate. With 7.6, we’ve gone back and updated all the products within Kibana with a more complete <a href="https://github.com/elastic/kibana/issues/37539">heading</a> and <a href="https://github.com/elastic/kibana/pull/46569">landmark</a> structure to make navigating with assistive tech that much easier.
</p>
<p><img src="https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/bltbee971e4cdea641d/5e4bf9ba7c62095ce7b3811c/accessibility-guidelines-kibana-nav-blog.jpg" data-sys-asset-uid="bltbee971e4cdea641d" alt="Making Kibana navigation accessible" style="display: block; margin: auto;">
</p>
<h2>Mindset shift</h2>
<p>Years ago, we promised to continue improving our process around creating accessible experiences for everyone. Since then, we’ve been able to imbue many parts of our process with a larger accessibility focus:
</p>
<ul>
	<li>Members of our QA team have trained on how to use automated tools and screen readers to evaluate accessibility.</li>
	<li>Our design team is trained to think about accessibility up front, which means the design and UX is accessible from the ground up.</li>
	<li>Many PRs now start with accessibility already on the minds of implementing developers from our continued education efforts through Slack, team training, and engagement at company events.</li>
	<li>Accessibility specs for our more complicated components (e.g., <a href="https://github.com/elastic/eui/issues/2404">EuiSuggest</a>, <a href="https://docs.google.com/document/d/16Bje5R00cybqXeCvA0tLM4v8Dl3GwJG6o4etPCiChRM/edit?usp=sharing">EuiDataGrid</a>).</li>
</ul>
<p>But we’re most excited about our rollout of automated accessibility testing powered by <a href="https://www.deque.com/axe/">axe</a>. Automated testing can’t find every problem but it’s great at picking off that low-hanging fruit so that we can focus on the harder problems. <a href="https://github.com/elastic/kibana/pull/43584">Kibana is already up and running</a> with <a href="https://github.com/elastic/kibana/pull/54209">several high-level tests</a> and <a href="https://github.com/elastic/eui/pull/2569">EUI has kicked off the process</a> to follow suit.
</p>
<h2>Future work</h2>
<p>There’s always more work to do but here are some things that we’ve got our sights set on for the immediate future.
</p>
<h3>An accessible Charts library</h3>
<p>As Elastic Charts grows to become the future of all charting around Elastic, we recognize that it needs to work for all of our users. We’ve been talking about the best ways we can support sighted and vision-impaired screen reader users and have some concrete ways we plan to improve. This won’t be a one-and-done sort of effort, so we encourage you to monitor our progress at <a href="https://github.com/elastic/elastic-charts/issues/300">elastic-charts#300</a> and get involved.
</p>
<h3>Better navigation</h3>
<p>Navigating between pages in <a href="https://en.wikipedia.org/wiki/Single-page_application">SPAs</a> has always been a little more difficult for screen reader users than traditional websites have been. We have a <a href="https://github.com/elastic/kibana/issues/56232">big redesign</a> coming together for how to improve our navigation&nbsp;for everyone and are expressly tracking some of the <a href="https://github.com/elastic/kibana/issues/42379">high-level accessibility issues</a> that we plan on tackling at the same time.&nbsp;
</p>
<h2>How you can help</h2>
<p>Accessibility is a critical part of the user experience. If you'd like to help us make our interfaces more accessible, you can browse <a href="https://github.com/elastic/eui/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3Aaccessibility">EUI's</a> or <a href="https://github.com/elastic/kibana/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3AProject%3AAccessibility">Kibana’s</a> accessibility issues to find areas that need improvement. If you find a part of our UI that's inaccessible to you, please file an issue or <a href="mailto:accessibility@elastic.co">email</a> so we can work together to find a solution.
</p>

accessibility-blog-banner.png

accessibility-blog-thumb.png

Our accessibility journey: Mindset and tools

Start free trial

Blog Footer CTA

Sign up for Elastic Cloud free trial

Blog Footer

Michail Yasonik

Can't make it? Register and we'll send you the recording. You'll also receive an email with related content

Can't make it? Register and we'll send you the recording. You'll also receive an email with related content.

You'll also receive an email with related content.

You'll also receive an email with related content

Load More

<p>By submitting you acknowledge that you've read and agree to our <a href="/legal/elastic-cloud-account-terms" target="_blank">Terms of Service</a>, and that Elastic may <a href="/legal/privacy-statement#how-we-use-the-information" target="_blank">contact you</a> about our related products and services, using the details you provide above. See <a href="/legal/privacy-statement/" target="_blank">Elastic’s Privacy Statement</a> for more details or to opt-out at any time.</p>

Newsletter GDPR Text

Speakers

Close

See more insights

The content on this page is not available in the selected language. As Elastic grows globally, we continue to support content in multiple languages.

Elasticsearch Platform

ELK Stack

Elastic Cloud

Observability

Security

Search

By industry

By solution

Customer spotlight

Developers

Connect

Learn

Help

See what's happening at Elastic

Author

Articles by Michail Yasonik

Our accessibility journey: Mindset and tools

Follow us

About us

Join us

Press

Partners

Trust & Security

Investor relations

EXCELLENCE AWARDS