ウェブがかり

アナログ好きですがウェブの仕事してます。ウェブの話、日頃の話をつれづれと。

Webアクセシビリティの学校 in 山口 参加レポ

こんばんは、ウェブがかりのサチコです。

今月は怒涛の勢いで、参加レポを書きまくっております。

10月の後半からハイペースでいろいろなセミナーに行きました。11月は後半で4つ参加…ちっとも参加レポ追いついてなくてすみません!

 

前回の記事は開催日を間違って書いていたり(訂正しました)、誤字がいくつか見つかったり、日本語がおかしくて文賢にツッコミいれられたりました。

こんな疲れ気味のわたしにもやさしく指摘してくれる【文賢】文賢

気遣いの玉手箱や〜(わたしは元気です)

 

さて、本題いきますね( ´ ▽ ` )ノ笑

今回は少々さかのぼりまして、11月23日に山口で開催された『Webアクセシビリティの学校 in 山口』の参加レポです。

f:id:analogtan:20171208222342p:plain

講師は株式会社インフォアクシアの植木真さん。

ウェブアクセシビリティ基盤委員会(WAIC)の委員⻑も務めていらっしゃいます。

このセミナーも非常に学びが多かったので、読んでいる方にしっかり伝えられるようにがんばります!

1時間⽬「Webアクセシビリティとは?」

f:id:analogtan:20171208222555j:plain

会場:mirai365 多目的スペース

セミナーのタイトルの通り学校なので、ちゃんと時間が分けられてました♪

まずは、1時間⽬「Webアクセシビリティとは?」からスタート。

最初に植木さんから「この中で、アクセシビリティやってる人はいますか?」と質問。

そこではあまり手が上がらなかったのですが(私もあげてない)、

「ウェブの仕事をしている人は、実はみんなアクセシビリティやってます!」と言われました。(そうなの!?)

 

もともとWebアクセシビリティは、障害のある⼈がWebを使えることというのが基本的な考え方。

ですが、いまはもっと広い意味合いで捉えることが多くて、障害のある人だけでなく、高齢者なども含め誰もがWebを使えるように、という考え方になってきているのだそう。

 

アメリカではAmazon、ディズニー、サウスウエストエアラインズなどの企業ですでに訴訟や苦情があったとのこと。

欧米はWebアクセシビリティについて対応が法的にも進んでいますが、日本は昨年の2016年4月から「障害者差別解消法」で取り組みはじめたばかり。

この中で民間企業はまだ努力義務にとどまっているものの、大手はすでにWebアクセシビリティの方針等を公開しているところが増えています。

アクセスが多い(つまり利用者が多い)ほど、今後ますます対応が求められるというのは想像できますよね。

 

ちなみに、世界で初めてアクセシビリティの訴訟が起こされたWebサイトは

シドニーオリンピックのサイトなんだそう。

日本も東京オリンピックにむけて準備が進んでいますが、まさか関係してくるとは(受注したところ大変だなぁ…) 

 

ただアクセシビリティは一部の人のためにやるというよりも、全体のユーザビリティの向上につながる内容が非常に多いと感じました。

世界的なアクセシビリティのガイドラインにある内容は、障害がある人だけでなく、高齢者の人にとってもユーザビリティが向上する内容が多いだそうです。

日本は高齢化が進んでいるので、どちらかといえば高齢社会の備えとしても早急に対応を進めた方がいいのではないでしょうか。

ちなみにガイドラインはこちらを参考にすると良いようです↓↓↓

weba11y.jp

2時間⽬「アクセシビリティ確保の基本」

f:id:analogtan:20171208222337j:plain

山口駅の近くにあった謎の「ザビエル」という案内標識。答えは後ほど

ますます加速するユーザーの多様化で、コンテキストが幅広くなってきている状況。
そんな中でどのように「みんながWebを使えるようにするか」が問われています。

「◯◯できない、▽▽しづらい」って障害のある⼈だけじゃないですよね( ;´Д`)

Webのコンテンツを利用するには、

  • 見る/読む
  • 聞く
  • 理解する
  • 入力/操作する

これらがきちんと満たされていることで、はじめてみんなが使えるよ!ということを具体例を織り交ぜつつ話していただけました。

たとえば「見る」ひとつとってもたくさんあります。

近視や老眼、白内障、コンタクトをなくした、ページをモノクロで印刷した、などなど…視覚から情報を得る上でなんらかの不便が起きることは、だれにでもありえます。

 

「◯◯できない、▽▽しづらい」を「◯◯できる、▽▽しやすい」にして、より快適な利⽤体験を利⽤者に提供するのがアクセシビリティと考えると実践しやすいのでは?と植木さんが参加者へアドバイスをいただきました。

最近だとデザインの分野ではアクセシビリティという表現ではなく、inclusive design

という言い方で取り上げられるようになっているそうです。

 

対応の例として、Webコンテンツをマシンリーダブルにするというものが紹介されていました。

いわゆるスクリーンリーダーなどへの対応を指すことが多そうなのですが、基本としてはテキストとマークアップで対応が可能。

ただ、画像については代替テキスト(imgタグにおけるalt属性)での記述を画像のコンテンツが伝わるようにする必要があるので、ここは注意です( ´ ▽ ` )ノ

つい先日、わかりやすいものをシェアしていただいたのでご紹介!

docs.google.com

3時間⽬「明⽇から実践できるキホンのキ」

f:id:analogtan:20171208222331j:plain

山口サビエル記念聖堂が駅から1kmだそう。アクセシビリティ的にどうなんだ?笑

さて、達成基準(ガイドライン)を読んでも、何をすればいいのか・・・。

まずは「ページの領域」をきちんと分けましょう、というアドバイス!

roleやaria-label、aria-labelledbyなどを使って、ラベリングをしっかりやることがうまくいくコツとのことでした。

ランドマークのroleは将来的には不要になっていきそうとの予測らしいのですが、しばらくは使っておく方がアクセシビリティとしてはよいかなーというお話でした。

最後に明日からできる10項目をまとめていただきました!

アクセシビリティ確保のキホンの「キ」
  1. ページの内容が分かるページタイトルを記述する
  2. ⾒出しやリストなどの⽂書構造をマークアップする
  3. リンクテキストは、リンク先が分かる⽂⾔にする
  4. 情報を伝えている画像に代替テキストを提供する
  5. ⽂字⾊と背景⾊のコントラストを確保する(4.5:1以上)
  6. ユーザーがコンテンツを拡⼤表⽰できるようにする(ブラウザで)
  7. キーボードだけでも操作できるようにする
  8. フォーム・コントロールのラベルを提供する
  9. データテーブルの構造をマークアップする
  10. エラーメッセージではエラー箇所を明⽰する(エラーです、じゃあかんよ)

ちゃんとマークアップ考えてみましたよ!(タグでリスト使ってるだけですがw)

 

最後に、Webアクセシビリティは時代や社会からの要請であり、

アクセシビリティはWebコンテンツの品質基準となるよ!というまとめで終了!

(参加した身としてはふつうのまとめより「ポコ太郎」がインパクト強かった)

 

参考サイトも教えていただきました♪

ウェブアクセシビリティ基盤委員会(WAIC)

総務省|情報バリアフリー環境の整備|みんなの公共サイト運用ガイドライン(2016年版)

Web Accessibility Initiative (WAI) - home page | Web Accessibility Initiative (WAI) | W3C

最後に…

f:id:analogtan:20171208222327j:plain

元祖ばりそば とても美味しかったです!

講師の植木さんをはじめ、この山口での開催に尽力された村上さん、懇親会でお話させていただいたみなさま、ありがとうございました!

 

下記のページで周辺のオススメ飲食店を紹介されててありがたかった!!

mirai365の会場情報 | クリエイティブハント

今度は、ばりそば以外も行けるように余裕のある日程で参ります!o(^▽^)o