!important 04 -特盛！アクセシビリティスペシャル-
2017年6月3日に行われた「!important #04 -特盛！アクティビティスペシャル-」に参加してまいりました。
詳細は６月５日に書いた part1 に書いてありますのでご覧にただければ幸いです。
６月６日には２番目に登壇された神森さんのセッションについての感想
６月７日には３番目に登壇された澤田さんのセッションについての感想
もそれぞれ書いてますのでご覧いただけましたら幸いです。
今日は最後に登壇された 植木さん のセッションについて 感想を書いていきたいと思います。
インフォアクシアの 植木さん からはこんなテーマでお話いただきました。
ユーザビリティストのすゝめ
植木さんから CSUN Conference についてのご報告がありました。
CSUN 2017 Home | 32nd CSUN Assistive Technology Conference
写真が紹介されました。
スティービー・ワンダーさんも開催されるたびにどこかのタイミングでやってくるそうです。
アクセシブルカラオケっていうのがあって
歌に合わせて手話があったりするのが曲の雰囲気にあわせて激しくギター弾いていたり静かにピアノを奏でていたりしてくれるそうでそういうの見てみたいな〜と思いました。
植木さんがこのCSUNで発表したテーマは「Older Users」
“Designing Accessible Web Content for Older Users”
Slides at https://t.co/nOg7IPD62i#CSUNATC17Thank each of you for joining me today!!!
— Makoto Ueki (@mak_en) 2017年3月3日
植木さんのツイッターで資料を発見しました。
Accessible Web Content for Older Users
中身は英語ですが見ているとなんとなくわかりますｗ
年齢を重ねてくるとだんだん若い頃とは違ってきます。
目が悪くなったり耳が聞こえなくなったり手の感覚が鈍くなったり・・・。
そういったことにコンテンツが対応していく必要があってそれにはテストも必要ですよね〜ってことで。
植木さんのセッション、ここからはいろいろな箇所についてメスがいれられます。
タイトルについて
ウェブコンテンツにとって重要なタイトル。
ページタイトルにはこんな定義があります。
『ユーザビリティストのすゝめ』
植木 真さんのセッション #important04
JIS X 8341-3:2016
2.4.2 ページタイトル
ウェブページには、主題または目的を説明したタイトルがある
（レベルA）— !important '17/10/14 (@important_sem) 2017年6月3日
タイトルはそのページのコンテンツを適切かつ簡潔に説明しているかということが重要なんですね。
わかっているようで、特にブログだとテキトー（もちろん悪い意味で）に付けちゃいがちな私がいます。
ウェブ検索していると近年は PDFファイルのタイトルも検索結果に表示されています。
・・・ということでPDFについてもタイトルが重要です！！
※このタイトルはリンクテキストなのか内部情報のタイトルなのか、PDF文章中の大項目などなのか・・・諸説あります。混合だったりするかも。
リンクについて
リンクについても定義があります。
『ユーザビリティストのすゝめ』
植木 真さんのセッション #important04
リンク先の内容がわかるリンク文章にしましょう。
「こちら」はもちろん、「詳細を読む」では伝わらない・・・— !important '17/10/14 (@important_sem) 2017年6月3日
リンク先の内容がわかるリンク文言にすることが重要なんですね。
このあたりはタイトルと共通しています。
要するにわざわざリンク先を閲覧しないと内容がまったくわからないようなリンク文言ではいけないということです。
例えば・・・これはわかりやすいのですが
この文言では先にある内容はまったくわかりません。
・・・よくやってますけど・・・。
これを回避するには先の内容をちょっと紹介するような文章であるとか、ときには要約するような文言だと重要性も判断しやすいですよね。
プログラマ的に言うとこういう先の内容を紹介しながら「詳細を見せる」っていうのも結構厳しいので、例えば・・・
商品一覧から一商品選択するような「詳細を見る」リンクの文言としては
※あくまでも例です。
というようにこのリンクを押すとスペック情報が詳しくわかるんだな・・・っていうことがわかるようにすれば良いのかなと。
この文言なら商品名さえわかればいいですしね。
「詳細を見る」リンクが １ページ中にたくさんあってそれを「TABキー」で飛ばしながら知りたい商品の詳細ページに遷移させるには商品名をリンクに含めるのは有効だと思います。
読み上げリーダーが「詳細を見る」ばかり何度も言っていたら、果たして今回の「詳細を見る」はなんの詳細なのか、そのあたりを読み直す必要が出てきて手間がかかるというものです。
コントラスト比について
ついつい忘れがちなのがページの中のコントラスト比。
背景と文字の色が近似色だと判別をやりずらい。
周りの色に埋もれない工夫が大事。
『ユーザビリティストのすゝめ』
植木 真さんのセッション #important04
色のコントラスト比
4.5:1 必要
カラー・コントラスト・アナライザーでチェックできる— !important '17/10/14 (@important_sem) 2017年6月3日
コントラスト比は最低でも 4.5:1 必要ということ。
カルーセルについて
カルーセルとかスライダーとかスライドショーとかいっているあれです。
個人的には全く気になってなかったのですが、実際にまじまじと見ると画像切替のタイミングで読みきれないサイトがかなりあります。
そういえば・・・なんですが、カルーセルで画像の上にカーソル持っていくとその間ストップしているものをよく作ります。
あれってこういう意味があったんだー！今気がついた（笑）
カルーセルって、使っていいの？（Should I Use A Carousel? 日本語訳） | https://t.co/35thQZZhHa #important04
— 澤田スタンダードデザイン (@SawadaStdDesign) 2017年6月3日
植木さんがこんなテストカルーセルを作っています。
このタイミングでは確かに読めない・・・・。イラッとするｗ
テストでは９９％がクリックしないか１枚めだけクリックしたそうです。
・・・ということは設置したところで１枚画像と同じ？？いや、１枚めがずっと出ているわけではないのでもっと少ないってことですよね。
「カルーセルを止めましょう」
を言うためには、2枚目以降がクリックされてないことをGoogle Analyticsとかでイベント設定して数字見せる努力を制作側もやっていかないといけないなーって改めて思った#important04— 俳人 我流（ウエスター） (@Garyuten) 2017年6月3日
我流さんの仰る通り。
制作者の段階ではすでに「カルーセル」であることが決まって降りてくることが多いので、すでに抵抗できない状態だったりします・・・。
