Help us understand the problem. What is going on with this article?

Xcode 11 の Accessibility Inspector がとても便利

More than 1 year has passed since last update.

WWDC 2019 の Accessibility Inspector の動画から、Xcode 11 のアクセシビリティインスペクターの機能について紹介します。

アクセシビリティ対応をしようと思ってもどこから手を付けていいかわからなかったり、そもそもどこがアクセシビリティ観点でマズイのかわからず困ったりすることもあったと思います。が、Xcode 11 のアクセシビリティインスペクターは普段のコードのデバッグと同じように問題点を見つけ、修正することができます。一度触って体感してみてください。

※ここに貼っている画像は、上記動画をスクショしたものです。

Accessibility Inspector の起動方法

メニューバーから Xcode -> Open Developer Tool -> Accessibility Inspector で起動できます。
スクリーンショット 2019-08-17 21.24.59.png
ターゲットを選択するとこのような画面になります。
スクリーンショット 2019-08-17 21.26.49.png

対応が必要な箇所を見つけるには

右上には3つのボタンがあります。
スクリーンショット_2019-08-17_18_22_32.png
Audit(検査?)タブから「Run Audit」をクリックすると、アプリ内に存在するアクセシビリティ上の問題点が一覧で表示されます。
スクリーンショット 2019-08-17 18.33.27.png
クリックするとアプリの対象箇所がハイライトされます。
スクリーンショット 2019-08-17 18.36.19.png
行の右端の「?」マークをクリックすると、修正方法のサジェスチョンが出てきます(この例ではaccessibilityLabelの設定を勧められています)。
スクリーンショット 2019-08-17 19.20.38.png
右上インスペクタボタンをクリックし、さらに Start inspection follows point ボタンをクリックしてからシミュレータの画面要素をマウスオーバーすると、アクセシビリティに関連する様々な項目を見ることができます。また、Speak ボタンをタップすると VoiceOver を使っている時と同じように音声を再生してくれます。
スクリーンショット 2019-08-17 19.25.48.png

アクセシビリティラベルを変更する場合

ここで、例えば画像のラベルが単なる画像ファイル名になってしまっていること、ボタンのラベルが機能を的確に表していないことなどが判明したとします。その場合はコードで適切なラベルを設定する必要があります。

button.accessibilityLabel = "Buy"

もしデフォルトでアクセシビリティ対応がされない要素を使っている場合は自分で対応させる必要があります。方法としてはフラグを立て、ラベルを付与するだけです。

view.isAccessibilityElemment = true
view.accessibilityLabel = "\(brandName)"

コントラスト比を高めるには

コントラスト比が適切でなかった場合もちゃんと警告が出てくれます。
スクリーンショット 2019-08-17 19.54.33.png
アクセシビリティインスペクタの Color Contrast Calculator を使うと、推奨値以上のコントラスト比を確保できる色がなんなのかを簡単に知ることができます。メニューバーの Window から Show Color Contrast Calculator を選択するとツールを表示することができます。スライダーをずらせば元の色合いを変えることなく、コントラスト比の高い色を探せます。
スクリーンショット 2019-08-17 21.19.27.png

akatsuki174
iOS→Androidエンジニアになりました。それなりに使える言語はSwift, Objective-C, Kotlin, Java。 UX, データ分析, グロースハック, デザイン, 自然言語処理にも興味あり。 1分野に固まらず、いろんな分野のことについて書いていこうと思います。
techtrain
プロのエンジニアを目指すU30(30歳以下)の方に現役エンジニアにメンタリングもらえるコミュニティです。
https://techbowl.co.jp/techtrain/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away