This post simply serves as a summary of the 4 posts published recently that distill the information from the W3C about how the guidelines and principles of WCAG 2.0 apply to mobile devices.
I thought it would be useful to have a single post with links to each of the previous posts. The posts take the 4 POUR principles and explain what they mean in terms of mobile application.
The W3C wants to help developers understand how WCAG 2.0 applies on mobile devices. They recently issued the first working draft on the topic. The guidelines and principles of WCAG are explained using the POUR method: Perceivable, Operable, Understandable, Robust.
In this post I will distill the W3C information on the Robust principle.
The Keyboard
Set the virtual keyboard to the type of data entry required.
Data Entry
Make data entry as easy as possible by,
On-screen keyboard
Bluetooth keyboard
Speech or Touch
Use select menus, radio buttons, check boxes or automatically enter known information (e.g. date, time, location)
Support the Platform
Don’t disable the device’s platform characteristics such as zoom, larger fonts, and captions.
The W3C wants to help developers understand how WCAG 2.0 applies on mobile devices. They recently issued the first working draft on the topic. The guidelines and principles of WCAG are explained using the POUR method: Perceivable, Operable, Understandable, Robust.
In this post I will distill the W3C information on the Understandable principle.
Orientation
Support both landscape and portrait orientations
Changes in orientation must be programmatically exposed to ensure detection by devices such as screen readers
Consistent Layout
Within a particular size and orientation, repeated items should be placed consistently
Consistency between different screen sizes and screen orientations is not a requirement
Positioning before the Scroll
Position important items before the scroll.
Group Operable Elements
When two elements (e.g., an icon and a text link) perform the same action, group both items within the same actionable element.
Be Clear About Which Elements are Actionable
Actionable elements such as links or buttons should be indicated by more than one means. Use combinations of shape, color, style, positioning, text labels, and conventional iconography.
Custom Manipulations and Gestures
Provide easily accessible instructions to explain what gestures can be used to control a given interface and whether there are alternatives.
The W3C wants to help developers understand how WCAG 2.0 applies on mobile devices. They recently issued the first working draft on the topic. The guidelines and principles of WCAG are explained using the POUR method: Perceivable, Operable, Understandable, Robust.
In this post I will distill the W3C information on the Operable principle.
Touch Target Size and Spacing
touch targets should be at least 9 mm high by 9 mm wide
touch targets close to the minimum size should be surrounded by a small amount of inactive space
Touchscreen Gestures
Gestures should be as easy as possible to carry out and two-step gestures should be avoided
To prevent unintentional actions, “elements accessed via touch interaction should generally trigger an event (e.g. navigation, submits) only when the touchend event is fired (i.e. when all of the following are true: the user has lifted the finger off the screen, the last position of the finger is inside the actionable element, and the last position of the finger equals the position at touchstart).”
Device Manipulation Gestures
These suggestions are for manipulations such as shaking or tilting:
Developers should still provide touch and keyboard operable alternative control options
Provide onscreen indicators that remind people how and when to use device manipulation gestures
Button Placement
Place interactive elements where they can be easily reached when the device is held in different positions or by different hands
The W3C wants to help developers understand how WCAG 2.0 applies on mobile devices. They recently issued the first working draft on the topic. The guidelines and principles of WCAG are explained using the POUR method: Perceivable, Operable, Understandable, Robust.
In this post I will distill the W3C information for the Perceivable principle.
Small Screen Size
Guidelines include:
Use a responsive design and minimize the amount of information that is put on each page
Use fewer images
Focus on the features needed to operate in the mobile environment
Use a “reasonable” default size for content and touch controls to reduce the need for zooming
Make sure link text does not exceed the width of the device
Put form fields below their labels
Zoom/Magnification
The suggestions include:
The user should be able to zoom to 200%. Do not block this with the page’s viewport meta element.
Support system fonts that follow platform level user preferences for text size
Support options on the page to allow the user to change text size
Contrast
Mobile device content is viewed on smaller screens and in different conditions so the allowable ratio for lessened contrast on larger text on desktop devices must be considered carefully for mobile apps. Therefore, the W3C suggestion at this point is that developers should strive to apply the lessened contrast ratio only when text is roughly equivalent to 1.2 times bold or 1.5 times (120% bold or 150%) that of the default platform size. Even then, the user must be able to zoom to magnify the text.
Apple announced changes aimed at education that are coming in iOS 9.3. The changes allow a group of students to share iPads. Faculty will be able to set up profiles for each child in a classroom. Those profiles can then be used on any classroom iPad.
Students log in to any iPad and have access to all their apps, books, and documents.
With Apple iOS 9.3, teachers can guide students through a lesson, see individual progress including what’s on the student’s screen at the moment, and keep them on track. Teachers can project a student’s work on a classroom television equipped with Apple TV with AirPlay.
Teachers can launch everyone’s apps at the same time, then guide what students are looking at on their devices.
On the administrative side, there are tools for creating accounts, setting passwords, managing enrollment information, making bulk purchases of books, and creating and delivering lessons with iTunes U.
I think these changes will be important to educators from the primary school through college level.
The Pew Research Center released a new survey on home broadband use in 2015 that has implications for web designers. The overall finding is that fewer people have home broadband, while more people rely on their smart phones for Internet access.
The changes are slight, but possibly significant. Home broadband adoption has plateaued. It now stands at 67% of Americans, down slightly from 70% in 2013.
The cost of broadband is a major problem cited by many of those surveyed.
24% of Americans do not have cable or satellite. 15% are former subscribers who ‘cut the cord.’ Young adults, in particular, expect to be able to use their smartphones to access almost anything they want, apply for jobs, follow the news, access government services and more.
The implications for web designers
websites should work well on mobile devices
websites should download quickly with a minimal hit on a users data plan