gazages.com |

welcome to my space
RSS Feed

Ext and Accessibility (Unobtrusive Javascript)

Wednesday Mar 17, 2010
  • Hey people!

    First of all I'd like to congratulate Jack and all the others Ext developers for the GREAT job! =D>
    Second I'd like to bring here a very important discussion, something that all web developers nowadays should be aware of: Javascript (dynamic generated content) and Accessibility.
    Parts of the Ext API provide methods for us developers to deal with unobtrusive javascript, some examples are the form fields that we can write the standard valid HTML and then write the javascript to apply the Ext functionalities (applyTo method), the unobtrusive grid present in the examples is great too, I think it should be included in the standard API (maybe 1.02, why not? ;) ).
    I work for a governmental organization in Brazil and here we must provide systems that has valid HTML, CSS and they must be accessible (screen readers must be able to read at least the most important things in the page, such as forms, grid, etc).
    I think that Ext is in the right way to be the most accessible Javascrip library I've ever seen, it just need minor adjustments/improvements.
    Summarizing, my sugestions are (just for beginning):
    - Provide applyTo method whenever possible (with some priority to the Form component, considering that all form fields already have it);
    - Develope an unobtrusive menu API (again the applyTo method);

    Thanks for the attention of you all! B)


  • Ext is a JS lib. All the things you are describing can be done. Similar the the HTML Table -> Grid example, you can apply Ext components to replace existing elements. The tools are there, an example is there, but you will need to apply it.


  • Accessibility is the a huge thorn in RIA's. It will be until people start to really understand the standards and code of them.

    All web sites struggle with accessibility. I read a book that said something that less than 10% of the websites in the world are really disabled accessible. :s


  • Daniel,

    It might help understand how EXT could be more accessible, if there was a good discussion anywhere about how to make ANY typical Web2.0 widgets more accessible. (menus, toolbars, pull downs, splitters, etc.). Do you know of any such site?

    I would love to see a forum for accessibility started here so that the EXTjs community might address this important issue better than most other libraries do. To my knowledge, only Bindows is supposed to be making a big effort in this area.


  • Realistically though.

    Can people with the kinds of disabilities targetted by the "accessibility" people in the web world also access desktop apps with rich interfaces?

    How would a live update of 25 new rows in a Grid coupled with an updating of several tab panels in a detail view region be communicated? possibly based upon clicks of an Ajax-loaded tree in a "west" navigation Region?


  • Realistically though.

    Can people with the kinds of disabilities targetted by the "accessibility" people in the web world also access desktop apps with rich interfaces?

    How would a live update of 25 new rows in a Grid coupled with an updating of several tab panels in a detail view region be communicated? possibly based upon clicks of an Ajax-loaded tree in a "west" navigation Region?

    Yes. I would think that a popup, or a highlight/fade,etc would alert the user that the interface has changed.


  • Ext is a JS lib. All the things you are describing can be done. Similar the HTML Table -> Grid example, you can apply Ext components to replace existing elements. The tools are there, an example is there, but you will need to apply it.

    This isn't quite true, Jack. Unobtrusive and accessible aren't the same thing.

    Ext Js widgets don't usually generate accessible HTML. According to 508/best practice, generated HTML from JavaScript must also be accessible; otherwise the page simply is not accessible to many assistive technologies.

    I am building an unobtrusive "framework" layer over Ext that translates existing HTML code to corresponding Ext widgets--similar to the TableGrid subclass. I am doing this without putting extraneous classes on existing nodes using the applyTo config. So far I have done an unobtrusive Grid, Panel and Menubar. The unobtrusive panel, for example, takes a div with a certain class and converts it into an Ext Js Panel. You can set config options for a particular instance of the panel by setting a custom HTML attribute of config to name-value pair.

    For example, this existing HTML will render an Ext Js Panel that is not closeable and does not animate when toggled:


    Heading


    content




  • Unless you are using javascript for very simple eyes candy things, it is really no point to develop ONE VERSION of a website that can degrade gracefully when javascript is turned off.

    It will just make your life miserable.

    What is more realistic is to develop your full version with javascript enabled, and then build a nother HTML only version that has basic functionalities.

    To see what I mean, try login to gmail.com with javascript disabled.


  • Ext is a JS lib. All the things you are describing can be done. Similar the the HTML Table -> Grid example, you can apply Ext components to replace existing elements. The tools are there, an example is there, but you will need to apply it.

    I think there would be tons of overhead both on the human resource level as well as system resources. You basically have to add listeners to every button for keyboard commands as well as build a system to mimic the desktop.

    I am not saying that it's not a worth while cause, but it's just labor intensive.


  • For those new to accessibility issues, here's the site explaining Section 508
    http://www.section508.gov/index.cfm?FuseAction=Content&ID=3

    Excerpt:

    In 1998, Congress amended the Rehabilitation Act to require Federal agencies to make their electronic and information technology accessible to people with disabilities. Inaccessible technology interferes with an individual's ability to obtain and use information quickly and easily. Section 508 was enacted to eliminate barriers in information technology, to make available new opportunities for people with disabilities, and to encourage development of technologies that will help achieve these goals. The law applies to all Federal agencies when they develop, procure, maintain, or use electronic and information technology. Under Section 508 (29 U.S.C. ‘ 794d), agencies must give disabled employees and members of the public access to information that is comparable to the access available to others. It is recommended that you review the laws and regulations listed below to further your understanding about Section 508 and how you can support implementation.


    And here's the W3.org's roadmap for these issues
    http://www.w3.org/WAI/PF/roadmap/DHTMLRoadmap040506.html


  • Ext's core customers are probably not government organizations, who are particularly concerned with 508I would not be too worried w/ govt organizations avoiding Ext-JS... but would raise concern for the Companies that would like to use Ext-JS and sell those products to the US Govt.

    Afaict, Companies that would like to sell their products to US government organizations must have a 508 story, and possibly are required to present to the US Govt purchasing rep the Product's 508 Compliance statement. (I cant speak to the legal issues/ramifications around the 508 "compliance statements" since I'm no lawyer.)

    I suspect "Companies" includes enterprise-level product developers.

    Ext-JS is a toolkit functionally suited (grids, forms, etc) for building these kind of apps.

    jeff


  • Accessibility is the a huge thorn in RIA's. It will be until people start to really understand the standards and code of them.

    All web sites struggle with accessibility. I read a book that said something that less than 10% of the websites in the world are really disabled accessible. :s
    Yeah... unfortunately.. but we developers are the only ones that can change that. Let's do our part!
    Ohhh, I forgot to mention: an unobtrusive button would be great too! :)


  • I think there would be tons of overhead both on the human resource level as well as system resources. You basically have to add listeners to every button for keyboard commands as well as build a system to mimic the desktop.

    Not to mention the fact that screen readers just don't handle XHR and DOM content updates correctly... You'd have to add listeners to force the screen reader to notify the user of updates after every AJAX request that modifies/updates the DOM.







  • #If you have any other info about this subject , Please add it free.#
    Your name:
    E-mail:
    Telphone:

    Your comments:


    If you have any other info about Ext and Accessibility (Unobtrusive Javascript) , Please add it free.

    edit