1. HOME
  2. セミナー
  3. アクセシビリティのセミナーに参加してきました

アクセシビリティのセミナーに参加してきました

セミナー

10/24にトライデントコンピュータで行われた「アクセシビリティから始まるWebサイトのUXデザイン」に参加してきました。
お話を聞いて、わたしが個人的に自分でもできる意識しなければいけない点についてまとめておきます。


アクセシビリティとは

IT分野では、使いやすさや利用しやすさを意味するユーザビリティに近い意味として使われることが多い。この場合、技術に依存せずさまざまな情報端末やソフトウェアから利用できることを目指している。

Wikipedia より

代替テキストの指定

代替テキスト(=alt属性)で大切なことは

  • 適切に指定をすること
  • つけすぎないこと

だそうです。

つけすぎないというのは、装飾など意味を持たない画像には無理に画像はつけたりせずに空の代替テキストにしておくべき、という意味です。
しかし注意などのマーク(三角に「!」の注意マーク)は意味のある画像になるので、「注意」などと代替テキストの指定をする方がいいみたいです。

CSSによる画像置換について

CSSの画像置換とは
HTMLでテキストを置く
    ↓
CSSでテキストを隠す
    ↓
CSSで背景として画像を置く
というもので、この場合

  • ハイコントラストモード時に黒で塗りつぶされてしまう
  • 印刷時に画像がでない

など予期せぬことが起きてしまいます。
そのため意味のある画像、代替テキストが必要な画像は背景にしないで前景におくことを意識してすることが大切なようです。

ハイコントラストモードとは

ハイコントラストは、視覚に障害のある方のためのユーザー補助機能です。ハイコントラストの配色では、標準とは異なる色の組み合わせで画面のコントラストが強調されるため、ユーザーによっては画面が見やすくなる可能性があります。

人類みんなごくつぶし より

WCAN Autumnでもaltについてのお話もありそちらの記事でも書きましたが、altを適切に指定することはアクセシビリティ上でも、SEOから見てもとても大切なので、やはりとても重要な部分だと思いました。
わたし自身altは空にしたまんまだったりと気にしていないことが多く、ここをまずは治すことが課題だと思いました。
スクリーンリーダーや、ハイコントラストモードは通常使うことはないので、目で見える範囲でしか指定をしていなく忘れがちなものだとも感じました。まだ一度も使ったことがないので、一度使ってみるもの必要だと思い、マークアップ時には見た目だけでなくそういった面もしっかり確認しながら作業を進めるようにしようと思います。

視覚に依存せずテキストで示す

  • 色に頼った表現はNG
    → × 赤の部分は必須です ◯ [必須]をつける
  • 配置に頼った表現はNG
    → × 右上の写真をクリック! ◯ 見た目だけではなく名前で。◯◯ボタンをクリック!
  • 文字の装飾に頼った表現はNG
    → × 打ち消し線などスクリーンリーダー不可 ◯ テキストも併記(通常価格、特別価格)
  • グラフなどはalt属性では難しいので下に元データの表などを書く
  • 充実したキャプションをつける

といった5つの点が視覚に依存せずテキストで示す上で重要なこととしてあげられました。

配置に頼った表現についてわたし特に意識をして気をつけようと思いました。
[必須]や打ち消し線などについてはどこのサイトでも見られますが(いい方で。)、
配置に頼った表現はたまに見る気がします。位置でボタンなどを指定すればマークアップする側としてはとても簡単ですが、やはりユーザから見ると不便に思う方もいるんだなあということがわかりました。わたしもこの点は絶対にやってしまいそうな店なので気をつけたいです。

キャプションについてもこちらも気をつけたいと思いました。
お話のなかで例にでた、表情や感情なんかはaltに入れてしまうとスクリーンリーダを使えばわかりますが、目でのみ認識している人にはわからないことがわかりました。



アクセシビリティというと難しくてわたしには程遠い話しのような感じがしていましたが、お話を聞いて、将来就職したことに役立ちそうなことから、今のわたしにも十分できることが見つかりました。
見た目で重視してしまうと視覚でとらえられない方には伝わらないものがでてきたり、だからといって上のようにaltに全ていれてしまうと、視覚としてとらえられないなど、どちらかを重視することでどちらかが欠けてしまうなんてことも十分ありえると感じました。

お話の最後に「アクセシビリティは0か100かではない、より多くの人に情報が伝わればいい。」とありました。
関係ないからといってどちらかを放棄したり、怠ったりせず最善の策ができるようにこれから心がけていきたいです。


アクセシビリティ
イベント
勉強