I uses a RadButton with Icon. This Icon RadButton does not access according 508 UI standard.
So Please suggest to make it 508 Enable.
Thanks.
<telerik:RadButton ID="rbSearchButton" runat="server" >
<Icon PrimaryIconUrl="Images/search.png" PrimaryIconLeft="5"/>
</telerik:RadButton>So Please suggest to make it 508 Enable.
Thanks.
3 Answers, 1 is accepted
0
Hello,
To be section 508 compliant the image should be rendered with a background-image style as shown in the following demo on the subject: Accessibility ,e.g.
All the best,
Rumen
the Telerik team
To be section 508 compliant the image should be rendered with a background-image style as shown in the following demo on the subject: Accessibility ,e.g.
<Icon SecondaryIconCssClass="rbSave" />All the best,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Sandeep
Top achievements
Rank 1
Rank 1
answered on 23 Apr 2012, 07:02 AM
Sorry Rumen, It is not working.
It is accessible if I define text property of Button. but I want use a image without text as a Button.
Please suggest.
Thanks.
It is accessible if I define text property of Button. but I want use a image without text as a Button.
Please suggest.
Thanks.
0
Hi,
As explained in my earlier response, the validation will pass if the image is defined with a background-image css property.
You can see that
will pass the Accessibility validation of Wave Accessibility Evaluation tool in the following video: http://screencast.com/t/Rrh4WxPk because the icon is rendered using background-image CSS property, but not a real <img> tag, which is not accessible.
Here is the markup of my test page:
Regards,
Rumen
the Telerik team
As explained in my earlier response, the validation will pass if the image is defined with a background-image css property.
You can see that
<telerik:RadButton ID="rbSearchButton" runat="server" >
<Icon PrimaryIconUrl="Images/search.png" PrimaryIconLeft="5"/>
</telerik:RadButton>will pass the Accessibility validation of Wave Accessibility Evaluation tool in the following video: http://screencast.com/t/Rrh4WxPk because the icon is rendered using background-image CSS property, but not a real <img> tag, which is not accessible.
Here is the markup of my test page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <style type="text/css"> .myIconClass { background-image: url(e.gif); } </style> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> <telerik:RadButton ID="rbSearchButton" runat="server" > <Icon PrimaryIconUrl="e.gif" PrimaryIconLeft="5"/> </telerik:RadButton> <telerik:RadButton ID="RadButton1" runat="server" > <Icon PrimaryIconCssClass="myIconClass" PrimaryIconLeft="5"/> </telerik:RadButton> </form> </body></html>Regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.