市場とのムヒミさんによる事例から見るアクセシブナーバードプレスサイトの運用現場の実際という特摄ションです。市場さん今日は京都から来られたということで、有限会社時代候補の代表としては、あんまりアクセシビリティの普及などの活動されているということで、マイク、そこはスイッチ入れると。みての通り、こういう内容をお話ししていただければなっております。じゃあ早速ですが、よろしくお願いします。よろしくお願いします。では、事例から見るアクセシブナーバードプレスサイトの運用現場の実際ということで、お願いします。まず、僕についてですけれども、有限会社時代候補という、今アクセシビリティの啓発をしているというふうに紹介いただいたんですけれども、電気として、栄力企業です。京都のウェブ製作会社の代表取締役をやっています。あと、株式会社スタジオニクロムというのは、障害者の就労審事業所をやっていて、そんなところでも障害者当事者がウェブサイトを作るのの作り方を教えたりしています。あとは、ウェブアクセシビリティ基盤委員会ウェイクという団体があって、後でまたご紹介しますけれども、そこのWGGというのが候補を担当している文化会なんですけれども、そこの委員をしています。そこでは、ウェイクのサイトの運営のお手伝いをしています。技術としては、PHPばっかり書いていて、JavaScriptに関しては、家族と要請を過ごしたかったらあんまり書くなと、健康に悪いので書くなということで、一緒に止められています。懐かしいんですけれども、ズープス、ブキューキ、ゼンドフレームワーク、それらを経てワードプレスなんですけど、昔オープンソースのカンフレンスに来ると、ワードプレスの机というのは本当に人がいなくて、つのまにこんなに大きくなったのかなと思うんですけど、昔はズープスの机にずっといたので、なんとなく仲間を裏にいったような気持ちで、ここに立っています。趣味は飛ばしますね。早速本来に入っていきます。ユーザビリティ・トアということなんですけれども、ここに座っている人たち言わなくてもいいような気がするんですが、障害の生む、真心の状態、エツラン環境、年齢などとはず、情報を取得できるようにすることというのがアクセシビティの定義だと思います。類儀語として、ユーザビリティ・ユニバーサルデザイン、アクセシビティという言葉があるんですけれども、若干違いがあるので、この違いからちょっと理解が深まるかなと思います。ユーザビリティは使いやすさですね。ユーザビリティ・ユニバーサルデザインというのは、一つのものが普遍的に使えること、例えばよく例で上がるのが、左利きでも右利きでも使える挟み、というのは一つのプロダクトで解決しよう、ユニバーサルデザインにしようというのが例の一つだと思います。で、アクセシビティというのは情報の取得可能性、最近はインクルシブなんという言い方もされます。それぞれユーザビリティ、ユニバーサルデザイン、アクセシビティで重なる部分はあるんですけれども、使いやすさや単位のプロダクトの解決よりも、情報取得できるかどうかというゼロ一の問題が重視されるというようなシースがあります。ので、視覚障害者専用のページというのを作ると、やっぱり制観者に使いやすいわけではない、単位のプロダクトがないので、ユニバーサルデザインではないんですけれども、アクセシビティの解放としてはあり得るということかなと思います。アクセシビティは障害者と高齢者というのが主役としてよく語られます。そのバリアの例ということで、視覚障害者全盲ということで、視覚障害者全盲は画面見ることができない。マウスを使うことができない。弱視だと、絶対的に読みづらかったり、部分的に読めない。視野の一部が見えないとか、視野が協作してるとか、そういうことがあったりして、見えないものがある。小さいものが読めない。小さいものしか読めないとか、そういうこともあるんですけれども、マウスが使いづらい。聴覚障害の場合だと音声を聞くことができない。視覚障害だとマウスを使いづらい。視覚障害の人はやっぱり難しい言葉がわからないとか、早く読むことができない、早く理解することができない、というのがあります。ビスレクシアをここに入れていいのかわからないですけど、こんなのがありますね。注意力、鉄管障害。コンテンツに集中しづらい。高齢者、いろいろな要素を試さないでいて、何かと大変だ、というのがあります。障害がなくても、アクセシビというのを、入門辺では喋らなきゃいけないことになっているんですけど、障害者のためだけのものでありませんよということを、皆さん顔を見ていると、もう知っとるわい、という顔をしてやるんですけども、一応言いますね、ご約束なので。メガネが壊れたり、日光で画面が見づらいというのが視覚障害に近い状態ですよと。周りが騒がしい、音声出力のない端末を使っている。職場なおで音が出せない。なんで職場なおに音が出せないのが問題なのかわからないんですが、職場なおに音が出せない。これは聴覚障害に分類。腕を怪我しているというと、上脂障害。マウスが壊れたというのは、面白いんですけど、技術的に視覚障害や上脂障害と状態、この人たちはキーボードを使うしかないですよね、ということがある。疲れて、ヘロヘロになってると。これは、二階用意なども、含む感じですけれども、注意力を受けばかん障害。年をとると、やはりフルオープンですよね、障害の。聴覚障害、視覚障害、上脂障害、さまざまな障害を兼ね備えている状態が、高齢者の状態として立ち現れてきます。こういった類似の状況というのは、誰に出回り得ますよ、ということです。では、こういった障害のある方や、障害なる状況を乗り越えるやり方というのが、画面が見えないんだったら、スクリーンリーダーを使って、画面を読み上げる。画面が見えないから、入力難しいので、音声入力の支援を使う。マウスが使えないので、キーボードを使う。視覚障害の弱手の場合だと、画面拡大のソフトやこういうアプリケーションでの解決ではなくて、物理的な虫眼鏡を使って、画面を拡大している視覚障害者もたくさんいます。調拡障害の場合だと、音声についての問題ですので、字幕の利用や手話の利用というものがあげられます。上障害の場合、特殊なポインティングデバイスというのは何かというと、ポインティングデバイスという言葉がわからない人います?みんなわかる。皆さんだから、本当はアクセシビってのことを知ってきているんですよね、ここに。口だけで操作するマウスとか、そういったものがあるんですよ。足で操作するポインティングデバイスとか、そういったものを利用して、マウスの代わりにする。どんな時でもキーボードというのがやっぱり便利で、キーボードって物理的なキーボードだけじゃなくて、ソフトやキーボードみたいなものもこのキーボードの反応で語られます。地域障害の場合だと、平易な内容の大体コンテンツの利用、注意力、結冠障害の場合だと、注意力を満たすコンテンツを避ける。これ、後で具体的にもうちょっと補足します。高齢者はやっぱり何かと大変だと思う。で、日本のアクセシビティに関する法律、興味のない人、皆さん興味あるんですね。本当ですね。食べてますよ、じゃあ僕。というのは、一応アクセシビティの、ワードキャンプの過去のアクセシビティのセッションを見たら、一応皆さん触れてるんですよ、これに。だから、僕も触れておこうかなと思うんですけど、そんなに大事かなというのは、まあでも触れますね。えっとですね、2013年にですね、障害者差別解消法というのが整点されます。で、これは国際条例の、国際の条約のですね、締結のための準備だと言われていたらしいです。なので、その翌年に権利条約に移順します。で、まあ結構遅めの秘順だったみたいなんですけれども、これでまあ国の中で、障害者についてその、国際的な枠組みの中に事務達も入っていこうという準備ができたという形になります。面白いんですけど、条約って、法律に優先するんですよね。ので、まあ条約で決めた側には、法律もどんどん従っていくというか、法律で定められていない部分をどんどん補強していこうという流れができた。で、16年、おととしてですね、差別解消法が施行されます。で、差別解消法はですね、罰則などは存在しないんですけども、民間団体は努力義務が求められています。で、まあ県立条約、さっきその法律に優先するとか、ちょっとにやかな話をしたんですけれども、旧条にですね、アクセシビティという公文家ってそこで、モロアクセシビティのことが書かれています。定約国は全ての当事者にインターネットを含めたアクセシビティの提供を行うためのあらゆる適切な措置を講じ、それを妨げる問題を撤廃する。で、まあそれを受けてですね、一部の人がサベ解放って言ってるんですけども、このサベ解放で、アクセシビティは差別の禁止、環境の整備、合理的配慮、これがですね、サベ解放の中の3本柱なんですけれども、この中の環境の整備でアクセシビティは求められています。もうちょっと厳密な話をすると、例えばWebサイトにわからない情報があったので、電話をして解決するというようなことがあった場合、これは合理的配慮の文脈に語られるのかなというふうに思います。で、アクセシビティの確保の仕方ということでという団体があります。で、Webアクセシビティ基盤委員会という団体で、日本におけるJIS-X834132016の理解と普及の促進をする団体、で、もともと実装を作った団体がそのまま普及啓発の団体になったという流れだと理解しています。で、このWebがやっているサイトのWebJPにはアクセシビティ確保のための脳波が蓄積されているので、困ったらここを見るというのが確保の仕方の第一歩です。JIS-X83413の2016というのはですね、アクセシビティに関する日本工業企画です。WCAG-2.0国際企画化したISO-40500を順用。で、WCAGに関しては2.1がこの6月に勧告されています。で、今、もともよってWCAGという言葉やISOの名前を出したんですけれども聞いたことない人ほら、やっぱり皆さん、あれでしょう僕が何を知ってるかなと思って試してみたんじゃないですか、これでも続けますよ、これアクセシビティの確保の仕方ということでWebGの文書の読み方なんですけれども大体大きく3つもうちょっとほんとちゃんとあるんですけれども3つあるんですがまず、前提としてJISとWCAGWCAGというのがWCAGはイコールと考えて頂いていいです。ので、WebGで翻訳されているWCAGの文書でJISの勉強ができます。WCAGの2.0と解説書と達成報告収という3つがあります。2.0が本体なんですけれどもこれ大変中小度の高い文書でこれだけも理解できる人はいないというか実践できる人はいません。これについて一体この中小的な文書は何を意味しているのか解説書までいっても今度は技術に踏み込んでいない文書になっています。具体的にHTMLを使ってCSSを使ってJavaScriptを使ってどういうふうに書いたらいいの?ということがしっかりと書いてあるのは最後の達成報告収です。それぞれ3つとも支え合ってできあがっているものなので順番としてはこういう構造としてはこのような関係で読んでいただくといいかなと思います。WCAGJISには3つの適合レベルというのがあります。適合レベルというのは最低音に対応するかという3つの度合いなんですけれどもシングルAからWA、トリプルAの3つがあります。シングルAというのは最低音に達成すべき適合レベル。シングルAの満達性という状況はですね、情報を全く取得できない人が存在し得るという致命的な状態です。WAというのは達成することが望ましい適合レベル。公的機関ではフォロー義務としています。トリプルAは非常に高度な対応が求められる適合レベル。一般には達成することがされていません。ここに書かなかったんですけど、シングルA未満の状態があって被冠症という項目があり、これに関しては絶対やったら関用というのがあるんですけど、これはまたどこかで被冠症というキーワードだけ覚えておいていただいて、どこかで向き合っていただくといいかなと思います。適合レベルもちょっと分かりやすくしますね。PCのメモリーをレイに言います。これ2018年9月現在で色々認めます。シングルAはメモリー4GHz最低これはないと動かないでしょうPCがこんな感じです。WA、これ人権レベルだと思いますがメモリー16GHzトリプルA32GHzこれ求めるのちょっと濃くですよね。だから32GHzというとトリプルAかなという感じです。さっきのところで怒られる予定だったんですけど怒られなくて真面目にやりますね。シングルA動画で説明します。動画だとまずその動画って音声が出て画面で物が動いてますよね。ここにキャプション字幕誰かが発話をしたらその発話内容を字幕で入れること音もなく物が動いたらその音もなく物が動いたことについて説明をすることこういったのがキャプションです。音声解説というのは視覚障害し向けの副音声ですね。こういった動画自体をアクセシブンに進むのに加えてあるいは動画の内容を説明したテキストを用意すること。次がWA収録済みの動画にはキャプションと音声解説をつけること。シングルAとWAが違うのがシングルAの場合は動画の内容を説明したテキストでもかまわんと言ってるんです。でもアクセシブ意気の考え方としてはできればインファーサルデザインに近づけたいというか動画の体験というものを共有できるのがベタですよね。だから動画自体はアクセシブンにしましょうというのがここに現れていてWAの場合には説明をしたテキストじゃあかんと言ってるのがWAです。トリプレイについては音声解説をつけた上でテキストも用意しなさい。用意しなさいの上に拡張音声解説を用意しなさい。拡張音声解説というのは画面というのは動いていくのでうまく福音声が入らないときには画面を一時停止してでも説明をしっかりしなさい。というのが拡張音声解説ですね。で加えて手話もつけなさい。結構メモリ32以下レベルの大変なことを求めてくるのがトリプレイです。お金もかかりますしここまでの対応を義務化するのは現実的じゃないなというのが分かっていただければなと思います。ここに来る前に1人友達にこのシライドを見てもらったんですけどお前何か金もらってるのかと言われたんですが一応お勧めできる本はこの3冊かなということでデザイニングウェブアクセシブリティCAS&JavaScript中はこの3つがお勧めできる3冊かなと思いますので書籍から勉強する場合はこのあたりを頂くといいと思います。特にデザイニングウェブアクセシブリティは僕なんか明らかにその技術を託計なんですけれどもウェブサイトを作るときに例えばお客さんと相談をして計画をするとか例えばデザイナーにどういう指示を出していくかという企画や計画のことを考えながら読むのに丁度いい本なのでお勧めです。ウェブだとここにあるような菅崎さん菅崎まさひてさんのサイトもこれ時代遅れだって言われるかもしれないけど僕これに影響を受けて会社を起こした人間なので判定があっても利用できるページ作りであるとかあとこれから皆さんが会社に帰ったり仲間のもとに帰ったりしたときに一体者障害者ってどうやってインターネットを利用しているのということがわかりやすいビデオが2番目の仲間ビデオということで総務省が提供しているビデオがありますこれ前問の人と弱視の人とあと上司障害の人があったかな3つのパターンでかなりわかりやすい動画があるのでこうやって使ってるんだというのを見ていただけるかなと思うのでお勧めですでやっていくとどうせ悩むきょうがぶつかるんですよ壁にぶつかったら人に相談するしかないというときにはA11IJというスラックがあるので僕は録画されているんですね僕は録画されているけど言っちゃうとこの間自分たちのことをA11IJに参加している人たちが地味盲料って言ってたんですけどすごい詳しい人たちが優しく教えてくれると思いますあとは今日前においてあるんですけど早二票と要約集というのは紙にまとめたものがあるのでこの早二票要約集を特価価にしてもらうのもいいかなと思いますよかったら配ってますので前に来て持って帰ってくださいもともと事実企画っていうのは買わなきゃいけないんですね事実の差し買うと2000円くらいだったかな2000円くらいで60ページくらいの差しが出てくるんですWCAGの2.0は1ページにまとまっているんですけどその後の解説書と達成報告書を合わせると200ページ超えますだからこの260ページを超えるものがわずか4ページで読めるくらいにまとめてあるのでなかなかのコストパフォーマンスかなと思いますあと大変詳しい人が監修してくれてるので内容もそれなりに信用をいただけるかなと思いますこういうものですワードキャンプなのでワードプレスに話をしていきますねワードプレスとアクセシビリティということでワードプレスの日本語版のウィキビティやアクセシビリティの報告に書いてあるんですけれどもワードプレスとまともな品質のテーマを使っていればアクセシビリティの高いサイトを作るために特に追加でしなければならないことはありませんそれでもアクセシビリティ標準に順協したコンテンツを作成するためにいくつか心をかけることがありますこれ結構正確な表現だと思いますその次の英文はもう意味だけ言いますけれどもワードプレスの中のセリフですねセリフとか発言ですね2016年以降のコードはWCAG2.0のレベルWAを満たすこと宣言ということでコアチームもそれを入るしていますよということがありますちょっとビビっちゃうんですけど世界のCMSの50%超がワードプレス出そうですのでこういったことをやっていくのは必然的なのかなと思いますワードキャンプでももうこの間主催の方にお話をワードキャンプ運営チームの方にお話を聞いたらワードキャンプの時には1個はアクセシビリのテーマを入れていこうというふうに決め張ったそうです僕もそれで呼ばれたのかなという感じなんですけれども去年はうちのボスがお話をしています上木さんという方がこれはウェイクの偉い人ですワードキャンプでも記念上連の値段ですねワードクレスでWAやシングルAのサイトを作れるのかということですが作れます作り勝ちなバリアのポイントを統一してはフォームのアクセシビリという過去かなと思いますコンタクトフォームセブンの今度はカレージ進化アクセシビリのイベントにも参加するくらいそれなりに意識のある方できちんとアクセシビリに入る別に美容師さんからも何ももらってないですワードクレスでなくても一時停止表示というのが先ほど少し言及した被冠症というやつなんですけれどもワードクレスかどうかはとはず定食したサイトが多いのでこれは大変注意した方がいいかなという時間が余ったら私はできますワードクレスでアクセシビリのことを始めてみようかなと思ったらとりあえずテーマを探す時にアクセシビリというタグのテーマを先ほどちょっとだけ怖い弱さを聞いてこのタグ時々信用できないことがあるかもというのがあったので皆さん神秘願を身につけてぜひ捉えしていただけたらと思いますテーマはチャレンジですよね専門資格障害者にの情報発信の事例ということでうちが仲良くしているユニーズ・京都さんという団体があってこの方々70年に不足して資格障害者のQOLの向上と目標として資格障害者と制観者が一緒に活動する資金ボランティアグループということで飲食店のメニューの展示家や京都に観光に来る資格障害者のガイドヘルパみたいなことをしているボランティア団体ですうちもその資格障害者向けに飲食店のメニューを読み上げさせるサービスなどをやっているのでそれで仲良くしていますこのサイトは資格障害当事者がスクリーンリーダーを用いて更新していますということで管理画面のアクセシビティが問題になるんですけれどもここでのチェックポイントの例としては入力欄にフォーカスがある時に入力すべき内容が分かることこれラベルをきちんとつけること繰り返される膨大なリンクをページ移動の度に読まずに済むことマウスなしで操作ができることつまりキーボードだけで操作ができることキーボードだけで操作している場所にとってはどこにフォーカスがあるかきちんと分かるようにすることついやってしまうかもしれないですけどもこの場所はため絶対です前後資格証会社の場合フォーカスの可視化は関係ないですがサイトの製作者側が資格証会社が更新するんだけど相談を受けた時に気をつけなければいけないのはGUI以上のコンテンツ管理プラグイン時々ドラッグアンドドロップで順番を入れ替えるみたいなものがあると資格証会社マウスにも依存しますし使うのは難しいだろうなとカスタンポストタイプが分かりやすく適切な適度なカスタンフルダーコンテンツの実質を保つのによいこの2つはやっぱり製造者だっても資格証会社だっても同じなんですけれども所定の場所に入力すると所定の場所に現れるということが担保されているというのがカスタンポストタイプとカスタンフルダーのうまい活用で担保されます悩むことあると思うんですよこれもカテゴリーでやったらいいんじゃないのかなと思うときにも実はカスタンポストタイプ分けた方がインターフェースが分かりやすくなるというのが一応うちの経験では分けたと信の命大かなと思っていますで、ブックマーク活用というのはやっぱりワードプレスの管理画面に言ってもリンクが膨大なので例えばある記事を足すというリンクに行くまでに何回かリンクをたどってページをたどって行かないといけないこういう時にそのページのブックマークをしてしまってそのブックマークから操作するというのをやってもらったら資格証会社すごい使いやすかったんですねので、これがブックマークの活用という話ですで、例をお見せしますねこれはブロックスキップの話なんですけどまず、苦労している例です左側のメニューで全編になりますよね新規コメントリンクページクタープにこれ全部読んでたら大変ですよねで、今目指しているのはこの部分の流行クラブですいつ取り出すのか分からない僕たちに入れてるからまだ設定されていますけど見えてないとかなり普通に分かっていただけると思うんですけどまだ続きますメインランドマー表示オクションボタン折りたたみ新規追加キップほぼ2タイトルを入力エディットテストセンサル折りかいただけると思うんですけど全ページこれやってたらとてもじゃないけど使ってられないとさっき、情報取得できるかどうかがアクセシビーティーだとは言いましたけれどもこれはもう人をくじけさせるのに十分なバリアと言っていいかなと思いますで、まず新規追加の時のスクリーンリーダーの動きですけれども新規追加の時はワードプレスは実はフォーカスが勝手に移動するようになっていますこれは覚えておかないといけないんですけど覚えておけは便利新規追加キップ新規デリップ新規投稿を追加は良いです一気に来ましたよね、入力欄そしてここは何もしなくてもタイトルのところにフォーカスが最初に移動するのでこれを覚えておけばスクリーンリーダーで使いやすいGoogleなんかがGoogleに行った時に勝手に検索文字でフォーカスが移動しているアレと同じです次がですねこの話もこれが一番良いという解決ではないんですけどもワードプレスは意識して提供しているのでその事例をお見せします最初にタブキーを押すと左上に隠れていたグロックスキップが現れてそれを有効にすると本文欄に飛ぶその後何の入力欄か読み上げる先ほどラベルの話をしましたけどラベルも今回は音が聞こえるようにしていますので2つのも聞いてみてくださいここですねさっき一日読んでたのを全部飛ばしてここにタイトルを入力エディントここにタイトルを入力だからここにインプットにフォーカスが打つと何を入力するかが説明されている例ですでですねこっちでいいんじゃないのかなというのが見出しのスキップですね使ってるのはNVDAというスクリーンリーダーなんですけどもA1キーキーボードのA1をたたくと見出しを次の見出し次の見出しという風にスキップしていきます新しい株使用中メニューボタンサブメニューバイアーフォックスが新しくなりましたまるメインランドマーク投稿の編集見出しレベル1、ヘルズボタン、表示、新規ここにタイトルを入力エディットちょっとわかりにかったかもしれないんですけどA1キーをしたことで投稿の編集という見出しにジャンプしてその後を移動したというのが今の流れです同じような感じでDキーを使うとランドマークスキップも可能です一応聞いてみてくださいメインランドマークボタン折りたたみヘルグ投稿の編集ワードプレスワードプレス使用中メインメニュークリック可能2メインランドマークヘルグボタン折りたたみ表示、新規、ここにタイトルを入力エディットDキーに3回押すとこうやって本分な人に行くことができますタイトルの入力欄に行けますよという方一例で、ワードプレスというよりCMSとアクセシビリーというお話なんですけれども納品時に一生懸命勉強してアクセシブルにしましたといっても同心でジャンジャンバリアを作ることができるということがあります本分欄で作ること、本分欄というかユーザーがいじれる画面で作ることができるバリアの例としては妥当でないオールド属性値を入れてしまうあるいはオールド属性値入れないで、動画や音声類のアクセシビリーというのは確保というのはコンテンツで責任を持つしかないのでなかなか難しいで、文字の大きさをH1から6要素で作っちゃうつまりですね、この文字ちょっと大きくしたいなと言ってですね、意味もなくといったような対応で、あといわゆるこちら消耗群とか、冷や消耗群という詳しくはこちらだけリンクになっているみたいなもののバリアの例ですね、これは詳しくWCAGを読むとこちらリンクは必ずしも否定されていないんですけれども危険なので素人にはあまりを進めていきませんで、本分のバリアの事例ということで、ちょっと一緒に見ていきましょうこれからのオルトでA要素って書いてあって1.1.1と2.4.4に定色しますよって言ってるけど皆さんHTML全然知らない人0ですねこれAで始まってAで閉じてますよねその中にイメージがあるんだけれどもオルトが空という事例でこうするとこれリンクってことは意味があるはずですよねどこかに行くんだからリンクなのにオルトがないというのはですね、よくやる制観者だと気づかないでやってしまう悪い例ですこれも涙なしでは語れないんですけれどもワードペースがスペースを消すんですね連続しているスペースとか消す僕ワードペースの気持ちはわかるんですけれども消した時にうまい位置に文字が出てきてほしいなという時にですねこれAが書いてあるんだけどねAを書いてスタイルカラーFFFだから白い文字にして見えなくしたでもこれスクリーンリーダーでは読むんですよやっぱりこういった理解できない人がこれも戦律の事例ですがちなみに頻繁に見ますここらへんの最後が今日の目玉なんですけども本文内でまさかのメタタグこれね動くんですよびっくりしたんですけど教学のあまりなった事例ですね2.2.1タイミング点ですねワードペースの場合だと手前にその話になりますけどJWP A11Yというのがちょっとグーテンベルグ対応がまだなんですけれども記事を編集して送信ボタンを押すとエラーが出てバリアがあるよということを教えてくれるプラグインがありますこれは本文の領域についてのチェックを行いますページ先代のチェックをしたいという時にはA11YCというオンラインのサービスがあるのでそちらを使っていただくとヘッダーやフッダーや本文以外のランのバリアについてもチェックしてくれますHTMLのチェックに関してはあんまりしてないのでNUHTMLチェッカーというのはHTML5のチェッカーW3Cが提供しているこのチェッカーを使ってチェックしてくださいコーディ頻繁に出てくるA11YというのはAとYの間に11文字あるのでA11Yという略記方法があるんですけれども当然この表記そのものがアクセシブルでないという批判がありますでも便利なんです本文内のチェックなんですけれども一応ショートコードも展開してチェックするのでコンタクトフォーム7を使ってショートコードを書いたようという時コンタクトフォーム7でバリアを作っていたらコンタクトフォーム7の内部でもラベルなしのフォームを作ったりするとレベルでもエラーが出ますけどこちらもうちょっとしつこくエラーを追いかけます2種類のエラーがあるんですけどエラーの表示というのは投稿した後画面を征服するように真っ赤なアクセシブリティのチェックというのが出てきますアクセシブリティの試験というか機械的にチェックができるのが機械チェックACというのがあってそういうものができるものとできないものというのがありますJWPA11Yでは機械チェックで確実に問題がある場合はエラーとして赤い表示をしますその機械チェックができない時はAFというのはオートマチックファイントこれ怪しいけど正しいかどうか分からない例えばオルトがあるけれどもオルトが本当に正しいオルトなのか分からない今のところからのオルトにしているけど本当にからのオルトだと思うのか分からない文字が鳴き分かれているよくあるんですけれども例えば参加比という言葉の下に場所という言葉を並べる時に参加比と文字数が違うんで場所と場の場と所の間に全角スペースを1個入れちゃうさっきのあーの問題と同じなんですけどそういうことをしちゃったりするというようなことを指摘する時にこれが悪いスペースなのか判定はするけれどもオートマティックチェックはできないというのをノーティスでエラーを出しますで最後に5分前なのでじゃあこれぐらい頑張って英語を読んでみましょうかサーティムバーナーズリーがですね海の親がですねこういうことをおっしゃっておいてですね非常にアクセシビティバタケの人間として元気になるわけですねウェブ作った人がそもそもアクセシビティが大事だと言われると今広い処方で語りましたけど少なくの僕は元気になるんですねウェブの力というのはそもそも不変性にあると障害に関係なく誰もがアクセスできるというのがウェブの本質的な側面だということをティム教がおっしゃっておるサイドでティム教のアレがねって言ったら海外通じるんだろうかなと思います一番大事なことを最後に覚えておいてくださいティム教のアレを拾っているんですけれどもインターネットにアップする時点で皆さんはすでにアクセシビティの第一歩を踏み出していますウェブ上に何かコンテンツがあるというのはとても素晴らしいことで例えばバリアがあるからアップしないとかWAに順挙できないからアップしない字幕が付けられないからアップしないPDFの画像だからアップしないというのはアクセシビティをもっともそこなど考え方です恐れず僕の喋ったことを全部忘れていいのでこれだけ覚えてとにかくウェブにアップするだけでいいんだという元気を持って帰っていただけたらと思います以上ですが質問は受け付けたくないんですけど受け付けた方がいいですかねそうですね今日明らかに皆さん知っている人たちですかねそれはそれでいいじゃないですかねそうですかじゃあ質問をどうぞすみません ありがとうございました資格障害者の方で更新されているという話がありましたけどそこのトレーニングとかは農品人にトレーニングとかされると思うんですけどどういう形でもなんかマニュアル的なものなのか実際に操作を一緒に触ってとかそういう感じでされたんですかうち先ほど申しましたとリエイリ企業なのでワードペースの案件の時には定番の渡すマニュアルがあるんですよPDFで作ってあるんですけどやっぱ画像コミューで渡しているので全部もう一回やるという時には全部メールで説明をしましたメールで説明をしたうえで最初の更新というか最初の数回の更新は電話越しその方九州の方で僕たち京都なのでベッタリとハンズオンというわけにいかなくてですね電話でやり取りをしながら更新の仕方を一緒に操作しましたその時に先ほどのブックマークの話更新の画面の所定の場所をもう勉強しちゃうと便利がいいということが分かってそれも活用しておいてです一応その方真面目に今も更新していて僕たちにとってはすごい嬉しいなというふうになっています分かりましたありがとうございますまだ全然お時間ありましたかもうそういうぐらいじゃないですかまだ3、4人くらい行けますはいありがとうございますたまにアクセシブリティのチェックしてもらう会社を選ばなきゃいけないときとかがあるんですけど下田さんが考える会社の選び方みたいなのがあったら教えていただけますいや、なんかそう、あいう本を見て一応採用したけどなんかその時の会社と引っかかっちゃうとかあるじゃないですか難しいですよねそういう選び方のポイントみたいな考えますか僕たち長くていいところがちょっと高そうだったので困って結局自分たちでチェックすることにしたんですね勉強してでもいくらか見ていてこれ個人の感想ですよ個人の感想ですけれども方針をまず読んでアクセシブリティの方針を読んでこの方針きちんとしてるなと思うのが一つのチェックポイントで、方針読んだ後その結果があるんですけど試験結果にですねものすごい単純に言いますよチェックの結果の表だけがあるんじゃなくて何かコメントが書いてあるところがあるとするときどきこういう理由でこうだとかこういうふうに判定したって書いてあるところがあってそういうところの試験をしているところはこのしなきがしましたはいありがとうございました他に質問まだ大丈夫ですよ時間はなんか恨みがあるんですかまー、えーとアブシルンだったら被害者の話しましょうかそうですね先ほど戻ります2.2.21時停止停止表示というのがあってこれシングルM1のサイトができちゃうよというのがこれなんですけれども今皆さんもうこの早見表をお手元に持ちました持ってない人いる持ってない人よかったら後でまた見てもらって持っている人ちょっとお手元の表を見てもらうとですね特に早見表を横位置の紙ですね横位置の紙を裏にめくってください裏というのは細かい字のほうなんですけれどもこれの左上がですね赤くなっているところがありますこの赤いところは被害者と呼ばれる項目でどんなに時間がなくてもここだけは呼んでもらおうといいかと思いますここにあるものに停止しているとこういうコンテンツこういう部品がサイト内にページ内にあるだけでそのページの他のものにアクセスできたくなっちゃう他の情報に干渉してしまうという致命的な問題が被干渉です例えばですね自動再生する音声画像がある行政のサイトとかトップページに下にバナーが並んでてこういうのがあると注意力欠陥障害にある人はそこに注意が奪われて他の項目に一切アクセスができなくなるだから皆さんもお客さんがトップページに横に動く噛み芝屋のみたいなのをやってようと言ったら弾行として拒否をしてこれがあるとアクセスできない人たちがいますよ被干渉ですよということを優しくお伝えいただけるといいかなと思います一応グッと飲み込んでいい言葉は停止すればいいんだよってことを言ってもいいですけど作りたくないですよね 噛み芝屋カルセルカルセルについては二枚目にほとんど見られてないという結果が時々出るんですけどもうちょっと権威のある結果が出てくれると嬉しいな次はキーボードによる操作ができるこれ最近減ったんですけどページの中にフラッシュのコンテンツがあったりしてタブキーでどんどん移動していくとあるところからフットフラッシュに入ってフラッシュから抜け出せないどうしても抜け出せないということが起こったりしますマウスで利用しているとフラッシュ以外のところをクリックしたら抜けられるというふうになったりするんですけどこういうのをキーボードトラップといって先ほど言ったキーボードで操作している人たちは他のものに一切アクセスできなくなってしまうのでやったらダメというのがキーボードトラップですね次が先行これは僕またみんなが知っていることを喋ろうとしてますよねこれいわゆるポケモンショックポケモンアタック画面がチカチカチカって先行することで光感重性の転換の症状が起こしてしまってそんなことしたら当然他のコンテンツにアクセスできなくなって操作で倒れてしまうのでこういうことをやったらいけませんよというのが先行いつかアクセスBTのTシャツみたいのを作ったらぜひ3回の先行って書いてあるTシャツを作りたいなと少し思ってますもうちょうどいい感じの時間にそういうわけでしばらくいろいろ楽しい話をありがとうございますカップなのでぜひ1つ以上持って帰っていただければね計発用とか持って帰りたい人は複数持って帰っていただいて構わないので良かったら前に来てください以上です