ios 7 accessibility

iOS7 AccessibilityTed Drake, Intuit

Friday, January 24, 14

This presentation was created for the Mobile+Web Developer Conference in San Francisco, Jan. 2014

What is accessibility?



This short video by Tommy Edison shows how accessible applications are used by screen reader users. In this instance, he is able to quickly take a photo and share it on Instagram.https://www.youtube.com/watch?v=P1e7ZCKQfMA

Screen Reader


Screen reader software, such as VoiceOver, TalkBack, or Narrator provide an interface between the user and the application.The SR interprets the user’s gestures and the application’s output.Gestures are unique to screen reader usage, this can be surprising for custom gestures that detect onTouch events.


typically a user interacts directly with the phone

VoiceOver


With VoiceOver and other screen readers, the user interacts with VoiceOver.VoiceOver interprets the user’s input and passes it to the application.The application returns a result, which is passed back to the user in their preferred output, such as voice.

VoiceOver Automated Testing


VoiceOver doesn’t care who the user is. You can even use it to run automated testing.VoiceOver is your programable tool to the application’s functionality.

Siri: Turn on VoiceOver


VoiceOver is very easy to use. Simply ask Siri to turn on voiceover. You can also ask her to turn it off.For quicker access, go into settings>general>accessibility>accessibility shortcut and select

Focus & Double Tap


VoiceOver’s gestures are quite simple, swipe with one finger to move from element to element.Use touch exploration to discover what is on a screen. VoiceOver will announce what has been focused.Double tap to activate whatever is focused.Learn more with a four finger double tap

What’s new in iOS7• Dynamic Type• Safari Viewport• Simplification• Blur and Low Contrast• Switch Control• Guided Access• Speech Synthesis• Hand Writing• Magic Tap (iOS6)


Dynamic Type


Dynamic Type is part of UIFont. Choose the purpose of your text and allow iOS to control its proportional size.For instance, choose heading, body, table cellHeadline, SubHeadline, Body, Footnote, Caption1, Caption2

Dynamic Type

message.label.font = [UIFont preferredFontForTextStyle: UIFontTextStyleHeadline ];


https://www.captechconsulting.com/blog/john-szumski/ios-7-tutorial-series-dynamic-typeself.label.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];listen for the font size change, this allows the type to be resized when the user changes their preference.https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/CustomTextProcessing/CustomTextProcessing.html#//apple_ref/doc/uid/TP40009542-CH4-SW65

Safari ViewportGood:<meta

name="viewport" content="width=device-width">

Bad:<meta

name="viewport" content="initial-scale=2.3, user-scalable=no">


Safari for iOS7 has a different layout and treats the viewport differently. You don’t need to disable user-scalable. Just use the basic viewport settings. https://developer.apple.com/library/ios/DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

Simplification


Replace buttons with text = good thingReplacing buttons with icons = some good, some badBe consistent, don’t re-invent the icons. Give icons a label.

Friday, January 24, 14Thin fonts on blurred backgrounds can make your text unreadable for all users, let alone those with low vision.Consider using system fonts to allow user settings.Consider how your text will look with a light and dark background. 4.5:1 is the required ratio for contrast. Does your tint color provide this?https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/MobileHIG/ColorImagesText.html#//apple_ref/doc/uid/TP40006556-CH58-SW1

4.5:1Friday, January 24, 14Thin fonts on blurred backgrounds can make your text unreadable for all users, let alone those with low vision.Consider using system fonts to allow user settings.Consider how your text will look with a light and dark background. 4.5:1 is the required ratio for contrast. Does your tint color provide this?https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/MobileHIG/ColorImagesText.html#//apple_ref/doc/uid/TP40006556-CH58-SW1

Switch Control

Switch Control


iOS7 introduced Switch Control, which provides an interface to all elements of a page, using just a single tap on the phone or external switch. It can also track head movements.Switch Control can also be used to see what elements in your application receive focus.Stephen Hawking NASA 50th photo by NASA http://www.flickr.com/photos/nasahqphoto/3462939589/

Guided Access


G.A. started as a method for care givers to disable sections of applications and devices for people with autism, ADD, and other cognitive disabilities.It is now available to developers. You define roles and the availability of elements within those roles. for example, only show a delete button for editors. Only show options available for a location, i.e. Clover brewing at Starbucks.https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIGuidedAccessRestrictionsDelegate_Protocol/Reference/Reference.htmlCustom restrictions are represented by string identifiers provided by the developer in the guidedAccessRestrictionIdentifiers methodPhoto: access denied by Notanotherusername! http://www.flickr.com/photos/s8an/5489233419/

Guided Access API- (NSArray *)guidedAccessRestrictionIdentifiers { return @[ ControlsRestrictionId ];}- (NSString *)textForGuidedAccessRestrictionWithIdentifier: (NSString *)restrictionId { return @”Controls”;}- (NSString *)detailTextForGuidedAccessRestrictionWithIdentifier: (NSString *)restrictionId { return @”Adjust floor down/up”;}


This sample code comes from the WWDC 2013 presentation: Accessibility in iOShttps://developer.apple.com/wwdc/videos/index.php?id=202

Speech Synthesis

AVSpeechSynthesizer

Friday, January 24, 14The AVSpeechSynthesizer class produces synthesized speech from text on an iOS device, and provides methods for controlling or monitoring the progress of ongoing speech.

Access text to speech engine, also can define language and monitor the status. Use this to create a speech option on your pages for non VoiceOver users.

https://developer.apple.com/library/ios/documentation/AVFoundation/Reference/AVSpeechSynthesizer_Ref/Reference/Reference.html

photo: speech bubbles at Erg by Topsy http://www.flickr.com/photos/wygd/265888499/

Text to Speech API

AVSpeechSynthesizer *synthesizer = [[AVSpeechSynthesizer alloc] init];

AVSpeechUtterance *utterance = [AVSpeechUtteranceWithString: @"Hello!"];

[speechSynth speakUtterance:utterance];



This short video shows how to choose the handwriting option and open the starbucks app by writing the letters “st” on the screen.Handwriting can also be used to write text within text inputs.Watch for this to be expanded in ios8 for all users.http://www.applevis.com/podcast/episodes/activating-accessing-and-using-handwriting-mode-ios-7

Magic Tap- (BOOL)accessibilityPerformMagicTap

Two-fingered double tap activates the key function on the screen.

•Take photo•Start stopwatch•Hangup phone call

Friday, January 24, 14The exact action performed by this method depends your app, typically toggling the most important state of the app. For example, in the Phone app it answers and ends phone calls, in the Music app it plays and pauses playback, in the Clock app it starts and stops a timer, and in the Camera app it takes a picture.

photo: magic tap by ozz13x http://www.flickr.com/photos/24931020@N02/7590427782/

isAccessibilityElementShould an element receive focus?


this can be chosen via interface builder or programmaticallyMake sure this is set to yes for actionable items.Set it to false on parent containers when their children are actionable, i.e. UITableViewCellhttp://developer.yahoo.com/blogs/ydn/defining-isaccessibilityelement-ios-application-53755.htmlThis is important for all VoiceOver and Switch Control users.


This video shows a custom container that includes a date picker and button. The container has accessibility so the picker and button are not available to the user.

photoSet.isAccessibilityElement = YES;


Typically you will not set isAccessibilityElement to true on a UITableView. But if you want this to act as a single actionable item, set this to true.

photoSet.isAccessibilityElement = NO;photoSetRow.isAccessibilityElement = Yes;


this is the default behavior in iOS and you shouldn’t need to set these values.

photoSet.isAccessibilityElement = NO;photoSetRow.isAccessibilityElement = NO;photoSetImage.isAccessibilityElement = YES;


If your UITableViewCell has actionable items, set the cell to NO and place YES on the individual images.This is also commonly seen when a Webview is given focus instead of the website within it.

Ted Drake w: last-child.com t: @ted_drake s: slideshare.net/7mary4 y: youtube.com/7mary4responding p: pinterest.com/teddrake j: intuit.com - Intuit’s hiring: Web, iOS, Android


ios 7 accessibility

Technology