ACCESSIBLE DEVELOPMENT RECOMMENDATIONS FOR DRUPAL SITES

crateleftInternet and Web Development

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

82 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