Should I avoid JavaScript , jQuery, flash, Ajax, Silverlight if i want to make my site cross platform compatible (PC, iPHONE other mobiles, PDA) and Accessible(screen reader compatible)?
Should i only use xhtml css with server side language for wider accessibility?
and for PC pr MAC i made everything first for Firefox so for mobile which browser should i choose?
Flash and Silverlight aren't available on the iPhone, and some other mobile devices. jQuery supports screen reader accessibility, but doesn't seem to be available on most mobile devices other than the iPhone.
No, but offer them as progressive enhancements or provide graceful degradation.
You can use these technologies, but you need to be smart about it, and you can't just generalize that any given technology sandbags accessibility.
If you're developing for a web site, #1 tool you need is the Firefox Developer Toolbar add-on. In the Tools menu, there is a selection called "Validate Section 508" (which is a set of guidelines for accessibility). This is a quick n dirty way to get a laundry list of "what's broken" on your site, pertaining to accessibility.
Beyond that, there are plenty of resources on the web with specific advice on how to design for accessibility. It's almost a fully robust sub-discipline on it's own. Most of it has to do with providing well-formed HTML. (appropriate and useful alt text for images, designing with colors that provide adequate contrast, accommodating colorblindness, use of table descriptions, make the the site navigable by keyboard (no mouse), correct descriptions on form fields, etc.)
Now; drink deeply, from the Firehose of Knowledge. . . . Here is a list of resources: Implementing Federal Accessibility Web Standards (1194.22)
(a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content). http://www.access-board.gov/sec508/guide/1194.22.htm#(a)
http://www.jimthatcher.com/webcourse2.htm
Related Information
Creating Accessible Graphics (WEBAIM) http://www.webaim.org/techniques/images/
Appropriate Use of Alternative Text http://www.webaim.org/techniques/alttext/
Describing Illustrations, Diagrams, Maps, Tables, Charts, and Graphs http://www.w3.org/2000/08/nba-manual/Overview.html
Guidelines on alt texts in img elements http://www.cs.tut.fi/~jkorpela/html/alt.html
Example of D link http://www.consideration.org/technology/accessexamples/dlinksample.html (b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation. http://www.access-board.gov/sec508/guide/1194.22.htm#(b)
http://www.jimthatcher.com/webcourse6.htm
Related Information
Captioning for the Web (WEBAIM) http://www.webaim.org/techniques/captions/ (Includes tutorials on captioning in Quicktime, Windows Media, RealPlayer, and MAGpie)
Caption Resource List http://webaim.org/resources/captioning/ MAGPIE (NCAM) http://ncam.wgbh.org/webaccess/magpie/ Synchronized Multimedia: SMIL (W3C) http://www.w3.org/AudioVideo/ Accessibility Features of SMIL (W3C) http://www.w3.org/TR/SMIL-access/
Creating Accessible Flash (WEBAIM) http://www.webaim.org/techniques/flash/
Accessibility Techniques for Flash (Macromedia) http://www.adobe.com/accessibility/products/flash/ (c) Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup. http://www.access-board.gov/sec508/guide/1194.22.htm#(c)
http://www.jimthatcher.com/webcourse7.htm
Related Information Effective Color Contrast http://www.lighthouse.org/color_contrast.htm
Vischeck http://www.vischeck.com/vischeck/ Barrier-free presentation that is friendly to colorblind people http://jfly.iam.u-tokyo.ac.jp/html/color_blind/ Visual Disabilities http://www.webaim.org/articles/visual/colorblind.php
(d) Documents shall be organized so they are readable without requiring an associated style sheet. http://www.access-board.gov/sec508/guide/1194.22.htm#(d)
http://www.jimthatcher.com/webcourseb.htm
Related Information
Accessibility Features of CSS (W3C) http://www.w3.org/TR/CSS-access
Cascading Style Sheets (W3C) http://www.w3.org/Style/CSS/
CSS Validator (W3C) http://jigsaw.w3.org/css-validator/
(e) Redundant text links shall be provided for each active region of a server-side image map. (f) Client-side image maps shall be provided instead of server-side image maps except where the regions cannot be defined with an available geometric shape. http://www.access-board.gov/sec508/guide/1194.22.htm#(e) http://www.access-board.gov/sec508/guide/1194.22.htm#(f) http://www.jimthatcher.com/webcourse5.htm (g) Row and column headers shall be identified for data tables. (h) Markup shall be used to associate data cells and header cells for data tables that have two or more logical levels of row or column headers. http://www.access-board.gov/sec508/guide/1194.22.htm#(g) http://www.jimthatcher.com/webcourse9.htm Related Information How to Create Accessible Tables (WEBAIM) http://www.webaim.org/techniques/tables/
Accessible Table Builder (Accessify) http://accessify.com/tools-and-wizards/accessibility-tools/table-builder/ A tool that allows you to choose what table properties you want, how many rows and columns, and takes care of the accessibility mark-up for you.
(i) Frames shall be titled with text that facilitates frame identification and navigation. http://www.access-board.gov/sec508/guide/1194.22.htm#(i) http://www.jimthatcher.com/webcourse4.htm Related Information How to Create Accessible Frames http://www.webaim.org/techniques/frames/ (j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz. http://www.access-board.gov/sec508/guide/1194.22.htm#(j) http://www.jimthatcher.com/webcourse7.htm (k) A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of these standards, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes. http://www.access-board.gov/sec508/guide/1194.22.htm#(k) http://www.jimthatcher.com/webcourse7.htm (l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology. http://www.access-board.gov/sec508/guide/1194.22.htm#(l) http://www.jimthatcher.com/webcoursea.htm Related Information Creating Accessible JavaScript (WEBAIM) http://www.webaim.org/techniques/javascript/ Keyboard Accessibility (WEBAIM) http://www.webaim.org/techniques/keyboard/ JavaScript Accessibility Issues (TRACE Center) http://trace.wisc.edu/world/java/jseval.htm Scripts (IBM) http://www-03.ibm.com/able/guidelines/web/webscripts.html (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l). http://www.access-board.gov/sec508/guide/1194.22.htm#(m)
Software Applications and Operating Systems (1194.21) http://www.access-board.gov/sec508/guide/1194.21.htm
Related Information:
Java Accessibility (IBM) http://www-03.ibm.com/able/guidelines/java/accessjava.html
Sun Microsystems Accessibility Program http://www.sun.com/access/index.html (n) When electronic forms are designed to be completed on-line, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues. http://www.access-board.gov/sec508/guide/1194.22.htm#(n) http://www.jimthatcher.com/webcourse8.htm Related Information How to Create Accessible Forms (WEBAIM) http://www.webaim.org/techniques/forms/ Accessible HTML/XHTML Forms (Accessify.com) http://www.accessify.com/features/tutorials/forms/ Multiple Input Form Fields (Accessify.com) http://www.accessify.com/features/tutorials/multiple-inputs/ Quick Form Builder (Accessify.com) http://www.accessify.com/tools-and-wizards/accessibility-tools/quick-form-builder/ This tool lets that helps you build forms with the necessary HTML mark-up for accessibility.
(o) A method shall be provided that permits users to skip repetitive navigation links. http://www.access-board.gov/sec508/guide/1194.22.htm#(o) http://www.jimthatcher.com/webcourse4.htm Related Information
Skip Navigation Links (WEBAIM) http://www.webaim.org/techniques/skipnav/
Skip Navigational Links (Jim Thatcher.com) http://www.jimthatcher.com/skipnav.htm (p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required. http://www.access-board.gov/sec508/guide/1194.22.htm#(p) http://www.jimthatcher.com/webcourse7.htm
More Information on Making Web Sites and Content Accessible W3C Web Accessibility Initiative Resources http://www.w3.org/WAI/Resources/ Making Educational Software and Web Sites Accessible Design Guidelines Including Math and Science Solutions http://ncam.wgbh.org/cdrom/guideline/ 508 Universe (Includes a course on designing accessible websites) http://www.section508.gov/index.cfm?FuseAction=Content&ID=5 Accessibility Tools and Wizards http://www.accessify.com/tools-and-wizards/
Testing Web Sites for Accessibility Testing for Web Accessibility Compliance Under Section 508 of the Rehabilitation Act of 1973 (Department of Education) http://www.ed.gov/policy/gen/guid/assisttesting.html
508 Checklist (WEBAIM) http://www.webaim.org/standards/508/checklist
Evaluating Web sites for Accessibility (W3C) http://www.w3.org/WAI/eval/
Free Testing Tools The Wave http://www.wave.webaim.org/
Web Accessibility Toolbar (Internet Explorer) http://www.paciellogroup.com/resources/wat-ie-about.html
Web Developer Toolbar (Firefox) http://chrispederick.com/work/web-developer/
For more information about the Department of Education’s Assistive Technology Program, please visit: http://www.ed.gov/policy/gen/guid/assistivetech.html The links referenced in this document include those that are created and maintained by other public and private organizations and are provided for the user's convenience. The U.S. Department of Education does not control or guarantee the accuracy, relevance, timeliness or completeness of information from these sources. Further, the inclusion of links in this document is not intended to reflect their importance, nor is it intended to endorse any views expressed or products or services offered, or the organizations sponsoring the sites. Last Updated on July 17, 2009
No, with gracefull degradation you build the website to work without javascript, and put a layer of dynamic behaviour on top.
Especially jQuery is good with that.
Things like Silverlight can give problems, but as long as it isn't an integral part of the page, it shouldn't give a problem.
I general, you don't have to avoid those technologies if you want to have multiple production targets. However, more care will need to be taken in order to provide more traditional methods for creating the same functionality. In other words, you will need to gracefully degrade.
Just an opinion,
for mobile which browser should i choose?
I seen lots of phone which has opera mobile browser, so please try to make compatible with opera too.
My advice would be to make a basic site devoid of any fancy stuff (JavaScript, Flash, etc.) and make that site perfectly accessible on any device.
Then if the user experience can be truly enhanced on certain platforms due to fancier technology, build that on top of your basic site and just make sure you're checking who's accessing your site and how, and serve them the right version.
As a screen reader user please follow the advice to use graceful degradation. That said Flash and Silverlight are inaccessible. Although Flash can theoretically be made accessible I have never found a site with accessible Flash. If you want the site to be accessible to blind users on mobile phones you need to test using the default browser on the IPhone, Windows Mobile and Symbian. Opera Mobile is not accessible to screen reader users on any mobile device.
