アクセシビリティに対応したリーディング体験を作り出す

(音楽)

テキスト読み上げ機能の ユーザ体験にようこそ アクセシビリティチームの ダレン･ミニフィです

いいアプリケーションには 優れたインターフェイスが必要です 長文を表示する アプリケーションなら― レイアウトやテキストスタイルが 重要です テキストレイアウトのカスタマイズに 使うのはCore Textなどのローテクですが ここではVoiceOverという優れた 読み上げ機能のAPIや技術を紹介します

最初は 読み上げプロトコル テキストコンテンツを アクセス可能にします 次に自動ページめくり ページ移動を可能にします 最後に読み上げのカスタマイズに 使用するAPIです

サンプルのアプリケーションを 使います

ページベースで― イメージ タイトル 詳細なテキストで構成されています

まずVoiceOverで監査します

ショートカットに追加すると 便利です “設定”を開き― “アクセシビリティ”をタップ ショートカットから― “VoiceOver”をタップ ハードウェアによっては― ホームボタンかサイドボタンを ３回 押すと設定と解除が可能です

ではVoiceOverで 確認してみましょう

VoiceOverオン (警告音) 画面上をドラッグし― コンテンツが見つからないと 警告音が鳴ります まずテキストコンテンツを アクセス可能にする必要があります

そのためには― UIAccessibilityReadingContent プロトコルを使います メソッドは４つです accessibilityLineNumber(for pointは 触った箇所の行番号を返します accessibilityContent(forLineNumberと accessibilityFrame(forLineNumberは それぞれの行のコンテンツと 矩形を返します accessibilityPageContentは コンテンツのページを返します

では具体的にプロトコルを 組み込む方法を見てみましょう 各ページはSessionItemViewの インスタンスで表現されます

ここのサブビューは４つ イメージビュー タイトルラベル 識別子ラベル 詳細ビューです

さらにLayout型を宣言します これはメソッド組み込みに 役立ちます

まずページビューをアクセス可能な 要素にするため― isAccessibilityElementを trueに設定します

次に読み上げプロトコルを 組み込みます 最初のメソッドは accessibilityLineNumber(for point 行番号を利用してページビューに hitTestを実行します 結果ビューが 既知のサブビューなら― Layout型の値に関連付けます 最後に VoiceOverが理解する表記の rawValueを返します

次はaccessibilityContent (forLineNumber まずLayout型のインスタンスを 生成します スイッチ文でケースを処理し 既知のサブビューに関連付けます 最後にテキストを返す アクセシビリティラベルを返します

accessibilityFrame(forLineNumberの 組み込みも同様です まず与えられたraw値でLayout型の インスタンスを作成します スイッチ文でケースを処理し 既知のサブビューに関連付けます そして矩形を表す アクセシビリティフレームを返します

最後は accessibilityPageContentです 既知のサブビューからテキストを集め １つの文字列として返します

ではVoiceOverの動きを 確認してみましょう アクセシブル ドラッグ＆ドロップ セッション241 ドラッグ＆ドロップは高機能なAPIです 画面を指でドラッグすると― 音声が流れ テキストがハイライトされましたね

次は自動ページめくりです コマンドが呼び出されVoiceOverが すべてのテキストを読み終わると― ページをめくる必要が出てきます この機能の組み込みには ２つのAPIが必要です まずページビューに causesPageTurnを含めます 次に 方向を決める accessibilityScrollを含めます これでページめくりが 可能になります 組み込み例を見てみましょう

まずcausesPageTurnを含めるため― ページビューの初期化子に トレイトを設定します

次にaccessibilityScrollで 方向を決めます スイッチ文で方向パラメータの ケースを処理します 方向がpreviousかleftならば 前のページに戻る要求を出します 処理が通るとpageScrolledの 通知を出します

同様にrightかnextならば ページを進める要求を出します 処理が通るとpageScrolledの 通知を出します

では自動ページめくり機能を 見てみます アクセシブル ドラッグ＆ドロップ セッション241 ドラッグ＆ドロップは 高機能なAPIです 導入理由にかかわらず― 多様なニーズに応えます ぜひ お試しください (効果音) iOSに話をさせるAVSpeechSynthesizer セッション236

最後は音声のカスタマイズです VoiceOverの話し方を 変えられる機能です 読み上げプロトコル内で 代替メソッドを２つ使用します これらのメソッドは NSAttributedStringを返します アクセシビリティ属性を付与し― 読み上げ方の 様々な特徴を設定します

例えば 他言語の文章を 希望する場合は― 言語の指定子と共にaccessibility SpeechLanguage属性を含めます VoiceOverが 最適な音声を選びます

〈凱旋門〉

より詳細な設定をすることも 可能です その場合はIPA表記を― accessibilitySpeechIPANotation 属性で使用します ヨセミテ国立公園

VoiceOverの優れた読み上げ機能の 生成には― まずテキストコンテンツを アクセス可能にするため UIAccessibilityReadingContentを 組み込みます 次に自動ページめくり機能 これでVoiceOverが 全文を読むことが可能になります 最後にVoiceOverの音声を 設定します 読み上げプロトコル内で NSAttributedStringを利用し― 適切なアクセシビリティ属性を 付与します

詳細は上記のセッションURLを ご覧ください

ありがとうございました