ACCESSIBLE DEVELOPMENT RECOMMENDATIONS FOR DRUPAL SITES

crateleftInternet and Web Development

Dec 4, 2013 (3 years and 9 months ago)

76 views


ACCESSIBLE DEVELOPMENT RECOMMENDATIONS FOR DRUPAL SITES
Alternate representation of images and non-text elements
• Provide equivalent content and functionality for all images and non-text elements
• ALT text for foreground images and image map AREA elements
• ALT text should convey the meaning and function of the image or AREA element
• Empty ALT text for decorative images
• Avoid using background images or sprites to provide content or functionality
• Provide titles for iframe elements
Keyboard operability and navigation
• Skip links for redundant navigation
• Keyboard controls for slideshows and media—including "off" option
• Ensure user can access and control all page content and functionality using keyboard only
• Add keyboard listener for keypress and other keyboard events
• Visual indication when elements receive focus
• Tabindex settings for focusable elements including alerts, where necessary
Document structure and semantics
• All pages use LANG attribute in HTML element
• All pages require TITLE element
• Properly nested h1-h6 heading structure
• All content within ARIA landmarks
• Logical content order should be made apparent to all users
• ARIA roles available to other document regions and info structures
• Appropriate heading to precede navigation lists
Webforms
• Provide label and context for all form fields—label, fieldset/legend, etc.—avoid title
• Consider ARIA roles and properties to help users understand and interact with form controls
• Error detection, notification, correction, and validation should be accessible to user
• Where patterns are required for user input, provide an example of the required input pattern
Text and display size
• Text measurements should be in relative units
• Text containers should resize when text resizes
• Display should maintain legibility when resized in browser

Data tables
• SCOPE attribute for header cells
• ID and HEADERS to associate <th> and <td> cells
• Caption element available for all data tables
• Summary attribute available for all data tables
• Avoid tables for layout
• If tables must be used for layout, they should
o use the ARIA "presentation" role
o linearize appropriately
Color Contrast
• Foreground and background color combinations should pass Colour Contrast Analyser
Multimedia: Transcription and Captioning
• Captions should be synchronized with video stream
• Captions should meet contrast guidelines for text display with regard to contrast and size
• Caption controls should meet requirements of federal CVAA for control of font, placement, text and
background colors and size
Multimedia: Accessible Media Player
• Player should be keyboard operable, including play, pause, CC, and display controls
• Player should permit keyboard focus and blur with no keyboard trap
Slideshows: Content and Control
• Informative and navigational slideshows should be user-controlled by default
• User should be able to navigate easily in and out of a slideshow
• Slideshows should include real-time content updates
• Decorative slideshows should use the ARIA "presentation" role
Interactive Controls (Widgets)
• Use natively functional HTML elements for interactive controls where possible; avoid DIV and SPAN
• Controls should be focusable and keyboard operable
• Controls that change user context should be activated by the user, and not onchange
• Interactive elements should include ARIA roles, states, and properties for semantic reference