什么是使用像angularjs框架的可访问性意味着什么? [英] What are the accessibility implications of using a framework like angularjs?

查看:134
本文介绍了什么是使用像angularjs框架的可访问性意味着什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我们都是为了符合监管公共/教育机构一定的规律对无障碍网页推下。到现在为止,我们已经得到只需确保:

We are under a push for web accessibility in order to conform to certain laws governing public/educational institutions. Until now we've been getting by just making sure:


  1. 我们的布局在逻辑有序;

  2. 图像有 ALT =标记。
    但很快意识到我们需要装备来获得真正想一想。

我们一直在寻找 AngularJS 为动态Web应用程序的框架,但担心它可能意味着我们的辅助地位。

What we are considering

We've been looking at AngularJS as a framework for dynamic web applications, but are concerned about what it may mean for our accessibility standing.

据我所知,没有JavaScript的浏览器可能会打破一个高度动态的角度应用程序(如前pressions如 {{} item.something} 嵌入李> ,客户端的部分景色作为标记,使用 NG-重复从单一的&LT构建列表空标签,等等)。

I understand that a browser with no JavaScript will likely break a highly dynamic Angular app (e.g. expressions such as {{ item.something }} embedded in the markup, using ng-repeat to build lists from a single <li>, client-side partial views as empty tags, etc.).

我想知道如果有一个很好理解的最佳做法或信息资源为这些类型的框架,在很大程度上依赖于动态的标记和内嵌标记,可以被看作是胡言乱语的东西像屏幕阅读器,甚至是与浏览器的的JavaScript 的和的 CSS 的关闭。

I'm wondering if there is a well-understood best-practices or information resources for these kinds of frameworks that rely heavily on dynamic markup and inline-tagging that could be perceived as gibberish to something like a screen-reader or even a browser with JavaScript and CSS turned off.

推荐答案

所有原则同样适用,比如使用图片的ALT文字,用好标题,使用适当的HTML(5)的内容结构。

All the same principles apply, such as using alt text for images, good use of headings, use the appropriate HTML(5) structures for content.

您可能是通过JavaScript创建它,但最后〜5年的屏幕阅读器明白了,使用浏览器的辅助功能API来访问DOM。非JavaScript的方面是根本就不是一个辅助问题。屏幕阅读器没有JavaScript的用户数是一样的普通人群,因此给人的印象是完全形成HTML,而不是你的发展看到原始的标记。

You might be creating it via JavaScript, but screen readers of the last ~5 years understand that, and use the browser's accessibility API to access the DOM. The non-JavaScript aspect is simply not an accessibility issue. The number of screen reader users without JavaScript is the same as the general population, therefore it comes across as fully formed HTML rather than the raw markup you see in development.

注:我认为渐进增强一个好办法,但Angular.js您决定前期不要采取这种做法。如果你想了解性能和渐进增强,我觉得<一个href=\"http://stackoverflow.com/questions/7370056/accessibility-and-all-these-javascript-frameworks?rq=1#answer-7371629\">this回答了的。

NB: I consider progressive enhancement a good approach, but with Angular.js you are deciding up-front not to take that approach. If you want to know about performance and progressive enhancement, I think this answered it.

当然,你不使用Angular.js只是创建标准内容的网页,所以你需要起床用的 WAI-ARIA规范如何在HTML 使用ARIA。在指定如何动态地标记的事情,不包括在传统的HTML做法,如标签,树木,网格等。

Of course, you don't use Angular.js just to create standard content pages, so you need to get up to speed with the WAI-ARIA specification, and how to use ARIA in HTML. The specifies how to dynamically markup things that are not covered by traditional HTML practices, such as tabs, trees, grids etc.

有关在实践WAI ARIA技术的实际例子,我会看一下 Whatsock技术风格指南

For a practical example of WAI ARIA techniques in practice, I would have a look at the Whatsock technical style guide.

的一个区别是<一href=\"http://stackoverflow.com/questions/18619186/tell-screen-reader-that-page-has-changed-in-backbone-angular-single-page-app/18631501#18631501\">how您管理页面更新,因为你管理键盘焦点,而不是刷新页面。但除此之外,WAI-ARIA是在读了的东西。

One difference compared to traditional websites are how you manage page updates, as you manage the keyboard focus rather than refresh the page. But apart from that, WAI-ARIA is the thing to read up on.

这篇关于什么是使用像angularjs框架的可访问性意味着什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆