Upload
ted-drake
View
565
Download
9
Embed Size (px)
DESCRIPTION
This variation of an earlier mobile accessibility presentation was given to engineers at Intuit's Bangalore office. It has been updated with new information on Android, FirefoxOS, and Windows8
Citation preview
• This presentation: Slideshare.net/7mary4
• Photos from Flickr via Creative Commons licensing
• Accessible version of talk: last-child.com/mobile-accessibilty/
Windows 8
• Windows 8 components are accessible
• Essentially HTML5 wrappers
• Extensive gesture support
• Verbose feedback on elements
Windows 8 Phone
• Narrator is not available• High contrast setting• Screen magnifier• Text zoom• Talking caller ID• Speech commands
FireFox OS
• HTML5 apps and OS
• Open Source
• Future: screen reader, zoom
• Build and test now with emulator or build with Android device
iOS isAccessibilityElem
ent// if a UIView implements the container protocol, it cannot be an accessible element
- (BOOL)isAccessibilityElement{ return NO;}
AndroidsetFocusable() | isFocusable() |
requestFocus()
<RelativeLayoutandroid:id="@+id/row_type"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_margin="2dp"
android:focusable="true" >
ExploreByTouchHelper
•Introduced at Google IO 2013
•Helper class that makes it easy to create accessible custom views
•Provides dimensions, locations, text, and action
•Re-use classes from visual design
HTML5<a> & <button>
Best: <button>Share This</button>
Good: <a href=”#sharethis” role=”button”>Share This</a>
Works, but avoid:<div role=”button” tabindex=”0”>Share This</div>
<div id="cb" role="checkbox"> Spam</div>
var checkbox = document.getElementById('cb');
checkbox.tabIndex = 0; // make the div focusable
checkbox.focus();
HTMLfocus()
iOSaccessibilityLabel |
accessibilityHint
quantity.accessibilityLabel =@”Quantity”;
quantity.accessibilityHint =@”Increase desired quantity.”;
AndroidcontentDescription
<ImageViewandroid:id="@+id/local_deals"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="16dp"
android:contentDescription= "@string/local_deals"android:focusable="true"android:src="@drawable/ic_menu_local" />
HTML<img alt=”GoPayment” ...>
<label for=”name”>Name</label>
<input title=”Search”...>
<input aria-label=”Area Code” aria-describedby=”phoneError” ...>
iOSUIAccessibilityPostNotific
ation
-(void)helpDidClose:(ZBEHelpView *)view{ [helpView removeFromSuperview]; helpView = nil; [self unease];
UIAccessibilityPostNotification ( UIAccessibilityScreenChangedNotification, statusView); // statusView instead of nil tells this where to place the focus.}
AndroidAccessibilityEvent
private void announceForAccessibilityCompat(CharSequence text) { if (!mA11yManager.isEnabled()) { return; }
final int eventType; if (Build.VERSION.SDK_INT < 16) { eventType = AccessibilityEvent.TYPE_VIEW_FOCUSED; } else { eventType = AccessibilityEventCompat.TYPE_ANNOUNCEMENT; } final AccessibilityEvent event = AccessibilityEvent.obtain(eventType); event.getText().add(text); event.setClassName(AccessibleCanvas.class.getName()); event.setPackageName(mContext.getPackageName());
mA11yManager.sendAccessibilityEvent(event); }
accessibilityViewIsModal (iOS5)A Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver.
accessibilityPerformEscape
Implement this method on an element or containing view that can be revealed modally or in a hierarchy. When a VoiceOver user performs a dismiss action, this method dismisses the view. the popover.
Ted DRAKESr. Accessibility EngineerIntuit Accessibility, [email protected]
h: last-child.comt: @ted_drakes: slideshare.net/7mary4f: flickr.com/draket