WordPress ウィジェットのアクセシビリティモードの利用

公開日

WordPress の「外観」→「ウィジェット」の設定画面の右上の「表示オプション」から「アクセシビリティモードを有効にする」を選択するとウィジェット画面のモードを切り替える事が出来ます。
表示や操作方法が変わり、使い難いと感じる方もいるかもしれません。
そもそもこのモードは必要なのか? 何の為に有るのか?
それを考える事でアクセシブルなウェブサイト制作、ウェブアクセシビリティの理解の助けになるかもしれません。

ディスプレイは必ずしも必要ではない

ネットを見る時、視覚障害者は主にスクリーンリーダーという音声読み上げソフトを利用して情報を聞き取っています。
ディスプレイの表示に頼らなくとも、マウスカーソルの当たっている文字を読み上げたり、キーボード操作でカーソルのフォーカスの当たっている文章を読み上げるといった事でウェブ閲覧を可能にしています。
そのスクリーンリーダーユーザーが WordPress 制作側に回ると、このアクセシビリティモードは大変有用なものになります。

ドラッグ&ドロップは困難

キーボード操作でのドラッグ&ドロップは複雑な操作を必要とし、マウスを使ったドラッグ&ドロップも、目を閉じたまま作業する事を想像すれば、困難なのは容易に理解出来ます。
アクセシビリティモードでは、このドラッグ&ドロップ操作を無くし、ウィジェットに「追加」ボタンが設置されており、Tab キーでボタンに移動し Enter で決定といったキーボード操作が可能となっています。

操作はテキストで明確化

ウェブサイト上に鉛筆マークの編集ボタン等が設置されているのを良く見かけますが、スクリーンリーダーユーザーにはそれが何であるか分かりません。
アクセシビリティモードでは「編集」とテキストで明確に示され、他の操作についても「削除」や「保存」とテキストで表示されています。
ウィジェットの編集画面では、同じウィジェットの設置場所に複数のウィジェットが設置されている場合、その順番を「1」「2」と数字で並び替える事が出来ます。

また、各ウィジェットとウィジェットの配置エリアには<H2>、<H3>タグが設定されており、スクリーンリーダーユーザーはこの見出しを辿って目的の項目を見付ける事が出来ます。
論理的な見出しタグの記述は、支援技術に対してだけでは無く、ウェブサイト制作において推奨されているものです。
世界中で開発されている WordPress のアクセシビリティモードを参考に、キーボード操作を意識する事で、それがそのままウェブアクセシビリティを意識したアクセシブルなウェブサイト制作に繋がるのではないでしょうか。