In this step, you should create the skeletal framework or the page layout of your design solution.
Requirements: Paper and Pen, Markers, Post-its, Whiteboard, Laptop, Micorsoft Visio, PowerPoint
Navigation
- Consistent navigation: Navigation should be consistent throughout various pages of the application. It will be easy to navigate for the users with cognitive and learning impairments and users using screen readers.
- Easy Interactions: Overall Interactions of the pages should be easy. It is better if users are able to complete a task in maximum three steps.
- Multiple ways: There should be multiple ways to navigate a page: for instance Search and Menu.
- Hierarchical Menu: Menu should be hierarchical. It is easier to find the information on the application with hierarchical menu approach.
- Use of Breadcrumbs: Every page should have navigation location using breadcrumbs. Breadcrumbs types could be Location or Path or an Attribute of the page.
- Destinations on the application should be linked using Keyboard: Navigation should be in an order, so that user with mobility impairments can navigate and understand the application using keyboard only.
Layout
- Clear structured content: Content on the page should be structured clearly. There should be a clear hierarchy in the different levels of content.
- Less cognitive load: Layout of the application should be designed in a way so that there should be less cognitive load on the page. This will be helpful for the users with the cognitive and learning impairments.
- Provide large clickable area: Clickable area should be large. It will be easy to click a button for users with mobility impairments or who use head mounted pointer.
- Reading order: Reading Order for the text and the visuals should be same. Users using screen readers will easily understand the information if the order will the same.
Labeling
- Provide clear purpose/heading: Every page should have a clear heading or the purpose of the page.
- Provide clues in the text boxes: Text boxes should have clues in the boxes. It will be easier for the user with cognitive impairments to understand what to fill in the text box. Also this will help users to fill in the correct format.
- Provide consistent labeling: Provide the consistent labeling to the pages, forms and buttons.
- Write helpful links: Links should be easy to understand for the users using screen readers. Avoid using ambiguous links like click here or more etc.
Alternative Options
- Provide alternative text: Provide alternative text for the images, Captcha Decoration, Time-based media Input and Control.
- Provide options for Access: Providing alternative means of communication. Provide an alternative access for the content available in different format or different places.
- Provide ways to present transcripts of video and audio: Transcripts should be provided in a way which will not create cognitive load on a page.
- Provide Closed Captions: Provide closed captions for videos and audio. Also provide description of Audio like phone ringing etc. Users with hearing impairments can also understand the audio and video using transcripts.
- Resize Text: Provide control to Resize Text on the page. Users with low vision can also read the text using resize option on the application.
- Form/Pages should be accessible with keyboard.
Other Suggestions
- Provide ‘Skip to Content’ link: Provide ‘Skip to Content’ link on the page, so that users with screen readers can skip main headers, otherwise screen reader reads the same content again and again.
- Provide options like play, pause, adjust volume for carasual or other controls: Users with cognitive and low vision impairments should be able to stop and read the content.
- Provide Sign Language with the videos if possible.
Following are some examples for the website www.accessibleuxd.com
Consistent Navigation
Breadcrumbs with path and location
Labeling
Each page consists of a image with a label.
Layout
Reading order is Top to Bottom. Provided large clickable area. Clear content.
