Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WCAG 2.0 level A and AJAX generated content

I'm having trouble finding a clear answer as to whether as site can pass for at least WCAG 2.0 level A if it uses AJAX in some way.

For example from WCAG2.0 states

"Can I meet WCAG 2.0 with Javascript/Ajax, Flash, PDF, Silverlight, and other technologies? WCAG 2.0 is designed to apply to a broad range of web technologies."

That does not exactly say "yes/no". Some documents suggest that a site has to function with JavaScript completely disabled (in which case the obvious answer is no), but I have the impression that this is old information, and the use of JavaBcript is no longer an absolute barrier (please correct me if this is wrong!).

Maybe this is because it is too broad to give a blanket "YES", so let me give a concrete (simplified but essentially the same) situation.

1) If my site uses AJAX to generate a list of data (let's say, a list of users) immediately after page load, can I expect to pass at least at Level A (and maybe even higher levels?) A simplified example to illustrate:

<h1> Stuff loads here on page load </h1>
<div id="thisIsWhereContentGoes">
</div>
<script type="text/javascript">
    var url = 'http://yourfavoritedatasource.url';
    var request = $.ajax({
        url: url,
        type: "post",
        data: 'text'
    });
    request.done(function (response, textStatus, jqXHR){
        jQuery('#thisIsWhereContentGoes').html(response);
    });
</script>

My guess is that this is ok.

2) Going just a little further, say I have some controls (like prev/next to scroll through pages of a list or update content, for simplicitly lets say these are just anchor tags), can I also expect this to pass at A/AA/AAA? A slight modification to the code above:

<a href="javascript:doRequest()"> Next </a>
<script type="text/javascript">
    doRequest();
    function doRequest()
    {
        var url = 'http://yourfavoritedatasource.url';
        var request = $.ajax({
            url: url,
            type: "post",
            data: 'text'
        });
        request.done(function (response, textStatus, jqXHR){
            jQuery('div').html(response);
        });
    }
</script>

I'm hoping this is also ok.

I hope I'm just being pedantic and this is all ok. As far as I see none of this seems to conflict with WebAim's WCAG checklist

like image 512
amomin Avatar asked May 31 '13 15:05

amomin


1 Answers

To your first question, and keeping up the use of WebAIM as a great resource, it doesn't look like sites have to work without Javascript anymore, at least according to http://webaim.org/discussion/mail_thread?thread=3870.

The consensus seems to be that a site does not have to work with JavaScript turned off as long as one of a number of criteria are met e.g. that a user agent is easily and cheaply available that does support JavaScript.

As for using AJAX, it seems to be perfectly fine as long as all aspects of accessibility are addressed, namely

  1. The application must alert the user that a change has occurred
  2. Allow direct access to the new content
  3. Allow continued functionality of the web application

from http://webaim.org/techniques/ajax/.

WebAIM has a great follow up article showing ways to achieve these kinds of objectives at http://webaim.org/techniques/aria/. I would particularly look at the Dynamic Content Updates section which emphasizes the use of WAI-ARIA live regions.

like image 50
gotohales Avatar answered Sep 30 '22 16:09

gotohales