Enhanced Accessibility for Telerik’s ASP.NET AJAX Databound Controls and Why This Matters

In the whole history of Telerik’s RadControls we have been trying to make them usable for everyone by providing features like Localization, Keyboard Support, Right-to-left Support, WAI-ARIA Support and Accessibility. Now with the Q1 2013 Beta release we are continuing that trend by providing better Accessibility support and meeting WCAG 2.0 and Section 508 Accessibility Compliance guidelines. In this blog post we will take a look at the details regarding the changes we have made to our controls.

Why Accessibility Matters

Accessibility is becoming increasingly popular for websites and critically important for their success. The idea behind accessible website applications is allowing people with disabilities or limited access to Internet to freely navigate your content. This could be achieved by adding additional attributes and elements which could be used by special readers to provide more in depth information for what certain part of a web application is used for. We at Telerik are following world standards for our controls in order to ensure the best end user experience.

Changes explained

Following WC3 Specifications we have made four major changes to the html rendering described below:

• All HTML data tables now have one additional header row containing a cell with a scope attribute
• For each rendered <table> element we have introduced properties for setting the summary attribute which helps describe the purpose of the table
• Tables that meet certain criteria should have a <caption> element containing a short title. We also have implemented properties for the table captions
• There are new properties that set title or alt attributes for the controls that render as <input> elements

The improvements are mainly concentrated on our complex controls – RadPivotGrid,RadGrid and RadTreeList. However, we have added a header row to the RadDatePicker, RadTimePicker, RadDateTimePicker controls.

RadPivotGrid

We are happy to announce that even our new mighty PivotGrid for ASP.NET AJAX brings Accessibility support. We have added a set of properties under RadPivotGrid.AccessibilitySettings and additional properties under RadPivotGrid.PagerStyle for controls that are placed in the pager.

RadGrid

We made a huge progress in supporting a lot more functionalities for our ASP.NET Grid control. Here is a list of the new set of properties.

• RadGrid.PagerStyle and GridTableView.PagerStyle for the controls placed in the pager item
• In some columns which render input elements and need a title or alt attributes
• The same properties introduced in the columns are present in the grid column editors
• GridTableView.EditFormSettings properties are associated to the tables rendered when edit from is created
• When a group panel is shown it creates table elements and their attributes could be changed under RadGrid.GroupingSettings

RadTreeList

The RadTreeList has similar properties to what we implemented in RadGrid – RadTreeList.PagerStyle, column properties and RadTreeList.EditFormSettings. In addition, if you want to set the Expand and Collapse button title attributes, you can find the associated properties under RadTreeList.ClientSettings.ClientMessages.

In conclusion

We have worked hard to improve our support for features that could enable people with disabilities to easily use our controls. You could go through the demos below which showcase the functionality described in the article.

• PivotGrid / WCAG 2.0 and Section 508 Accessibility Compliance
• Grid / WCAG 2.0 and Section 508 Accessibility Compliance
• TreeList / WCAG 2.0 and Section 508 Accessibility Compliance

Additionally, if you need some help understanding all the various properties the help articles below will surely help you through the process of implementation.

• Grid Accessibility Help Article
• PivotGrid Accessibility Help Article
• TreeList Accessiblity Help Article

By the way, don’t forget to sign up for our What’s New Webinar on Mar 5^th. Our evangelist Jeff Fritz will walk you through all the new stuff and you can get answers to your questions live. Just for fun, some of you attending the live event will walk away with a Telerik .NET Ninja t-shirt and a ThinkGeek gift card. Register for What's New Webinar