水底の血 2024-03-25T10:30:00+09:00 momdo Hatena::Blog hatenablog://blog/8454420450077434727 アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その3) hatenablog://entry/6801883189092963836 2024-03-25T10:30:00+09:00 2024-03-25T10:30:00+09:00 アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1)、(その2)の続きです。 おさらい 対象ページ:「アトリエ金工やまぐち」 Basic認証があるので、アクセシビリティ向上日誌1【各種ツール評価編】からたどってください @HeldaForStudy氏に了承を得てアクセシビリティチェックを行っています チェック基準:WCAG 2.1レベルA 文中のSCはSuccess Criteriaの略で達成基準のこと 目的はどうやってアクセシビリティチェックしているのか、チェックしながら何を考えているのかを書き記すことです 制作ページやチェック内容にネガティブなことをいいた… <p><a href="https://momdo.hatenablog.jp/entry/20240321/1711028498">アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1)</a>、<a href="https://momdo.hatenablog.jp/entry/20240323/1711120259">(その2)</a>の続きです。</p> <h2 id="おさらい">おさらい</h2> <ul> <li>対象ページ:「アトリエ金工やまぐち」 <ul> <li><a class="keyword" href="https://d.hatena.ne.jp/keyword/Basic%C7%A7%BE%DA">Basic認証</a>があるので、<a href="https://such-a-thing.halfmoon.jp/blog/acc-report1/">アクセシビリティ向上日誌1【各種ツール評価編】</a>からたどってください</li> <li><a href="https://twitter.com/HeldaForStudy/">@HeldaForStudy</a>氏に了承を得て<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックを行っています</li> </ul> </li> <li>チェック基準:<a href="https://waic.jp/translations/WCAG21/">WCAG 2.1</a>レベルA</li> <li>文中のSCはSuccess Criteriaの略で達成基準のこと</li> <li>目的はどうやって<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックしているのか、チェックしながら何を考えているのかを書き記すことです <ul> <li>制作ページやチェック内容にネガティブなことをいいたいわけではありません</li> </ul> </li> <li>チェックに抜け漏れ、誤りがあるかもしれません</li> <li>仕様等は基本的に日本語訳を当たります</li> </ul> <p>では続きに入っていきましょう。</p> <h2 id="ABOUTセクション">「ABOUT」セクション</h2> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240323/20240323143144.png" alt="" width="956" height="600" loading="lazy" title="" class="hatena-fotolife" style="width:600px" itemprop="image"></span></p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックの経験がある人であれば、「ABOUT」「ひとつの跡にひとつのぬくもり」の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比が不足している(<a href="https://waic.jp/translations/WCAG21/Understanding/contrast-minimum.html">SC 1.4.3</a>「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト (最低限)」)ことに目が行くと思いますが、今回はレベルAでチェックしていることを思い出しましょう。また、「ABOUT」の文字の一部が隠れてしまっています。<a href="https://waic.jp/translations/WCAG21/Understanding/resize-text.html">SC 1.4.4</a>「テキストのサイズ変更」(レベルAA)では200%ズームをするわけですが、ズームすることなしに起こっているので、達成基準上の問題というよりかは、サイトの一般的な問題になってくるでしょう。</p> <p>また、『「金属」という素材に、 どんなイメージがありますか?』のセクションにある、下線が気になるところです。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-about__discription1 scroll_up on&quot;</span><span class="synIdentifier">&gt;</span>冷たい?固い?<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> もちろんそれも金属の大きな特長です。<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> しかしまた、<span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-about__discription1-under-bar under-bar&quot;</span><span class="synIdentifier">&gt;</span>あたたかさ<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>、<span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-about__discription1-under-bar under-bar&quot;</span><span class="synIdentifier">&gt;</span>やわらかさ<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>という<span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-about__break&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>側面を併せ持てる素材でもあるのです。 <span class="synIdentifier">&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span> </pre> <p><code>&lt;u&gt;</code>を用いて下線を引いているわけではないので、<a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>「情報及び関係性」の問題とはなりませんが、それはそれとして下線は一般的にリンクだとユーザーはすり込まれているわけで、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の観点から考慮してもらうとよいのかと思います。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;about/index.html#introduction&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">鍛金のことを知る</span><span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;arrow&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">▲</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;</span> </pre> <p>記号文字「▲」での提示について、SC 1.3.1としてマークするのは前回のその2でも述べたとおりです。</p> <h2 id="NEWSセクション"><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A1%D6NEWS%A1%D7">「NEWS」</a>セクション</h2> <p>こちらの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A1%D6NEWS%A1%D7">「NEWS」</a>は完全に隠れてしまっているので、というのはさておき、画像にある「NEW」はレベルAAとして<a href="https://waic.jp/translations/WCAG21/Understanding/contrast-minimum.html">SC 1.4.3</a>「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト (最低限)」<a href="#f-d06e8d55" id="fn-d06e8d55" name="fn-d06e8d55" title="オレンジ色と白文字の組み合わせは、SC 1.4.3のコントラスト比を満たす上での鬼門です。「オレンジ アクセシビリティ」で検索するといろいろと出てきます">*1</a>、<a href="https://waic.jp/translations/WCAG21/Understanding/images-of-text.html">SC 1.4.5</a>「文字画像」がパッと出てくるところですね。「NEW」という画像の代替テキストが存在しないので、<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-content.html">SC 1.1.1</a>「非テキストコンテンツ」としてマークしておきます。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>上の問題ではないですが、「矢印」は押せそうに見えて押せない、「右」にスワイプすればよいように見える(私の場合)というのがあるので、こちらも<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の観点から検討いただくとよいかもしれません。なお<a href="https://waic.jp/translations/WCAG21/Understanding/reflow.html">SC 1.4.10</a>「リフロー」も気になるところですがこちらの達成基準はレベルAAですので以下省略。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240323/20240323143400.png" alt="" width="730" height="1058" loading="lazy" title="" class="hatena-fotolife" style="width:320px" itemprop="image"></span></p> <p>カードの中身は、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;swiper-slide section-news__swiper-slide section-news__swiper-slide1 swiper-slide-active&quot;</span><span class="synIdentifier"> </span><span class="synType">role</span><span class="synIdentifier">=</span><span class="synConstant">&quot;group&quot;</span><span class="synIdentifier"> </span><span class="synType">aria-label</span><span class="synIdentifier">=</span><span class="synConstant">&quot;1 / 6&quot;</span><span class="synIdentifier"> </span><span class="synType">style</span><span class="synIdentifier">=</span><span class="synConstant">&quot;width: 299.25px; margin-right: 32px;&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__swiper-img-area section-news__swiper--new&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__swiper-img&quot;</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/michiyo/vase7.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;ギャラリー○○ グループ展&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__tag&quot;</span><span class="synIdentifier">&gt;</span>展覧会<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__article&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">time</span><span class="synIdentifier"> </span><span class="synType">datetime</span><span class="synIdentifier">=</span><span class="synConstant">&quot;2023-01-01&quot;</span><span class="synIdentifier">&gt;</span>XX.XX.XX.<span class="synIdentifier">&lt;/</span><span class="synStatement">time</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span>ギャラリー○○ グループ展<span class="synIdentifier">&lt;/</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__discription&quot;</span><span class="synIdentifier">&gt;</span>○○市にあるギャラリー○○さんにてグループ展を行います。<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> 様々な作家の作品が一堂に会するこの機会に、ぜひお気に入りの一点を見つけてください。<span class="synIdentifier">&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-news__details&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;construction.html&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">詳細を見る→</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> </pre> <p>となっていますが、次に挙げている項目については、その1あるいはその2でも触れたポイントについての繰り返しになりますので、詳細は省略します。</p> <ul> <li>swiperのこと</li> <li>画像の代替テキスト</li> <li>見出しの位置</li> <li>記号文字「→」</li> </ul> <p>なお、「詳細を見る」はリンクの目的(<a href="https://waic.jp/translations/WCAG21/Understanding/link-purpose-in-context.html">SC 2.4.4</a>、<a href="https://waic.jp/translations/WCAG21/Understanding/link-purpose-link-only.html">SC 2.4.9</a>)を考えると<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェック上のポイントになってくるところですが、今回は<code>&lt;li&gt;</code>の塊の末尾にリンクがあるので、SC 2.4.4の「リンクのテキストとプログラムによる解釈が可能なリンクのコンテキストから判断できる」と判断します。</p> <blockquote><p>達成基準 2.4.4 リンクの目的 (コンテキスト内) (レベル A): それぞれのリンクの目的が、リンクのテキスト単独で、又はリンクのテキストとプログラムによる解釈が可能なリンクのコンテキストから判断できる。ただし、リンクの目的がほとんどの利用者にとって曖昧な場合は除く。</p></blockquote> <h2 id="お問い合わせフォーム">お問い合わせフォーム</h2> <p>ここでフォームが来てしまいましたね(ふるえ)。達成基準として見るものがたくさん出てくるというのもありますし、フォームの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%C7%A5%B6%A5%A4%A5%F3%A5%D1%A5%BF%A1%BC%A5%F3">デザインパターン</a>が多様なこと、バリデーションが送信前と後のどちらで発生するのか(いいかえれば、フロントエンドとバックエンドでどうデータが行き来しているのか)など、複雑な様相を呈してきます。</p> <p>フォーム一般として見ておくべき達成基準としては、まずエラー方面</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/error-identification.html">SC 3.3.1</a>「エラーの特定」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/error-suggestion.html">SC 3.3.3</a>「エラー修正の提案」(レベルAA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/error-prevention-legal-financial-data.html">SC 3.3.4</a>「誤り防止 (法的、金融、データ)」(レベルAA)</li> </ul> <p>作り込みによっては出てくるコンテキストの変化</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/on-focus.html">SC 3.2.1</a>「フォーカス時」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/on-input.html">SC 3.2.2</a>「入力時」(レベルA)</li> </ul> <p>コンテンツの変化として</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/status-messages.html">SC 4.1.3</a>「ステータスメッセージ」(レベルAA)</li> </ul> <p>何の入力欄なのかがわかること</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/labels-or-instructions.html">SC 3.3.2</a>「ラベル又は説明」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>「情報及び関係性」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/name-role-value.html">SC 4.1.2</a>「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>)」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/identify-input-purpose.html">SC 1.3.5</a>「入力目的の特定」(レベルAA)</li> <li><a href="https://waic.jp/translations/WCAG21/Understanding/sensory-characteristics.html">SC 1.3.3</a>「感覚的な特徴」(レベルA)</li> </ul> <p>あたりでしょうか。またフォームによっては<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%BF%A5%A4%A5%E0%A5%A2%A5%A6%A5%C8">タイムアウト</a>することもあるでしょうから</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/timing-adjustable.html">SC 2.2.1</a>「タイミング調整可能」(レベルA)</li> </ul> <p>も見る必要があります。マルチステップな画面ですと</p> <ul> <li><a href="https://waic.jp/translations/WCAG21/Understanding/page-titled.html">SC 2.4.2</a>「ページタイトル」(レベルA)</li> </ul> <p>あたりも意外と盲点だったりします。そしてWCAG 2.2から加わった</p> <ul> <li><a href="https://waic.jp/translations/WCAG22/#redundant-entry">SC 3.3.7</a>「冗長な入力項目」(レベルA)</li> <li><a href="https://waic.jp/translations/WCAG22/#accessible-authentication-minimum">SC 3.3.8</a>「アクセシブルな認証 (最低限)」(レベルAA)</li> </ul> <p>あたりもあわせて見ておく必要があります。わぁい…。</p> <p>気を取り直して、チェック対象ページを見ていきましょう。コード断片としてはこうです。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">form</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form scroll_up on&quot;</span><span class="synIdentifier"> </span><span class="synType">action</span><span class="synIdentifier">=</span><span class="synConstant">&quot;&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">table</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">tbody</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">tr</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">th</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">label</span><span class="synIdentifier"> </span><span class="synType">for</span><span class="synIdentifier">=</span><span class="synConstant">&quot;formName&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form-title&quot;</span><span class="synIdentifier">&gt;</span>お名前<span class="synIdentifier">&lt;/</span><span class="synStatement">label</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">th</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">td</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">input</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form-write&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;formName&quot;</span><span class="synIdentifier"> </span><span class="synType">type</span><span class="synIdentifier">=</span><span class="synConstant">&quot;text&quot;</span><span class="synIdentifier"> </span><span class="synType">placeholder</span><span class="synIdentifier">=</span><span class="synConstant">&quot;お名前をご入力ください&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">td</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">tr</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;</span><span class="synStatement">tr</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">th</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form-detail&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">label</span><span class="synIdentifier"> </span><span class="synType">for</span><span class="synIdentifier">=</span><span class="synConstant">&quot;formDetail&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form-title&quot;</span><span class="synIdentifier">&gt;</span>ご用件<span class="synIdentifier">&lt;/</span><span class="synStatement">label</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">th</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">td</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">textarea</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;formDetail&quot;</span><span class="synIdentifier"> </span><span class="synType">placeholder</span><span class="synIdentifier">=</span><span class="synConstant">&quot;ご用件をご入力ください&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">textarea</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">td</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">tr</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">tbody</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">table</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">input</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__form-submit&quot;</span><span class="synIdentifier"> </span><span class="synType">type</span><span class="synIdentifier">=</span><span class="synConstant">&quot;submit&quot;</span><span class="synIdentifier"> </span><span class="synType">value</span><span class="synIdentifier">=</span><span class="synConstant">&quot;送信する&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">form</span><span class="synIdentifier">&gt;</span> </pre> <p>で、達成基準上の指摘としては特にない認識です。素晴らしいですね…(?)達成基準上の問題としては、@HeldaForStudy氏が<a href="https://waic.jp/translations/WCAG21/Understanding/error-identification.html">SC 3.3.1</a>として挙げていますが、達成基準を確認してみましょう。</p> <blockquote><p>達成基準 3.3.1 エラーの特定 (レベル A):入力エラーが自動的に検出された場合は、エラーとなっている箇所が特定され、そのエラーが利用者にテキストで説明される。</p></blockquote> <p>現在のフォームでは、入力エラーがそもそも<strong>自動的には検出されていない</strong>という認識ですので、達成基準上の問題とはならないという理解です。それはそれとして必須であることはHTMLコード上では表せていません(疑似要素でもってテキストとして提示はされていますが)。これは、必須項目に<code>reqired</code>属性を提供することで手当てできるでしょう。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">input</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-contact__inquiry-form-write&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;formName&quot;</span><span class="synIdentifier"> </span><span class="synType">type</span><span class="synIdentifier">=</span><span class="synConstant">&quot;text&quot;</span><span class="synIdentifier"> </span><span class="synType">placeholder</span><span class="synIdentifier">=</span><span class="synConstant">&quot;お名前をご入力ください&quot;</span><span class="synIdentifier"> </span><span class="synType">required</span><span class="synIdentifier">&gt;</span> </pre> <p>こうすれば、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D6%A5%E9%A5%A6%A5%B6%A1%BC">ブラウザー</a>が検出してくれます(釈迦に説法感がありますが…)。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240323/20240323144502.png" alt="&#x3053;&#x306E;&#x30D5;&#x30A3;&#x30FC;&#x30EB;&#x30C9;&#x306B;&#x5165;&#x529B;&#x3057;&#x3066;&#x304F;&#x3060;&#x3055;&#x3044;&#x3002;" width="1200" height="209" loading="lazy" title="" class="hatena-fotolife" style="width:480px" itemprop="image"></span></p> <p>このフォームはシンプルで素直なフォームですからよいのですが、世に出回っているフォームでラベルのないフォームのなんと多いことか。ラベルがなきゃ何の入力欄なのかわからないという話です。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D7%A5%EC%A1%BC%A5%B9%A5%DB%A5%EB%A5%C0">プレースホルダ</a>ーテキストは、入力欄のヒントであってラベルではありません。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D7%A5%EC%A1%BC%A5%B9%A5%DB%A5%EB%A5%C0">プレースホルダ</a>ーテキストを使うこと自体、あまりお勧めできるものではありません。<a href="https://u-site.jp/alertbox/form-design-placeholders">入力フォームのプレースホルダーを使ってはいけない</a>を読みましょう。またラベルを<code>&lt;label&gt;</code>で関連付けていないフォームも星の数ほどあります。まずはラベルを付けましょう。何をおいてもフォームはラベルです。いいですね?</p> <p>フォームについてもまた、語り出すとキリがない話題ではあります。なにせ<a href="https://www.amazon.co.jp/dp/B0C5913PDX?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Form Design Patterns ―シンプルでインクルーシブなフォーム制作実践ガイド</a>という本が一冊書ける程度には奥深いです。こちらを目を通してみてもよいでしょう。<a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a>でも1章丸々割いて説明しています。</p> <p>HTMLコードについて少し詳しく見てみましょう。多分に趣味が入ってきますが。</p> <ul> <li>「必須」を疑似要素で提供しているのは違和感があるかな…と思うところです。<a href="https://momdo.github.io/accname-1.1/">Accessible Name and Description Computation仕様</a>では疑似要素のテキストが追加されることになっているので、モダンな環境では伝わると思いますが、情報構造としてDOMツリーに含める方が自然かと思います。</li> <li><code>&lt;table&gt;</code>で組まなくていいのではないかな…とは。もちろんテーブル見出しセルをきちんと設定しているので誤りではないわけですが、SPで厳密には2次元テーブルにはならないことを鑑みてもレイアウトという性格が強いと思われ、<code>&lt;div&gt;</code>と<a class="keyword" href="https://d.hatena.ne.jp/keyword/CSS">CSS</a>グリッドなり、フレックスボックスなりで整形した方が見通しがよさそうな気はします。</li> <li>やはり<code>autocomplete</code>属性が付けられる箇所は付けた方がよいでしょう。<a href="https://waic.jp/translations/WCAG21/Understanding/identify-input-purpose.html">SC 1.3.5</a>「入力目的の特定」では事実上必須でありますが、オートコンプリートが効くというシーンに助けられることは多いと思いますので、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の向上にもつながるかと。</li> <li><code>&lt;input type="submit"&gt;</code>よりかは<code>&lt;button type="summit"&gt;</code>がよいでしょう。<a href="https://www.amazon.co.jp/dp/B0BJ1SGBG5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">HTML解体新書</a>の<code>&lt;input&gt;</code>要素の説明でもそう記載しています。</li> </ul> <h2 id="まとめ">まとめ</h2> <p>結局3回に分かれましたね…<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックをする側がどのようなチェックをしているのか、何を考えているのかを説明してきたつもりですが、いかがでしたでしょうか。WCAG 2.1にのっとって<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を担保するとなると、<a href="https://waic.jp/translations/WCAG21/Understanding/">WCAG 2.1解説書</a>とにらめっこしつつ、必要に応じてHTML、<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>仕様を眺めていく感じになってくるかと思います。結構端折ってしまいましたが、ウェブサイト上の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックの勘所が、ほんのちょっぴりでも伝わったならば嬉しいです。</p> <p>また、去年に<a href="https://smarthr.connpass.com/event/279525/">アクセシビリティスペシャリストのキャリアってどんな感じ?</a>というイベントで登壇していましたが、じゃあどんなことを実際やってるのよ、という補足になればよいかなと(いまさら感がありますが)。こういうお仕事を一緒にしてみたいという方は採用に応募もらうと中の人が喜びます、たぶん。</p> <p>最後に、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックの題材としてサイトの使用を許可してくださった<a href="https://twitter.com/HeldaForStudy/">@HeldaForStudy</a>氏に改めて感謝したいと思います。どうもありがとうございました。</p> <p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0BJ1SGBG5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/41nwMxGnacL._SL500_.jpg" class="hatena-asin-detail-image" alt="HTML解体新書" title="HTML解体新書"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0BJ1SGBG5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">HTML解体新書</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%C2%C0%C5%C4%CE%C9%C5%B5" class="keyword">太田良典</a></li><li>ボーンデジタル</li></ul><a href="https://www.amazon.co.jp/dp/B0BJ1SGBG5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/41OLWPRb75L._SL500_.jpg" class="hatena-asin-detail-image" alt="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus" title="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%20%CE%CF%CC%E9" class="keyword">伊原 力也</a>,<a href="https://d.hatena.ne.jp/keyword/%BE%AE%CE%D3%20%C2%E7%CA%E5" class="keyword">小林 大輔</a>,<a href="https://d.hatena.ne.jp/keyword/%CB%F1%C5%C4%20%C1%F0%B0%EC" class="keyword">桝田 草一</a>,<a href="https://d.hatena.ne.jp/keyword/%BB%B3%CB%DC%20%CE%E2" class="keyword">山本 伶</a></li><li><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%BB%BD%D1%C9%BE%CF%C0%BC%D2">技術評論社</a></li></ul><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0C5913PDX?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/61Dv+xcBfbL._SL500_.jpg" class="hatena-asin-detail-image" alt="Form Design Patterns ―シンプルでインクルーシブなフォーム制作実践ガイド" title="Form Design Patterns ―シンプルでインクルーシブなフォーム制作実践ガイド"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0C5913PDX?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">Form Design Patterns ―シンプルでインクルーシブなフォーム制作実践ガイド</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/Adam%20Silver" class="keyword">Adam Silver</a></li><li>ボーンデジタル</li></ul><a href="https://www.amazon.co.jp/dp/B0C5913PDX?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/516DF8MI-vL._SL500_.jpg" class="hatena-asin-detail-image" alt="デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ" title="デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%C2%C0%C5%C4%CE%C9%C5%B5" class="keyword">太田良典</a>,<a href="https://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%CE%CF%CC%E9" class="keyword">伊原力也</a></li><li>ボーンデジタル</li></ul><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div></p> <div class="footnote"> <p class="footnote"><a href="#fn-d06e8d55" id="f-d06e8d55" name="f-d06e8d55" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">オレンジ色と白文字の組み合わせは、SC 1.4.3の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比を満たす上での鬼門です。「オレンジ <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」で検索するといろいろと出てきます</span></p> </div> momdo アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その2) hatenablog://entry/6801883189092840696 2024-03-23T00:10:59+09:00 2024-03-28T12:47:29+09:00 アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1)の続きです。 おさらい 対象ページ:「アトリエ金工やまぐち」 Basic認証があるので、アクセシビリティ向上日誌1【各種ツール評価編】からたどってください @HeldaForStudy氏に了承を得てアクセシビリティチェックを行っています チェック基準:WCAG 2.1レベルA 文中のSCはSuccess Criteriaの略で達成基準のこと 目的はどうやってアクセシビリティチェックしているのか、チェックしながら何を考えているのかを書き記すことです 制作ページやチェック内容にネガティブなことをいいたいわけではあ… <p><a href="https://momdo.hatenablog.jp/entry/20240321/1711028498">アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1)</a>の続きです。</p> <h2 id="おさらい">おさらい</h2> <ul> <li>対象ページ:「アトリエ金工やまぐち」 <ul> <li><a class="keyword" href="https://d.hatena.ne.jp/keyword/Basic%C7%A7%BE%DA">Basic認証</a>があるので、<a href="https://such-a-thing.halfmoon.jp/blog/acc-report1/">アクセシビリティ向上日誌1【各種ツール評価編】</a>からたどってください</li> <li><a href="https://twitter.com/HeldaForStudy/">@HeldaForStudy</a>氏に了承を得て<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックを行っています</li> </ul> </li> <li>チェック基準:<a href="https://waic.jp/translations/WCAG21/">WCAG 2.1</a>レベルA</li> <li>文中のSCはSuccess Criteriaの略で達成基準のこと</li> <li>目的はどうやって<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックしているのか、チェックしながら何を考えているのかを書き記すことです <ul> <li>制作ページやチェック内容にネガティブなことをいいたいわけではありません</li> </ul> </li> <li>チェックに抜け漏れ、誤りがあるかもしれません</li> <li>仕様等は基本的に日本語訳を当たります</li> </ul> <p>では続きを進めていきましょう。</p> <h2 id="モーダル出現ボタン">モーダル出現ボタン</h2> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%AF%A5%EA%A1%BC%A5%F3%A5%B7%A5%E7%A5%C3%A5%C8">スクリーンショット</a>ですと、</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240322/20240322234818.png" width="998" height="484" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>HTMLソースとしては、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;js-open-modal modal-btn-kenzo&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;modalOpenKenzo&quot;</span><span class="synIdentifier"> </span><span class="synType">data</span><span class="synIdentifier">-slide-index=</span><span class="synConstant">&quot;1&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal-button&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/kenzo/plate4.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal-button-kenzo&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;山口堅造「(作品タイトル)」&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h3</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__kenzo&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__name&quot;</span><span class="synIdentifier">&gt;</span>Kenzo<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__break&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>Yamaguchi <span class="synIdentifier">&lt;/</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> </pre> <p>になります。Nu Html Checkerが既に指摘していますが、HTML構文上、<code>&lt;button&gt;</code>の子に<code>&lt;h3&gt;</code>を置くことはできません(<a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>「情報及び関係性」)。念のためHTML仕様を当たってみましょう。</p> <p><a href="https://momdo.github.io/html/form-elements.html#the-button-element"><code>&lt;button&gt;</code></a>のコンテンツモデル:</p> <blockquote><p><a href="https://momdo.github.io/html/dom.html#phrasing-content-2">フレージングコンテンツ</a>であるが、<a href="https://momdo.github.io/html/dom.html#interactive-content-2">インタラクティブコンテンツ</a>の子孫および<a href="https://momdo.github.io/html/interaction.html#attr-tabindex"><code>tabindex</code></a>属性が指定された子孫が存在してはならない。</p></blockquote> <p>カテゴリー「フレージングコンテンツ」は、<code>&lt;h3&gt;</code>を含んでいませんから、HTML構文違反となります(Nu Html Checkerの指摘のとおり)。</p> <p>これは完全に余談なのですが、業務でチェックしていると、稀に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%BF%A5%E9%A5%AF%A5%C6%A5%A3%A5%D6">インタラクティブ</a>なコンテンツをネストしているサイトに遭遇することがあります…HTMLの性質上、フォーカスを持つ要素の中にフォーカスを持つことはできません…。</p> <p>さておき、それでは、この問題を修正するとすればどうすればよいでしょうか。コンテンツモデルを満たすように<code>&lt;a&gt;</code>にする、という選択肢が思い浮かぶかもしれません。ちょっと雑ですが、構造だけ抜き出して書き換えるとすると、こういう感じでしょうか:</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;#&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;山口堅造「(作品タイトル)」&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">Kenzo</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">Yamaguchi</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;</span> </pre> <p>しかし、<code>&lt;button&gt;</code>改め、<code>&lt;a&gt;</code>の中でも問題が残っています。<code>&lt;a&gt;</code>要素の内部という区切りを設けると<a href="#f-61b44f21" id="fn-61b44f21" name="fn-61b44f21" title="セクショニングという意味では、厳密には怪しい区切り方でしょうが、それは脇に置いて">*1</a><code>&lt;h3&gt;</code>という見出しがありますが、見出しの後にコンテンツが何もないという問題があります(SC 1.3.1)。</p> <p>ここでHTML仕様を思い出しましょう。<a href="https://momdo.github.io/html/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h1、h2、h3、h4、h5、h6要素</a>にはこう定義されています。</p> <blockquote><p>これらの要素は、そのセクションの見出しを表す。</p></blockquote> <p>見出しは、見出しの後ろにコンテンツがあるからこそ見出しなのです。実コードでも<code>&lt;h3&gt;</code>の直後に<code>&lt;h3&gt;</code>が来てしまっているので、情報構造として困ったことになってしまっています。</p> <p>また、見出しに先行して、見出しに関連する画像があるという問題もあります(<a href="https://waic.jp/translations/WCAG21/Understanding/meaningful-sequence.html">SC 1.3.2</a>「意味のあるシーケンス」)。見出しに関連する要素は、見出し要素の中で提供するか、見出し要素よりも後で提供するようにします。</p> <p>ちなみに、この画像は装飾的なのではないかと思われますので、<code>alt=""</code>とするのが適当かと思われます。思われる、というのはチェックする人間(ここでは私)はコンテンツオーナーでもコンテンツ制作者でもないので、どういう意図でここに画像を置いたのかがわからないからです(その意味で条件付きの<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-content.html">SC 1.1.1</a>「非テキストコンテンツ」としてマーク)。</p> <p>情報設計の時点で、どういう意図でここに画像を置くのか?目立たせて視覚的な誘導をしたいだけなのか、画像自体が意味を持つ・情報を提供するからここに置くのか…というのを考えて画像を置く必要があると言ったところでしょうか。これは裏を返せば、現場のコーダーが必要に迫られて代替テキストを適当に入れればよい、というものではないということですね…。</p> <p>脇道にそれました。話を元に戻すと、つまるところ、<code>&lt;h3&gt;</code>とすることがそもそもの問題となっている、と捉えることができるわけですね。ですから、もろもろを勘案すると下記のようになるのがよさそうでしょうか。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;plate4.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>Kenzo<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">br</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;sp-only&quot;</span><span class="synIdentifier">&gt;</span>Yamaguchi <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> </pre> <p>名前と苗字の間で改行したいのであれば素直に<code>&lt;br&gt;</code>を使えばよいかと。SP(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>)幅の場合だけ改行を設けたいのであれば、PC幅で<code>display:none</code>を噛ませておいて、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D6%A5%EC%A1%BC%A5%AF%A5%DD%A5%A4%A5%F3%A5%C8">ブレークポイント</a>で<code>display:none</code>を解除すればよいだけ、ということですね。素の<a class="keyword" href="https://d.hatena.ne.jp/keyword/CSS">CSS</a>だとこれでよかったんでしたっけ<a href="#f-e9e916e7" id="fn-e9e916e7" name="fn-e9e916e7" title="メディアクエリーすらまともに書けないのがバレる回">*2</a>。</p> <pre class="code lang-css" data-lang="css" data-unlink><span class="synPreProc">@media (</span><span class="synType">max-width</span><span class="synPreProc">: </span><span class="synConstant">600px</span><span class="synPreProc">) </span><span class="synIdentifier">{</span> <span class="synIdentifier">.sp-only</span> <span class="synIdentifier">{</span> <span class="synType">display</span>: <span class="synConstant">none</span>; <span class="synIdentifier">}</span> <span class="synIdentifier">}</span> </pre> <p>こうすると<code>&lt;h3&gt;</code>がなくなってページ全体のアウトラインとしてどうなんでしょう、というのはありますが、先行して</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-title__wrapper&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h2</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section__title&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;works&quot;</span><span class="synIdentifier">&gt;</span>WORKS<span class="synIdentifier">&lt;/</span><span class="synStatement">h2</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>とあるので特段の問題は起きないでしょう。</p> <p>とまあ、こんな感じで1つのモジュールであれやこれやと検討できてしまうのが<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックの恐ろしいところ(?)でもあります<a href="#f-e2214f7e" id="fn-e2214f7e" name="fn-e2214f7e" title="アクセシビリティチェックに限らず、フロントエンドでHTMLを検討し出すと止まらないというのはある程度共感してもらえるかしらとは">*3</a>。裏を返せば、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を担保したウェブサイトを提供するのであれば、モジュール設計時に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックを行う必要があるということになります。ちなみに勤務先の業務では、自社制作で高度な<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が要求されるときは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>専門の部門が都度チェックを行ってたりしてます。</p> <h2 id="モーダル">モーダル</h2> <p>随分とボタンの話が長くなってしまいましたが、ボタンを押した時に出現するモーダルの話に移っていきましょう。</p> <p>@HeldaForStudy氏の立てた方針として、</p> <blockquote><p>2. works部分のモーダルを削除し、別途worksのページを設けてリンクとして遷移するようにする</p></blockquote> <p>とありますが、仮にモーダルを存続させて、達成基準を満たすのであればどうなるのか、を念頭に置いて現状把握をしていきたいと思います。</p> <p>キーボード操作をすればわかりますが、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/Kenzo">Kenzo</a> Yamaguchi」のボタンを押して<code>Tab</code>キーで移動していくと、すぐにモーダルの中にフォーカスが移動しない、というのは@HeldaForStudy氏が<a href="https://waic.jp/translations/WCAG21/Understanding/focus-order.html">SC 2.4.3</a>「フォーカス順序」の問題として挙げているとおりです。ただこの根本の原因としては(例によっていろいろ省いたHTMLですが)、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span><span class="synError">&gt;</span>Kenzo Yamaguchi<span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span><span class="synError">&gt;</span>Michiyo Yamaguchi<span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;construction.html&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">作品一覧を見る</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synComment">&lt;!-- 堅造モーダル --&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jsModalKenzo&quot;</span><span class="synIdentifier">&gt;</span>...<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synComment">&lt;!-- みちよモーダル --&gt;</span>↩ <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jsModalMichiyo&quot;</span><span class="synIdentifier">&gt;</span>...<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>というHTMLソースの出現順序に根本的な問題があるということですね(<a href="https://waic.jp/translations/WCAG21/Understanding/meaningful-sequence.html">SC 1.3.2</a>「意味のあるシーケンス」)。モーダルも大雑把に言ってしまえば結局開閉するコンテンツですから、ボタンの直後に置くのが適切でしょう。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span><span class="synError">&gt;</span>Kenzo Yamaguchi<span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> <span class="synComment">&lt;!-- 堅造モーダル --&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jsModalKenzo&quot;</span><span class="synIdentifier">&gt;</span>...<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span><span class="synError">&gt;</span>Michiyo Yamaguchi<span class="synIdentifier">&lt;/</span><span class="synStatement">button</span><span class="synIdentifier">&gt;</span> <span class="synComment">&lt;!-- みちよモーダル --&gt;</span>↩ <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jsModalMichiyo&quot;</span><span class="synIdentifier">&gt;</span>...<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;construction.html&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">作品一覧を見る</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>また、フォーカスの順序という意味では、モーダル内でキーボードフォーカスが封じ込められていないという問題もあります。そして、このモーダルがモーダルだということを支援技術に伝えられていません(<a href="https://waic.jp/translations/WCAG21/Understanding/name-role-value.html">SC 4.1.2</a>「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>) 」)</p> <p>そのあたりの<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>の都合、フォーカスの制御は<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> APGの<a href="https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/">Modal Dialog Example</a>にあれそれ書いているので、自前でモーダルを書くというのであれば、<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> APGを参考にすればよいかと。もっとも、もしかしたら<code>&lt;dialog&gt;</code>を使ってしまったほうが早いのかもしれません。</p> <p>モーダルの「ガワ」の話はこんなところでしょうか…。</p> <hr style="margin:2em"> <p>さて、モーダルの中身としては、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%AF%A5%EA%A1%BC%A5%F3%A5%B7%A5%E7%A5%C3%A5%C8">スクリーンショット</a>としてはこういう感じになっているわけですが</p> <p><figure class="figure-image figure-image-fotolife"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240322/20240322234850.png" alt="&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="1124" height="879" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>モーダルは、上段(桃色枠部分)のメインスライド、中段(青枠部分)のサムネイル、下段(緑枠部分)のボタンで構成されている。</figcaption></figure></p> <p>上・中・下段、どれもマウスで操作できてしまうのですよね…。これは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>というよりかは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の視点で検討いただいた方がよい…のかもしれません。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の観点としては、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8">コンポーネント</a>が操作できるということは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8">コンポーネント</a>の名前を持つ必要がある、というところに留意いただければと。</p> <p>モーダル上段のスライド1枚目に戻ってみましょう。中身はこんな感じです。</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-img&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/kenzo-prof.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;山口堅造&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-box&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span><略歴><span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> 多摩美術大学 大学院修士課程終了 1982年<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> 茨城県に工房移設(アトリエ金工やまぐち) 1998年<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span><主な発表活動><span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> 池袋西武・玉川高島屋・松屋銀座にてグループ展 1980年~<span class="synIdentifier">&lt;</span><span class="synStatement">br</span><span class="synIdentifier">&gt;</span> ... 日本煎茶工芸展 [文部科学大臣奨励賞]「銅鎚起錫彩茶托」 2005年 <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>まず目に付くのが、見出しで装飾の目的で不等号「<」「>」を用いていることでしょうか(SC 1.3.1)。そのような記号で装飾せずに、<a class="keyword" href="https://d.hatena.ne.jp/keyword/CSS">CSS</a>でいい感じに見出しを装飾してもらえれば。</p> <p>また、連続する<code>&lt;br&gt;</code>を余白を設ける目的で使用しています(SC 1.3.1)。HTML仕様で<a href="https://momdo.github.io/html/text-level-semantics.html#the-br-element"><code>br</code>要素</a>は、</p> <blockquote><p>br要素は改行を表す。</p></blockquote> <p>と定義されています。余白のためには<a class="keyword" href="https://d.hatena.ne.jp/keyword/CSS">CSS</a>で制御するようにします。</p> <p>SC 1.3.1としてマークするのがよいのかは微妙なラインですが、「略歴」と「主な発表活動」は情報構造上、リストであると言えます。どう<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%AF%A5%A2%A5%C3%A5%D7">マークアップ</a>するのかはかなり趣味の領域になってくると思いますが、素直に<code>&lt;ul&gt;</code>を用いるパターン、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-box&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span>略歴<span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span>多摩美術大学 大学院修士課程終了 1982年<span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span>茨城県に工房移設(アトリエ金工やまぐち) 1998年<span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span>主な発表活動<span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span>池袋西武・玉川高島屋・松屋銀座にてグループ展 1980年~<span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span>日本煎茶工芸展 [文部科学大臣奨励賞]「銅鎚起錫彩茶托」 2005年<span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p><code>&lt;dl&gt;</code>を用いるパターン1(見出しを変更)、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-box&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span>略歴<span class="synIdentifier">&lt;/</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>多摩美術大学 大学院修士課程終了 1982年<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>茨城県に工房移設(アトリエ金工やまぐち) 1998年<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span>主な発表活動<span class="synIdentifier">&lt;/</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>池袋西武・玉川高島屋・松屋銀座にてグループ展 1980年~<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;/</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p><code>&lt;dl&gt;</code>を用いるパターン2(亜種として、明示的に「年」と「内容」を構造化する)、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-box&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span>略歴<span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span>1982年<span class="synIdentifier">&lt;/</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>多摩美術大学 大学院修士課程終了<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span>1998年<span class="synIdentifier">&lt;/</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>茨城県に工房移設(アトリエ金工やまぐち)<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span>主な発表活動<span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span>1980年~<span class="synIdentifier">&lt;/</span><span class="synStatement">dt</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span>池袋西武・玉川高島屋・松屋銀座にてグループ展<span class="synIdentifier">&lt;/</span><span class="synStatement">dd</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;/</span><span class="synStatement">dl</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>などがあるでしょうか。まあこのあたりは趣味ですので、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%BF%A5%A4%A5%EB%A5%B7%A1%BC%A5%C8">スタイルシート</a>の当てやすさを勘案してお好きなのをどうぞ、というところでしょうか…。</p> <p>あと、人名の代替テキストは、スクリーンリーダーのユーザーには伝わって、視覚で見ているユーザーには伝わらないという意味で<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-content.html">SC 1.1.1</a>「非テキストコンテンツ」としてマークするかもしれません。</p> <p>それを踏まえて、1つの情報構造の形として、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__modal&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;jsModalKenzo&quot;</span><span class="synIdentifier"> </span><span class="synType">role</span><span class="synIdentifier">=</span><span class="synConstant">&quot;dialog&quot;</span><span class="synIdentifier"> </span><span class="synType">aria-labelledby</span><span class="synIdentifier">=</span><span class="synConstant">&quot;modal-heading-1&quot;</span><span class="synIdentifier"> aira-modal=</span><span class="synConstant">&quot;true&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h3</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;modal-heading-1&quot;</span><span class="synIdentifier">&gt;</span>山口堅造<span class="synIdentifier">&lt;/</span><span class="synStatement">h3</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-img&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/kenzo-prof.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-works__swiper-prof-box&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span>略歴<span class="synIdentifier">&lt;/</span><span class="synStatement">h4</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>としてしまえば、モーダルの内外でアウトラインとして見出しの階層構造を崩さずに済みますし、モーダルの名前を見出しで提示できます(SC 1.3.1、SC 4.1.2の観点から)。こうすることで、「略歴」は<code>&lt;h4&gt;</code>でも<code>&lt;dt&gt;</code>でもよくなります。</p> <p>さんざっぱらモーダルの場合を仮定してあれやこれやを書きましたが、</p> <blockquote><p>2. works部分のモーダルを削除し、別途worksのページを設けてリンクとして遷移するようにする</p></blockquote> <p>というのが改修方針でした。そもそもモーダルダイアログを選択した方がよいのかについては、<a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)</a>の8章でかなり厚く書かれているので、一読するとよいでしょう。</p> <h2 id="小まとめ">小まとめ</h2> <p>あれ、モーダルの話しかしてないような…(ふるえ)。</p> <p>脇道にそれたり、私の趣味というか好みに走っている面も多分にありましたが、達成基準として<a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>「情報及び関係性」と<a href="https://waic.jp/translations/WCAG21/Understanding/name-role-value.html">SC 4.1.2</a>「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>) 」が多くのウェイトを占めています。マシンリーダブルの1つの考え方としては、主にDOMツリーから生成される、堅牢な<a href="https://wicg.github.io/aom/explainer.html#background-dom-tree-accessibility-tree-and-platform-accessibility-apis">アクセシビリティツリー</a>を作ることにありますから、必然的にそうなってくるものと思っています。</p> <p>また、実装した後で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に取り組むのでは遅いということもうっすら感じてもらえれば幸いです。実装よりも前のビジュアルデザイン、さらにその前の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EF%A5%A4%A5%E4%A1%BC%A5%D5%A5%EC%A1%BC%A5%E0">ワイヤーフレーム</a>を描く段階で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の闘いが始まっている、と言えるでしょう。</p> <p><a href="https://momdo.hatenablog.jp/entry/20240325/1711330200">その3に続きます</a>。</p> <div class="footnote"> <p class="footnote"><a href="#fn-61b44f21" id="f-61b44f21" name="f-61b44f21" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">セクショニングという意味では、厳密には怪しい区切り方でしょうが、それは脇に置いて</span></p> <p class="footnote"><a href="#fn-e9e916e7" id="f-e9e916e7" name="f-e9e916e7" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">メディアクエリーすらまともに書けないのがバレる回</span></p> <p class="footnote"><a href="#fn-e2214f7e" id="f-e2214f7e" name="f-e2214f7e" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックに限らず、フロントエンドでHTMLを検討し出すと止まらないというのはある程度共感してもらえるかしらとは</span></p> <p class="footnote"><a href="#fn-3e379da9" id="f-3e379da9" name="f-3e379da9" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">最近話題の改正障害者差別解消法は、「環境の整備」に位置づけられるウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を法的に強制するものではない点に注意。</span></p> </div> momdo アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1) hatenablog://entry/6801883189092576415 2024-03-21T22:41:38+09:00 2024-03-28T12:45:42+09:00 ツイッターでアクセシビリティ向上日誌2【目視試験編】‐Akira Tsuda Portfolio and Blogというのを見かけて、そういえばアクセシビリティチェックって何をどうしているのかという話をウェブ上でほとんど見かけない(というか自分は知らない)ので、思い切ってチェックの過程や考え方を書いてみようかなと。 チェック対象のサイトを作った@HeldaForStudy氏に尋ねたところ、題材として使ってよいという返事をいただいたので、「アトリエ金工やまぐち」のサイト1ページをチェックしてみることにします。 対象ページはBasic認証がかかっているので、アクセシビリティ向上日誌1【各種ツール評… <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%C4%A5%A4%A5%C3%A5%BF%A1%BC">ツイッター</a>で<a href="https://such-a-thing.halfmoon.jp/blog/acc-report2/">アクセシビリティ向上日誌2【目視試験編】‐Akira Tsuda Portfolio and Blog</a>というのを見かけて、そういえば<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックって何をどうしているのかという話をウェブ上でほとんど見かけない(というか自分は知らない)ので、思い切ってチェックの過程や考え方を書いてみようかなと。</p> <p>チェック対象のサイトを作った<a href="https://twitter.com/HeldaForStudy/">@HeldaForStudy</a>氏に尋ねたところ、題材として使ってよいという返事をいただいたので、「アトリエ金工やまぐち」のサイト1ページをチェックしてみることにします。</p> <p>対象ページは<a class="keyword" href="https://d.hatena.ne.jp/keyword/Basic%C7%A7%BE%DA">Basic認証</a>がかかっているので、<a href="https://such-a-thing.halfmoon.jp/blog/acc-report1/">アクセシビリティ向上日誌1【各種ツール評価編】</a>からたどってください。 @HeldaForStudy氏はレベルはA<a href="#f-812d46c1" id="fn-812d46c1" name="fn-812d46c1" title="WCAG 2.0なのか2.1なのかがわかりませんが、まあどっちでも大差ないといえばないので">*1</a>でチェックしたとのことなので、チェック基準はWCAG 2.1レベルAでチェックすることにしましょう。 わたしは普段はCOB-CHAを使っていないので、ページの頭から問題点を挙げていくスタイルで。</p> <p>なお、このページの目的は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックにどう取り組んでいるのかを説明するためであって、氏の制作したサイトやチェック結果にネガティブなことを言いたいわけではないので、そこは念のため記載しておきます。 また、チェックに抜け漏れ、誤りがある可能性があることもお断りしておきます。</p> <h2 id="機械検証ツールによる検証について">機械検証(ツールによる検証)について</h2> <p>業務では<a href="https://github.com/validator/validator">Nu Html Checker</a><a href="#f-0ddd5a6c" id="fn-0ddd5a6c" name="fn-0ddd5a6c" title="勤務先では社内にサーバーが立てられています">*2</a>と<a href="https://github.com/dequelabs/axe-core">axe-core</a>を利用した社内ツールでぱぱーっとチェックしますが<a href="#f-3e16568c" id="fn-3e16568c" name="fn-3e16568c" title="miCheckerは使っていません">*3</a>、今回は<a href="https://such-a-thing.halfmoon.jp/blog/acc-report1/">アクセシビリティ向上日誌1【各種ツール評価編】</a>で既にチェックされているので結果を改めてここで書く必要はないでしょう。</p> <p>なお、<a href="https://chromewebstore.google.com/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd?pli=1">axe Devtools</a>も<a href="https://developer.chrome.com/docs/lighthouse/accessibility/scoring?hl=ja">Lighthouse</a>も中身はaxe-coreなので、どちらかお好きな方を使えばよいかと(axe-coreのバージョンが違ったりするかもなので、違う結果が返ってくるかもしれないですけど)</p> <p>ところで、よくある誤解としてNu Html Checkerのエラーは全部SC 4.1.1「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%BD%CA%B8%B2%F2%C0%CF">構文解析</a>」<a href="#f-8a4f41f8" id="fn-8a4f41f8" name="fn-8a4f41f8" title="Success Criteria、達成基準のこと。漢字を打つのが面倒なので、SCとします">*4</a>の問題とすることがあるみたいですが、それは誤りです。<a href="https://waic.jp/translations/WCAG21/Understanding/parsing.html">SC 4.1.1</a>は<a href="#f-cb68cbd8" id="fn-cb68cbd8" name="fn-cb68cbd8" title="W3Cの文書は基本的に日本語訳があればそれを張っていきます">*5</a>、</p> <blockquote><p>達成基準 4.1.1 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%BD%CA%B8%B2%F2%C0%CF">構文解析</a> (レベル A): <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%AF%A5%A2%A5%C3%A5%D7">マークアップ</a>言語を用いて実装されているコンテンツにおいては、要素には完全な開始タグ及び終了タグがあり、要素は仕様に準じて<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%FE%A4%EC%BB%D2">入れ子</a>になっていて、要素には重複した属性がなく、どの ID も一意的である。ただし、仕様で認められているものを除く。</p></blockquote> <p>とあるように、タグが壊れてない、要素が誤った<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%FE%A4%EC%BB%D2">入れ子</a>になっていない、開始タグ内に同一属性が存在しない、IDが一意(重複したID値がない)の4つです。…まあ、達成基準の注記にあるとおり、</p> <blockquote><p>HTML 又は <a class="keyword" href="https://d.hatena.ne.jp/keyword/XML">XML</a> を使用するすべてのコンテンツでは、この達成基準は常に満たされているとみなすべきである。</p></blockquote> <p>というように(WCAG 2.2を契機に)明示されたので、SC 4.1.1は常に満たされているものとして扱います。Nu Html Checkerの報告は概ね達成基準の問題にならないことの方が多いですが<a href="#f-11cf5e6e" id="fn-11cf5e6e" name="fn-11cf5e6e" title="HTMLの品質を測るものであって、アクセシビリティチェックのためのツールではないですので">*6</a>、達成基準上の問題となるのであれば、ほとんどの場合はSC 1.3.1「情報及び関係性」かSC 4.1.2「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>)」で判断することになるので、(特にこれから<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックをするという人は)忘れて大丈夫でしょう<a href="#f-78b30b18" id="fn-78b30b18" name="fn-78b30b18" title="WCAG 2 FAQ How and why is success criteria 4.1.1 Parsing obsolete?がそう言っているように">*7</a>。</p> <p>HTMLのコンテンツモデルの違反は、情報構造の問題ですから、<a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>としてマークしていきます。</p> <blockquote><p>達成基準 1.3.1 情報及び関係性 (レベル A): 何らかの形で提示されている情報、構造、及び関係性は、プログラムによる解釈が可能である、又はテキストで提供されている。</p></blockquote> <h2 id="目視検証について">目視検証について</h2> <p>本題に入る前に、<a href="https://www.jidaikobo.com/archives/38.html">COB-CHA</a>、いいかえるなら実装チェックリストをどうして使っていないのか、という話をしておきましょう。WCAG 2.1解説書の<a href="https://waic.jp/translations/WCAG21/Understanding/understanding-techniques.html">WCAG 達成基準の達成方法を理解する</a>では</p> <blockquote><p>達成方法は、参考情報である。つまり、達成方法は必須要件ではない。WCAG 2.1 への適合を判断する根拠は、WCAG 2.1 で規定している達成基準であり、達成方法ではない。</p></blockquote> <p>とあります。つまりTechniques for WCAG 2(日本語訳名でいう「WCAG達成方法集」)は、参考情報であって、WCAG 2の達成基準を満たしているかどうか<strong>だけ</strong>が判断基準です。また「その他の達成方法」にあるように、</p> <blockquote><p><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> の WCAG 2.1 達成方法集文書にある達成方法に加えて、WCAG 達成基準を満たすその他の方法がある。<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> の達成方法は包括的なものではなく、より新しい技術や状況をカバーしていないかもしれない。</p></blockquote> <p>つまり、必ずしも達成方法(Techniques)を使ってWCAG 2を満たす必要はなく、Techniquesにはない別の方法で達成基準(SC)を満たしてしまっても問題ない、ということになります。実際に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックをこなしていけばわかりますが、チェックリストで判断するのはものすごく窮屈です。</p> <p>前置きはさておき、中身を見ていきましょう。</p> <h3 id="カルーセルの問題">カ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>の問題</h3> <p>まず目に付くのは、カ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>が止まらない問題ですね。<a href="https://waic.jp/translations/WCAG21/Understanding/pause-stop-hide.html">SC 2.2.2</a>「一時停止、停止、非表示」の問題ですが、これは@HeldaForStudy氏も問題点としてあげているとおりです。ちなみにSC 2.2.2は<a href="https://waic.jp/translations/WCAG21/#cc5">非干渉</a>の達成基準ですので、WCAG2の観点では致命的…と評価されることになります。</p> <p>swiperの評価をするのが面倒ですが、一応中身を見ておきましょう…</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">ul</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;swiper-wrapper section-top__swiper-wrapper&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;swiper-wrapper-309340565d92446a&quot;</span><span class="synIdentifier"> </span><span class="synType">aria-live</span><span class="synIdentifier">=</span><span class="synConstant">&quot;off&quot;</span><span class="synIdentifier"> </span><span class="synType">style</span><span class="synIdentifier">=</span><span class="synConstant">&quot;transition-duration: 0ms;&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;swiper-slide section-top__swiper-slide swiper-slide-prev&quot;</span><span class="synIdentifier"> </span><span class="synType">role</span><span class="synIdentifier">=</span><span class="synConstant">&quot;group&quot;</span><span class="synIdentifier"> </span><span class="synType">aria-label</span><span class="synIdentifier">=</span><span class="synConstant">&quot;1 / 5&quot;</span><span class="synIdentifier"> </span><span class="synType">data</span><span class="synIdentifier">-swiper-slide-index=</span><span class="synConstant">&quot;0&quot;</span><span class="synIdentifier"> </span><span class="synType">style</span><span class="synIdentifier">=</span><span class="synConstant">&quot;width: 1648px; opacity: 0; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;&quot;</span><span class="synIdentifier">&gt;</span> ... <span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> </pre> <p>となっているわけですが、axeが指摘するとおり、</p> <blockquote><p>リスト要素内に許可されていない直接の子要素が存在します: [role=group]</p></blockquote> <p>ということですが、仕様に沿って何がどうダメなのかを確認しましょう。</p> <p>HTMLのネイティブロールは、<a href="https://momdo.github.io/html-aria/">ARIA in HTML</a>仕様で定義されています。これによると、<a href="https://momdo.github.io/html-aria/#el-ul"><code>ul</code></a>は<code>list</code>、<a href="https://momdo.github.io/html-aria/#el-li"><code>li</code></a>は<code>listitem</code>を持ちます。ところが、ここでのコードは<code>&lt;li ... role="group"&gt;</code>となっており、ロールが上書きされています。つまり親子関係としては</p> <ul> <li>list <ul> <li>group</li> </ul> </li> </ul> <p>というようになっているわけですが、<a href="https://momdo.github.io/wai-aria-1.3/">WAI-ARIA仕様</a> <a href="#f-f81af7f2" id="fn-f81af7f2" name="fn-f81af7f2" title="なんでリンクがWAI-ARIA 1.3なの?というツッコミがありそうですが、訳者の都合です">*8</a>によれば<a href="https://momdo.github.io/wai-aria-1.3/#list"><code>list</code></a>ロールは、<code>listitem</code>ロールしか持てません(これは、HTMLの<code>&lt;ol&gt;</code>、<code>&lt;ul&gt;</code>が<code>&lt;li&gt;</code>しか持てないのと同じ)。ですから、<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>仕様違反、つまり情報構造としての誤りとなるため、SC 1.3.1の問題となります(axeの報告どおり)。</p> <p>パッチ的な修正方法としては<code>role="group"</code>を削除すればそれでよいでしょう。根本的にswiperが悪いので、別のライブラリを使用するのを推奨します(@HeldaForStudy氏が言及しているとおり、Splideを使うのも一つの手かもしれません。ただ、実装にも依るので<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>上の問題が解決するのかは、チェックしてみないと何ともいえません)。個人的にはカ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>は単なるリストの亜種でしかないと思っているので、あれそれと<code>role</code>属性を付けなくといいのではと思いますけど。</p> <p>カ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>のスライドの中身としては、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-top__swiper-img-pc&quot;</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/michiyo/vase19-pc.jpg&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;山口みちよ「(作品名)」&quot;</span><span class="synIdentifier">&gt;</span> </pre> <p>というように提示されていますが、これは代替テキストが視覚以上の情報を含んでしまう(言いかえると、画像だけでは作品名は伝わらない)ので、作品名を提供したい(情報を持つ画像である)というのであれば、目で見えるようにテキストで提供するのが適切でしょう。<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-content.html">SC 1.1.1</a>「非テキストコンテンツ」の問題としてマークします。ただまあ、(後述する)「日常に火を灯す」とロゴの画像の背景となっていると捉えると、単なる装飾画像と捉えるのが適当かもしれません。</p> <p>余談ですが、<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> WAIの<a href="https://www.w3.org/WAI/tutorials/images/decision-tree/ja">altディシジョンツリー</a>の日本語訳が最近公開されたので、代替テキストに悩んだら初手としてこちらを当たるのもよいでしょう。</p> <p>カ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>のボタンの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比(<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-contrast.html">SC 1.4.11</a>)であったり、フォーカスが見えなかったり(<a href="https://waic.jp/translations/WCAG21/Understanding/focus-visible.html">SC 2.4.7</a>)、リードテキスト「日常に火を灯す」の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比(<a href="https://waic.jp/translations/WCAG21/Understanding/focus-visible.html">SC 1.4.3</a>)が気になるところですが、いずれもレベルAAの問題です(今はレベルAで見ているのでスルー)。ちなみに、ロゴは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比の達成基準の例外となることに注意しておきましょう。</p> <p>ああでも、カ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EB%A1%BC%A5%BB%A5%EB">ルーセル</a>のボタンとしては、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;swiper-pagination-bullet&quot;</span><span class="synIdentifier"> </span><span class="synType">tabindex</span><span class="synIdentifier">=</span><span class="synConstant">&quot;0&quot;</span><span class="synIdentifier"> </span><span class="synType">role</span><span class="synIdentifier">=</span><span class="synConstant">&quot;button&quot;</span><span class="synIdentifier"> </span><span class="synType">aria-label</span><span class="synIdentifier">=</span><span class="synConstant">&quot;Go to slide 1&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> </pre> <p>日本語のページなのに<code>aria-label</code>属性によるアクセシブルな名前が英語なのは微妙なので、<a href="https://waic.jp/translations/WCAG21/Understanding/name-role-value.html">SC 4.1.2</a>「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>)」の問題としてマークしちゃいましょう(まあ<code>&lt;span&gt;</code>の中身が空っぽなのも気にはなりますが、目をつむっておきましょう)。</p> <h3 id="h1見出しの検討"><code>h1</code>見出しの検討</h3> <p><code>h1</code>見出しのテキスト(HTMLソースは改)はこういう格好ですが</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">h1</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;section-top__lead&quot;</span><span class="synIdentifier">&gt;</span> 日常に火を灯す <span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/logo1.png&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;アトリエ金工やまぐち&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">h1</span><span class="synIdentifier">&gt;</span> </pre> <blockquote><p>キャッチコピー「日常に火を灯す」は構造的には見出しではないのでh1は不適当</p></blockquote> <p>と@HeldaForStudy氏は評価しているものの、リードテキストを<code>h1</code>に含めること自体は不自然ではないと思います。どうしても見出し要素に入れたくないということであれば、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">header</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span>日常に火を灯す<span class="synIdentifier">&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">h1</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/logo1.png&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;アトリエ金工やまぐち&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">h1</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">header</span><span class="synIdentifier">&gt;</span> </pre> <p>というのもなくはないですが、スクリーンリーダーの見出しジャンプを考えると上策だとは思えず、今のテキストの入れ方のままでよいと個人的には思います。</p> <p>あと、<code>h1</code>がある時点で<a href="https://waic.jp/translations/WCAG21/Understanding/bypass-blocks.html">SC 2.4.1</a>「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D6%A5%ED%A5%C3%A5%AF%A5%B9">ブロックス</a>キップ」は自動的に満たされます。説明は<a href="https://accessible-usable.net/2018/03/entry_180302.html">ブロックスキップを考える | Accessible &amp; Usable</a>あたりを読んでもらうとよいかなと。</p> <h3 id="メニュー">メニュー</h3> <p>HTMLソース順という意味ではちょっと前後しますが、PC幅だと下スクロールしてからはじめて(画面左上の)サイドバーが出現する一方で、HTMLソースとしては<code>&lt;header&gt;</code>として<code>&lt;body&gt;</code>先頭に記述されているために、順方向のキーボードフォーカス移動でたどり着けない、という問題があります。<a href="https://waic.jp/translations/WCAG21/Understanding/focus-order.html">SC 2.4.3</a>「フォーカス順序」というよりかはむしろ、根本的にはHTMLソース上の提示順に問題があるので、<a href="https://waic.jp/translations/WCAG21/Understanding/meaningful-sequence.html">SC 1.3.2</a>「意味のあるシーケンス」の問題としてマークしておきましょう。(ワンソースで記述することを考えると、構造として破綻してしまうか…)</p> <p><figure class="figure-image figure-image-fotolife"> <span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20240321/20240321221831.png" alt="&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="908" height="934" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span> <figcaption><a class="keyword" href="https://d.hatena.ne.jp/keyword/Firefox">Firefox</a>の開発者ツールで<a href="https://firefox-source-docs.mozilla.org/devtools-user/accessibility_inspector/index.html#show-web-page-tabbing-order">タブ順序を表示</a>させて雑に取った<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%AF%A5%EA%A1%BC%A5%F3%A5%B7%A5%E7%A5%C3%A5%C8">スクリーンショット</a>。フォーカス順序として難しいものが…。</figcaption></figure></p> <p>SP(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>)幅ですと、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%CF%A5%F3%A5%D0%A1%BC%A5%AC">ハンバーガ</a>ーメニューとなりますが(下記ソース)、</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;open-button&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;open-button&quot;</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;open-button__line1&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;open-button__line2&quot;</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;open-button__menu&quot;</span><span class="synIdentifier">&gt;</span>menu<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span> </pre> <p>マウスでクリックできてもキーボードで押下できない(<a href="https://waic.jp/translations/WCAG21/Understanding/keyboard.html">SC 2.1.1</a>「キーボード」の問題)、「ボタン」であることがスクリーンリーダーのような支援技術に伝わらない(<a href="https://waic.jp/translations/WCAG21/Understanding/name-role-value.html">SC 4.1.2</a>「名前 (name)・役割 (role)・値 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/value">value</a>)」の問題)という状況です。まあネイティブの<code>&lt;button&gt;</code>なりを使ってくださいということですね。実装例は純粋な<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%CF%A5%F3%A5%D0%A1%BC%A5%AC">ハンバーガ</a>ーメニューってわけでもないのでなんともですが、<a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)</a>の「5.7 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%CF%A5%F3%A5%D0%A1%BC%A5%AC">ハンバーガ</a>ーメニュー」に任せます。</p> <p>「閉じる」ボタンも、ボタンの役割と名前がない(SC 4.1.2)のと、表示上はメニューの末尾にある一方で、HTMLソース上はメニューよりも前にあるのでキーボードで移動できません(SC 1.3.2)。</p> <p>いずれにせよ</p> <blockquote><p>1. メニューをサイドバーではなくヘッダとして設置</p></blockquote> <p>と最初の改善点として挙げられているので、改修で改善されるでしょう。。</p> <h4 id="Instagramの項目"><a class="keyword" href="https://d.hatena.ne.jp/keyword/Instagram">Instagram</a>の項目</h4> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;sidebar__navigation--instagram&quot;</span><span class="synIdentifier">&gt;</span>Instagram <span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;https://www.instagram.com/kenzo_kennkenn/&quot;</span><span class="synIdentifier"> </span><span class="synType">rel</span><span class="synIdentifier">=</span><span class="synConstant">&quot;noopener&quot;</span><span class="synIdentifier"> </span><span class="synType">target</span><span class="synIdentifier">=</span><span class="synConstant">&quot;_blank&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/icon-insta.png&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;Instagram-堅造&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;sidebar__navigation-yugothic&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">…</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">堅造</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;https://www.instagram.com/kinkou_yamaguchi/&quot;</span><span class="synIdentifier"> </span><span class="synType">rel</span><span class="synIdentifier">=</span><span class="synConstant">&quot;noopener&quot;</span><span class="synIdentifier"> </span><span class="synType">target</span><span class="synIdentifier">=</span><span class="synConstant">&quot;_blank&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;assets/img/icon-insta.png&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;Instagram-みちよ&quot;</span><span class="synIdentifier"> loading=</span><span class="synConstant">&quot;lazy&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;sidebar__navigation-yugothic&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">…</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">みちよ</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> </pre> <p><code>alt</code>は適切ではないと言えそうです(<a href="https://waic.jp/translations/WCAG21/Understanding/non-text-content.html">SC 1.1.1</a>「非テキストコンテンツ」)。既に先行して<a class="keyword" href="https://d.hatena.ne.jp/keyword/Instagram">Instagram</a>というテキストがあって、人名も<code>&lt;img&gt;</code>の後で提供されているために、「大事なことなので2回言いました」になってしまうことから、画像は装飾的として代替テキストを空にする(<code>alt=""</code>)のがよいかと。</p> <p>リスト構造は趣味が入ってきますので、達成基準上(<a href="https://waic.jp/translations/WCAG21/Understanding/info-and-relationships.html">SC 1.3.1</a>「情報及び関係性」)の問題とまではならない理解ですが、リストの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%FE%A4%EC%BB%D2">入れ子</a>にするとすっきりするとは思います。こういう感じでしょうか。(わかりやすさのため構造だけ記載)</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier">&gt;</span>Instagram <span class="synIdentifier">&lt;</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">aria-hidden</span><span class="synIdentifier">=</span><span class="synConstant">&quot;true&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">…</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">堅造</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;</span><span class="synStatement">li</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">a</span><span class="synIdentifier"> </span><span class="synType">href</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;&quot;</span><span class="synIdentifier">&gt;&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> </span><span class="synType">aria-hidden</span><span class="synIdentifier">=</span><span class="synConstant">&quot;true&quot;</span><span class="synIdentifier"> </span><span class="synType">class</span><span class="synIdentifier">=</span><span class="synConstant">&quot;...&quot;</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">…</span><span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span><span class="synUnderlined">みちよ</span><span class="synIdentifier">&lt;/</span><span class="synStatement">a</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">ul</span><span class="synIdentifier">&gt;</span> <span class="synIdentifier">&lt;/</span><span class="synStatement">li</span><span class="synIdentifier">&gt;</span> </pre> <p>リスト項目内で先行する画像を装飾とするならば、3点リーダーも装飾と捉えるのが自然かと思いますので、付け焼き刃的(あんまり好きじゃない)ですが、<code>aria-hidden="true"</code>とするのがよいでしょうか(SC 1.3.1の観点から)。いずれにせよ、(コロン「:」的な)3点リーダーの意味を伝えるのはこの文脈だとナシになるかと思いますので。</p> <h3 id="画面右上バナー">画面右上バナー</h3> <p><a href="https://waic.jp/translations/WCAG21/Understanding/link-purpose-in-context.html">SC 2.4.4</a>「リンクの目的 (コンテキスト内)」として挙げられていますが、特に問題ないという認識です。むしろ、キーボードのフォーカス移動のことを考えるとHTMLソース上でどこで提供すればよいのかに頭を抱える感じでしょうか…(SC 1.3.2として)。</p> <h2 id="小まとめ">小まとめ</h2> <p>まあ予想はしていましたが、ヘッダーとファーストビューで力尽きましたね(実際の業務に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックでもトップページは作業量として「重い」です)。<a href="https://momdo.hatenablog.jp/entry/20240323/1711120259">その2に続きます</a>。</p> <div class="footnote"> <p class="footnote"><a href="#fn-812d46c1" id="f-812d46c1" name="f-812d46c1" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">WCAG 2.0なのか2.1なのかがわかりませんが、まあどっちでも大差ないといえばないので</span></p> <p class="footnote"><a href="#fn-0ddd5a6c" id="f-0ddd5a6c" name="f-0ddd5a6c" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">勤務先では社内にサーバーが立てられています</span></p> <p class="footnote"><a href="#fn-3e16568c" id="f-3e16568c" name="f-3e16568c" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">miCheckerは使っていません</span></p> <p class="footnote"><a href="#fn-8a4f41f8" id="f-8a4f41f8" name="f-8a4f41f8" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">Success Criteria、達成基準のこと。漢字を打つのが面倒なので、SCとします</span></p> <p class="footnote"><a href="#fn-cb68cbd8" id="f-cb68cbd8" name="f-cb68cbd8" class="footnote-number">*5</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>の文書は基本的に日本語訳があればそれを張っていきます</span></p> <p class="footnote"><a href="#fn-11cf5e6e" id="f-11cf5e6e" name="f-11cf5e6e" class="footnote-number">*6</a><span class="footnote-delimiter">:</span><span class="footnote-text">HTMLの品質を測るものであって、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックのためのツールではないですので</span></p> <p class="footnote"><a href="#fn-78b30b18" id="f-78b30b18" name="f-78b30b18" class="footnote-number">*7</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://www.w3.org/WAI/standards-guidelines/wcag/faq/#parsing411">WCAG 2 FAQ How and why is success criteria 4.1.1 Parsing obsolete?</a>がそう言っているように</span></p> <p class="footnote"><a href="#fn-f81af7f2" id="f-f81af7f2" name="f-f81af7f2" class="footnote-number">*8</a><span class="footnote-delimiter">:</span><span class="footnote-text">なんでリンクがWAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 1.3なの?というツッコミがありそうですが、訳者の都合です</span></p> </div> momdo (メモ)ウェブアクセシビリティについて、改正障害者差別解消法はいったん脇に置いた方がいいんじゃないかみたいな話。 hatenablog://entry/6801883189092218397 2024-03-20T15:08:59+09:00 2024-03-20T15:08:59+09:00 ウェブアクセシビリティにフォーカスを当てたいときに、障害を理由とする差別の解消の推進に関する法律(障害者差別解消法)でもって、「合理的配慮」(義務)の事前的改善措置としての「環境の整備」(努力義務)という論法がわかりにくすぎると思っており、だからこそ不正確な話が出てくると思うんですよね。 なので、障害者による情報の取得及び利用並びに意思疎通に係る施策の推進に関する法律(障害者アクセシビリティ・コミュニケーション施策推進法)でもって話を進めるのがいまのところはシンプルなんじゃないですかね。通称にアクセシビリティって入ってますし。 (事業者の責務) 第五条 事業者は、その事業活動を行うに当たっては… <p>ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>にフォーカスを当てたいときに、<a href="https://elaws.e-gov.go.jp/document?lawid=425AC0000000065">障害を理由とする差別の解消の推進に関する法律</a>(障害者差別解消法)でもって、「合理的配慮」(義務)の事前的改善措置としての「環境の整備」(努力義務)という論法がわかりにくすぎると思っており、だからこそ不正確な話が出てくると思うんですよね。</p> <p>なので、<a href="https://elaws.e-gov.go.jp/document?lawid=504AC0100000050">障害者による情報の取得及び利用並びに意思疎通に係る施策の推進に関する法律</a>(障害者<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>・コミュニケーション施策推進法)でもって話を進めるのがいまのところはシンプルなんじゃないですかね。通称に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>って入ってますし。</p> <blockquote><p>(事業者の責務)<br/> 第五条 事業者は、その事業活動を行うに当たっては、障害者がその必要とする情報を十分に取得し及び利用し並びに円滑に意思疎通を図ることができるようにするよう努めるとともに、国又は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>が実施する障害者による情報の取得及び利用並びに意思疎通に係る施策に協力するよう努めなければならない。</p></blockquote> <p>(障害者差別解消法の「環境の整備」と同じ)努力義務であって、だから何がどうなるというわけではないのですけども、ウェブにおける"障害者が必要とする情報を十分に取得、利用できるようにする"というのは、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のことと解釈できるわけです。この法律にもあるとおり努力義務としてがんばりましょう、で今のところはいいと思うんですよね。まあ、がんばりましょうというかけ声だけで、何をどうがんばるのかというのは(やっぱり法律上は)ひとことも書かれてないわけなんですけども<a href="#f-5d64ea9a" id="fn-5d64ea9a" name="fn-5d64ea9a" title="それはそれとして、国の施策に協力するように努めよとしれっと書いてあるのはこれは…って感じがしたりしなかったり">*1</a>。</p> <p>このあたりが<a href="https://elaws.e-gov.go.jp/document?lawid=418AC0000000091">高齢者、障害者等の移動等の円滑化の促進に関する法律</a>(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法)と比較して、とても物足りないですよね(例として<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法だと、法令で指定する建築物にはスロープを設けて、スロープの勾配角度はここまで、というのが定められている<a href="#f-1957bacc" id="fn-1957bacc" name="fn-1957bacc" title="ちょっと古いですけどハート のあるビルをつくろうあたりが参考になるでしょうか">*2</a>)。情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関しては、理念法だけは謎に存在するんですよねぇ…。たとえば<a href="https://elaws.e-gov.go.jp/document?lawid=430AC1000000100">ユニバーサル社会の実現に向けた諸施策の総合的かつ一体的な推進に関する法律</a>とか。</p> <blockquote><p>(定義)<br/> 第二条 この法律において、次の各号に掲げる用語の意義は、当該各号に定めるところによる。<br/> (中略)<br/> 三 ユニバーサル社会の実現に向けた諸施策 全ての障害者、高齢者等が、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B4%F0%CB%DC%C5%AA%BF%CD%B8%A2">基本的人権</a>を享有する個人としてその尊厳が重んぜられ、その尊厳にふさわしい生活を保障される権利を有することを前提としつつ、障害者、高齢者等の自立した日常生活及び社会生活が確保されるようにするために、ユニバーサル社会の実現に関する国際的動向を踏まえ、次に掲げる事項を達成することを目指して行われる諸施策をいう。<br/> (中略)<br/> ニ 障害者、高齢者等が、円滑に必要な情報を取得し、及び利用することができること。</p> <p>(ユニバーサル社会の実現に向けた諸施策の策定等に当たっての留意)<br/> 第八条 国及び<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>は、ユニバーサル社会の実現に向けた諸施策の策定及び実施に当たっては、次に掲げる事項に特に留意しなければならない。<br/> (中略)<br/> 四 障害者、高齢者等の言語(手話を含む。)その他の意思疎通のための手段並びに情報の取得及び利用のための手段を確保すること。</p></blockquote> <p>まあ、対象が行政なので、だからどうしたって感じですけど。というか<a href="https://elaws.e-gov.go.jp/document?lawid=345AC1000000084">障害者基本法</a>では、</p> <blockquote><p>(情報の利用における<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化等)<br/> 第二十二条 国及び<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>は、障害者が円滑に情報を取得し及び利用し、その意思を表示し、並びに他人との意思疎通を図ることができるようにするため、障害者が利用しやすい電子計算機及びその関連装置その他情報通信機器の普及、電気通信及び放送の役務の利用に関する障害者の利便の増進、障害者に対して情報を提供する施設の整備、障害者の意思疎通を仲介する者の養成及び派遣等が図られるよう必要な施策を講じなければならない。<br/> 2 国及び<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>は、災害その他非常の事態の場合に障害者に対しその安全を確保するため必要な情報が迅速かつ的確に伝えられるよう必要な施策を講ずるものとするほか、行政の情報化及び公共分野における情報通信技術の活用の推進に当たつては、障害者の利用の便宜が図られるよう特に配慮しなければならない。<br/> 3 電気通信及び放送その他の情報の提供に係る役務の提供並びに電子計算機及びその関連装置その他情報通信機器の製造等を行う事業者は、当該役務の提供又は当該機器の製造等に当たつては、障害者の利用の便宜を図るよう努めなければならない。</p></blockquote> <p>というのがあり。昭和45年(1970年!)から「情報の利用における<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化」というコアなところはそもそも存在して、<a href="https://www8.cao.go.jp/shougai/suishin/kihonhou/shinkyu.html#law1">平成23年(2011年)の改正</a>で加筆されたものの、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%BC%D4%B4%F0%CB%DC%CB%A1">障害者基本法</a>の枠組みとしてはまあ変わらないよね、という。ただ、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%BC%D4%B4%F0%CB%DC%CB%A1">障害者基本法</a>の第22条3から、障害者<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>・コミュニケーション施策推進法の第5条で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>やっていきましょうというのは拡大されたようにも見えるので、前進もとい漸進しているといえばそうなのかもしれません。</p> <p>障害者<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>・コミュニケーション施策推進法の10条には次のようにありますので、まあ情報、とくにウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について具体的になにをどうしましょうという、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法と対になるような法律を作りましょうといういつもの締めということで<a href="#f-997643c9" id="fn-997643c9" name="fn-997643c9" title="芸がない…">*3</a>。</p> <blockquote><p>(法制上の措置等)<br/> 第十条 政府は、障害者による情報の取得及び利用並びに意思疎通に係る施策を実施するため必要な法制上又は財政上の措置その他の措置を講じなければならない。</p></blockquote> <div class="footnote"> <p class="footnote"><a href="#fn-5d64ea9a" id="f-5d64ea9a" name="f-5d64ea9a" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">それはそれとして、国の施策に協力するように努めよとしれっと書いてあるのはこれは…って感じがしたりしなかったり</span></p> <p class="footnote"><a href="#fn-1957bacc" id="f-1957bacc" name="f-1957bacc" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">ちょっと古いですけど<a href="https://www.mlit.go.jp/jutakukentiku/build/barrier-free.files/12panfuretto.pdf">ハート のあるビルをつくろう</a>あたりが参考になるでしょうか</span></p> <p class="footnote"><a href="#fn-997643c9" id="f-997643c9" name="f-997643c9" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">芸がない…</span></p> </div> momdo 書籍『障害者権利条約の初回対日審査: 総括所見の分析』にみるウェブアクセシビリティ hatenablog://entry/6801883189084158338 2024-02-18T13:57:17+09:00 2024-02-18T13:57:17+09:00 障害者権利条約 総括所見の解説書(日本障害フォーラム) - 福祉新聞Webをたまたま知って*1、これに類する書籍はないかと「総括所見」で検索をかけたところ、障害者権利条約の初回対日審査 : 総括所見の分析(リンク先はNDLサーチ)という本があることを知りました。 NDLサーチにあるように、本書では情報アクセシビリティの章(第7章)が設けられています。都下では都立中央図書館に収蔵されており、さくっと目を通したのでその感想を、というのがこの記事のあらましです。 本書の見どころはいろいろとあるのですが、第7章には「3 情報・通信に関する法的拘束力のある基準の整備について」が興味のあるところではありま… <p><a href="https://fukushishimbun.com/series06/33304">障害者権利条約 総括所見の解説書(日本障害フォーラム) - 福祉新聞Web</a>をたまたま知って<a href="#f-fb92b8d4" id="fn-fb92b8d4" name="fn-fb92b8d4" title="もちろんJDFの冊子も入手しました">*1</a>、これに類する書籍はないかと「総括所見」で検索をかけたところ、<a href="https://ndlsearch.ndl.go.jp/books/R100000002-I033217307">障害者権利条約の初回対日審査 : 総括所見の分析</a>(リンク先はNDLサーチ)という本があることを知りました。</p> <p>NDLサーチにあるように、本書では情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の章(第7章)が設けられています。都下では<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%D4%CE%A9%C3%E6%B1%FB%BF%DE%BD%F1%B4%DB">都立中央図書館</a>に収蔵されており、さくっと目を通したのでその感想を、というのがこの記事のあらましです。</p> <p>本書の見どころはいろいろとあるのですが、第7章には「3 情報・通信に関する法的拘束力のある基準の整備について」が興味のあるところではあります。これに関して、総括所見のパラ46(a)は、次を勧告しています<a href="#f-e6432792" id="fn-e6432792" name="fn-e6432792" title="以下、日本語訳は外務省の障害者権利条約のページにある総括所見の和文仮訳によります">*2</a>。</p> <blockquote><p>ウェブサイト、テレビジョン番組、その他メディア様式で公衆に提供される情報の利用の容易さ(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>)確保のために、あらゆる段階における法的拘束力のある情報及び通信の基準を開発整備すること。</p></blockquote> <p>ここからは、「2 ウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について」(p.111-113)に絞って、引用しつつ眺めてみます。</p> <blockquote><p>この指針(引用者注: <b>JIS X 8341-3:2016</b>のこと)では、3つの適合レベル(レベルA、レベルAA、レベルAAA)があり、適合レベルごとに満たすべき達成基準が定められている。(中略)公共機関に対してレベルAAを推奨しており、企業のサイトにはA、またはAAの一部に準拠することを求めている。</p></blockquote> <p>「公共機関に対してレベルAAを推奨しており」というのは<a href="https://www.soumu.go.jp/main_sosiki/joho_tsusin/b_free/guideline.html">みんなの公共サイト運用ガイドライン</a>のことを暗に指していると思われます(もっとも、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>にはレベルAAを推奨とは書いていないわけですが<a href="#f-4628a98a" id="fn-4628a98a" name="fn-4628a98a" title="要約ともいえる「みんなの公共サイト運用ガイドライン」についてでは、ポイントとして「速やかにウェブアクセシビリティ方針を策定・公開し、2017年度末までにJIS X 8341-3の適合レベルAAに準拠する。」としています">*3</a>)。なぜかはわかりませんが、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>の話が第7章のどこにも記載されておらず、筆者としては首をかしげざるを得ません。</p> <p>総括所見ではパラ6で「公共政策枠組みの設置のためにとられた措置を歓迎する。」とあり、その1つにみんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>がきちんと記載されているわけです(もっとも、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に対して筆者も思うところはありますが)。本書が「総括所見の分析」をタイトルに掲げているわけであり、内容の詳細に踏み込むとまではいかないにしろ、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>が存在していることに言及してもよいでしょう。後述しますが、デジタル庁のウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>導入ガイドブックには本書では言及しているだけに、片手落ち感が否めません。</p> <p>そして、「企業のサイトにはA、またはAAの一部に準拠することを求めている」というのは一体いつ、どこで、誰が決めたのでしょうか…。往々にして筆者はそのような文書を知りません<a href="#f-d5619fe2" id="fn-d5619fe2" name="fn-d5619fe2" title="ただし、国交省のバリアフリー整備ガイドラインは標準的な整備内容として、みんなの公共サイト運用ガイドラインを参照しつつ、レベルAAに準拠することを基本としています">*4</a>。そのような文書が存在しない以上、本書の現状分析に疑問を抱かざるを得ません。</p> <blockquote><p>しかし、問題は、このルールがあくまで<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>であり、何らの強制力を持たないことである。一部の意識の高い公共団体などは、積極的にこの指針に従ったウェブサイトの整備を進めているが、特に民間企業では、この指針に準拠しないウェブサイトを公開している場合が少なくない。</p></blockquote> <p>ここで唐突に「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」という語が出てきて戸惑いを覚えますが、これはおそらく「指針」、すなわちJIS X 8341-3:2016のことを指すのでしょう。法令でJIS X 8341-3が引用されていない以上、任意規格にしか過ぎないのですから、当然といえば当然ではあります。</p> <blockquote><p>このような現状を踏まえ、権利委員会は、ウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を確保するためには、法的拘束力のあるウェブサイトの標準規格を策定することが必要だと勧告するのである。</p></blockquote> <p>冒頭にも記載した外務省仮訳によれば、「法的拘束力のある情報及び通信の基準を開発整備すること。」を求めているのであって、「ウェブサイトの標準規格を策定することが必要」とは言っていません。これは誤りでしょう。</p> <p>念のため英文も見てみましょう。パラ46(a)は、</p> <blockquote><p>Develop legally binding information and communication <mark>standards</mark> at all levels to ensure the accessibility of information provided to the public, including on websites, on television and in other media formats;</p></blockquote> <p>と、standardという語が使われており、(JISのような)規格のことを言っているかのように見えるかもしれません。しかし、たとえばパラ5(e)では、</p> <p>外務省仮訳:</p> <blockquote><p>施設及びサービス等の利用の容易さ(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>)<mark>基準</mark>を促進した<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%E2%CE%F0%BC%D4%A1%A2%BE%E3%B3%B2%BC%D4%C5%F9%A4%CE%B0%DC%C6%B0%C5%F9%A4%CE%B1%DF%B3%EA%B2%BD%A4%CE%C2%A5%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">高齢者、障害者等の移動等の円滑化の促進に関する法律</a>(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法)の改正(2018年及び2020年)</p></blockquote> <p>英文:</p> <blockquote><p>Act on Promotion of Smooth Movement of Older Persons and Disabled Persons (Barrier-free Law), amended in 2018 and 2020, promoting accessibility <mark>standards</mark>;</p></blockquote> <p>のようになっています。これは<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/index.html">バリアフリー法</a>のもとにある、公共交通施設や建築物等の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>の<strong>基準</strong>のことを指しているはずです。つまり、ウェブサイトを含む情報分野に関して、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法と対になるような法令を整えよ、というのが勧告の趣旨のはずです。</p> <p>もっとも、本書の続きの段落では米国の508条やADAを挙げつつ(そして残念ながら欧州の動きには触れられることなく)、</p> <blockquote><p>このように、我が国においても、ウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保を、サイト制作者の任意の取り組みに任せるだけではなく、一定の強制力のあるルール作りを国全体として進めていかなければならないと考える。</p></blockquote> <p>と述べており、誤った解釈しているわけではないとは思いますが…。</p> <p>本書では、「2 ウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について」の最後の話題として、JISとWCAGについて言及しています<a href="#f-c42d7f7c" id="fn-c42d7f7c" name="fn-c42d7f7c" title="「WCAG2.1」や「WCAG2.2」とスペースなしで記述されているのは原文ママです">*5</a>。</p> <blockquote><p>WCAG2.0が策定された後の技術革新や社会の変化に合わせ、2018年にWCAGは2.1に改定され、2023年中にはWCAG2.2が公開されるといわれている(2023年9月時点では、勧告案の段階である)。WCAG2.0では、スマートホンなどの機器からウェブサイトにアクセスする場合の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保、ロービジョンや<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%A7%C3%CE%BE%E3%B3%B2">認知障害</a>を対象とする<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保などが不十分であり、WCAGの新しい版ではこれらが付け加えられている(これら最新の規格を踏まえて網羅的にウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>についてまとめられたものとして、デジタル庁の「ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>導入ガイドブック」(中略)がある)。</p></blockquote> <p>まず、WCAG 2.0でロービジョン、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%A7%C3%CE%BE%E3%B3%B2">認知障害</a>に対する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保が不十分という認識が必ずしも正確ではないということを述べておく必要があるでしょう。<a href="https://waic.jp/translations/WCAG20/">WCAG 2.0</a>(日本語訳)の概要には次のように記載されています。</p> <blockquote><p>Web Content Accessibility Guidelines (WCAG) 2.0 は、ウェブコンテンツをよりアクセシブルにするための広範囲に及ぶ推奨事項を網羅している。 この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に従うことで、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%B4%CC%D5">全盲</a>又はロービジョン、ろう又は難聴、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B3%D8%BD%AC%BE%E3%B3%B2">学習障害</a>、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%A7%C3%CE%BE%E3%B3%B2">認知障害</a>、運動制限、発話困難、光感受性発作及びこれらの組合せ等を含んだ、様々な障害のある人に対して、コンテンツをアクセシブルにすることができる。又、この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に従うと、多くの場合、ほとんどの利用者にとってウェブコンテンツがより使いやすくなる。</p></blockquote> <p>WCAG 2.0でロービジョンや<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%A7%C3%CE%BE%E3%B3%B2">認知障害</a>のことをまったく考えていないわけではないことは、はっきりと言及しておきたいと思います。</p> <p>さて、WCAG 2.1(日本語訳)の<a href="https://waic.jp/translations/WCAG21/#comparison-with-wcag-2-0">WCAG 2.0 との比較</a>では次のように記載されています。</p> <blockquote><p>WCAG 2.1 は、認知又は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B3%D8%BD%AC%BE%E3%B3%B2">学習障害</a>のある利用者、ロービジョンの利用者、及びモバイルデ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%A4%A5%B9">バイス</a>上の障害のある利用者という三つの主要なグループに対する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のガイダンスを改善することを目的に開始された。</p></blockquote> <p>WCAG 2.1は、WCAG 2.0に達成基準を追加することで、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%A7%C3%CE%BE%E3%B3%B2">認知障害</a>、ロービジョン、モバイルという3つのグループへの対応の強化をしています。2023年10月に発行された<a href="https://www.w3.org/TR/2023/REC-WCAG22-20231005/">WCAG 2.2</a>も、2.1と同様の流れを汲んでいます。</p> <p>WCAG 2.0が勧告されたのは2008年のことであり、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>のエポックメイキングともいえる初代<a class="keyword" href="https://d.hatena.ne.jp/keyword/iPhone">iPhone</a>が発売されたのは2007年<a href="#f-044294e3" id="fn-044294e3" name="fn-044294e3" title="iPhone - Wikipedia">*6</a>のことでしたから、その意味ではモバイル対応は確かに不十分かもしれません。ただし、<a class="keyword" href="https://d.hatena.ne.jp/keyword/Apple">Apple</a>は<a href="https://developer.apple.com/jp/design/human-interface-guidelines/">ヒューマンインターフェイスガイドライン</a>、<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>は<a href="https://m3.material.io/">Material Design</a>というような、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>も対象としたデザインの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>を出しています。これらに従うことで、技術的にはWCAGに頼らずとも<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を一定程度確保することができます。</p> <p>そして、WCAG 2.0は依然として有効な技術文書であります。WCAG 2.1や2.2に追随することは望ましいですが、WCAG 2.0だから不十分という話の組み立て方は同意しがたいところです。もちろん、最新の技術文書を使うべし、というのには大いに同意するところではあります。</p> <p>それから、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>導入ガイドブックは「最新の規格を踏まえて網羅的にウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>についてまとめられたもの」ではないことを付け加えておきましょう。ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>導入ガイドブック自身が</p> <blockquote><p>なお、本資料は、基礎を理解するためのわかりやすさを重視しています。そのため、記載の厳密な正確性や網羅性を担保していません。</p></blockquote> <p>と述べているとおりであり、またこのガイドブックではWCAG 2.1や2.2に触れているものの、あくまでJIS X 8341-3:2016をベースに話を進めています。</p> <p>最後に、本書の「2 ウェブサイトの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について」は次の段落で締めくくられています。</p> <blockquote><p>今後、我が国においてウェブサイトについて法的拘束力のある基準を策定する場合、現行のJIS X 8341-3では十分に対応できない状況を踏まえ、これをそのまま法的拘束力のある規範に「格上げ」するのではなく、上記のWCAG2.1ないしWCAG2.2に準拠した内容とする必要があることを強調したい。</p></blockquote> <p>いろいろなことはありますが、端的にはJISがWCAG 2.2を取り込むような改正すればいいだけの話ですよね…?ということは、JIS X 8341-3:2016の原案作成団体である、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>基盤委員会に関わっている人間として申し上げておきましょう。</p> <hr style="margin:2em"> <p>このように、大筋では「だいたいあっている」のですが、細かいところに疑念を抱く箇所がいくつか見られました。ちなみに、この章の著者である<a href="https://oogoda-law.jp/staff/oogoda-makoto/">大胡田誠</a>氏は弁護士という肩書きで執筆されています。氏のプロフィールでは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%B4%CC%D5">全盲</a>であることが記載されており、障害当事者という立場でもおられます。また、<a href="https://oogoda-law.jp/column/kyosei/3/">コラム</a>では、対日審査に参加されたことも記されています。</p> <p>対日審査に参加されるようなキーパーソンが、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関して細かいところで正確さに欠ける言及をされていることは残念ではあると同時に、不安を覚えるところではあります。その一方で、文章からウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について現状に不満を抱かれていることは伝わってくるものがあり、その意味ではウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に携わっている筆者の立場として、おおいに理解できるところではあります。</p> <p>しかしながら、とくに技術的な観点で、正確とは言いがたい認識のもとで適切ではないルールづくりが進められてしまうのであれば、不幸な結果をもたらすことにつながりかねません。ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>業界がしっかりと障害当事者団体にアプローチしていく必要があるのではないかと感じているところではあります、といったところで筆を置きたいと思います。</p> <div class="footnote"> <p class="footnote"><a href="#fn-fb92b8d4" id="f-fb92b8d4" name="f-fb92b8d4" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">もちろんJDFの冊子も入手しました</span></p> <p class="footnote"><a href="#fn-e6432792" id="f-e6432792" name="f-e6432792" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">以下、日本語訳は外務省の<a href="https://www.mofa.go.jp/mofaj/gaiko/jinken/index_shogaisha.html">障害者権利条約</a>のページにある総括所見の<a href="https://www.mofa.go.jp/mofaj/files/100448721.pdf">和文仮訳</a>によります</span></p> <p class="footnote"><a href="#fn-4628a98a" id="f-4628a98a" name="f-4628a98a" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://www.soumu.go.jp/main_content/000428057.pdf">要約ともいえる「みんなの公共サイト運用ガイドライン」について</a>では、ポイントとして「速やかにウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>方針を策定・公開し、2017年度末までにJIS X 8341-3の適合レベルAAに準拠する。」としています</span></p> <p class="footnote"><a href="#fn-d5619fe2" id="f-d5619fe2" name="f-d5619fe2" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">ただし、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/sosei_barrierfree_mn_000001.html">バリアフリー整備ガイドライン</a>は標準的な整備内容として、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>を参照しつつ、レベルAAに準拠することを基本としています</span></p> <p class="footnote"><a href="#fn-c42d7f7c" id="f-c42d7f7c" name="f-c42d7f7c" class="footnote-number">*5</a><span class="footnote-delimiter">:</span><span class="footnote-text">「WCAG2.1」や「WCAG2.2」とスペースなしで記述されているのは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%B6%CA%B8%A5%DE%A5%DE">原文ママ</a>です</span></p> <p class="footnote"><a href="#fn-044294e3" id="f-044294e3" name="f-044294e3" class="footnote-number">*6</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://ja.wikipedia.org/wiki/IPhone">iPhone - Wikipedia</a></span></p> </div> momdo メモ:フランスのウェブアクセシビリティ事情をほんのちょっぴりかじってみた。 hatenablog://entry/6801883189078540720 2024-01-28T01:12:08+09:00 2024-01-28T01:12:08+09:00 前振り:EN 301 549 規格を読む(規格を読むとはいっていない)。 ETSI - EN 301 549 V3 the harmonized European Standard for ICT Accessibility ESTI (欧州電気通信標準化機構 - Wikipedia) M/587に従って標準化要求(Mandate) 参考:欧州標準化規則(1025/2012)及びMandate(標準化要求)に係る動向について このページには、European Directive (EU) 2019/882(アクセシビリティ指令、欧州アクセシビリティ法とも呼ばれる)をサポートするV4.1.1を2… <h2 id="前振りEN-301-549">前振り:EN 301 549</h2> <p>規格を読む(規格を読むとはいっていない)。</p> <ul> <li><a href="https://www.etsi.org/human-factors-accessibility/en-301-549-v3-the-harmonized-european-standard-for-ict-accessibility">ETSI - EN 301 549 V3 the harmonized European Standard for ICT Accessibility</a> <ul> <li>ESTI (<a href="https://ja.wikipedia.org/wiki/%E6%AC%A7%E5%B7%9E%E9%9B%BB%E6%B0%97%E9%80%9A%E4%BF%A1%E6%A8%99%E6%BA%96%E5%8C%96%E6%A9%9F%E6%A7%8B">欧州電気通信標準化機構 - Wikipedia</a>)</li> <li><a href="https://ec.europa.eu/growth/tools-databases/enorm/mandate/587_en">M/587</a>に従って標準化要求(Mandate) <ul> <li> 参考:<a href="https://www.jstage.jst.go.jp/article/jaibs/10/1/10_17/_pdf/-char/ja">欧州標準化規則(1025/2012)及びMandate(標準化要求)に係る動向について</a></li> </ul> </li> <li>このページには、<a href="https://eur-lex.europa.eu/legal-content/EN/TXT/?uri=CELEX:32019L0882">European Directive (EU) 2019/882</a>(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>指令、欧州<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>法とも呼ばれる)をサポートするV4.1.1を2025年に発行予定とある <ul> <li>このページからたどれるスケジュールページでは、Publicationは2026年になっている</li> </ul> </li> </ul> </li> <li><a href="https://www.etsi.org/deliver/etsi_en/301500_301599/301549/03.02.01_60/en_301549v030201p.pdf">EN 301 549 V3.2.1 (2021-03)</a>(現在のバージョン) <ul> <li><a href="https://eur-lex.europa.eu/eli/dir/2016/2102/oj">EU Directive 2016/2102</a>をサポートするバージョン <ul> <li>参考:<a href="https://www.dinf.ne.jp/d/1/620.html">[EU]ウェブサイトをアクセシブルにするEU指令が発効 DINF</a></li> <li>「公的機関のウェブサイトおよびモバイルアプリケーションの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について」</li> </ul> </li> <li>このバージョンはHarmonised European Standard (EN) <ul> <li><a href="https://www.etsi.org/standards/supporting-european-regulation">ETSI - Support of regulation &amp; legislation, harmonized standards for ICT, European market</a></li> <li><a href="https://ndlsearch.ndl.go.jp/rnavi/kansai-kan/post_400383">EN規格 〜欧州の統一規格〜 | リサーチ・ナビ | 国立国会図書館</a></li> </ul> </li> <li>参考:<a href="https://leap-con.co.jp/column/harmonised-standards/">欧州はEN規格?整合規格(HARMONISED STANDARDS)とは - 株式会社リープコンサルティング</a> <ul> <li><a href="https://eur-lex.europa.eu/eli/reg/2012/1025/oj">Regulation (EU) 1025/2012</a> <ul> <li>harmonised standardがここで定義されている</li> </ul> </li> </ul> </li> </ul> </li> </ul> <h2 id="EU指令とフランス法"><a class="keyword" href="https://d.hatena.ne.jp/keyword/EU">EU</a>指令と<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D5%A5%E9%A5%F3%A5%B9%CB%A1">フランス法</a></h2> <ul> <li><a href="https://ndlsearch.ndl.go.jp/rnavi/politics/eu_law">EU(欧州連合)-EU法について | リサーチ・ナビ | 国立国会図書館</a> <ul> <li>規則(Regulation)、指令(Directive)、決定(Decision)</li> </ul> </li> </ul> <blockquote><p>指令(Directive)<br/> 加盟国の政府に対して直接的な法的拘束力を及ぼします。指令には政策目標と実施期限が定められ、指令が採択されると、各加盟国は、期限内に政策目標を達成するために国内立法等の措置を取ることが求められます。ただし、どのような措置を取るかは各加盟国に委ねられます。なお、企業や個人には直接適用されません。</p></blockquote> <ul> <li><a href="https://www.tpgi.com/french-law-2005-102-rgaa-and-web-accessibility/">French Law 2005-102, RGAA and Web Accessibility - TPGi</a> <ul> <li><a href="https://fedibird.com/@caztcha/111819862388662910">@caztcha@fedibird.com</a>より</li> </ul> </li> <li><a href="https://www.w3.org/WAI/policies/">Web Accessibility Laws &amp; Policies | Web Accessibility Initiative (WAI) | W3C</a> <ul> <li>Many listings were updated in December 2023. <ul> <li><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A4%E4%A4%EB%A4%E4%A4%EB%BA%BE%B5%BD">やるやる詐欺</a>がついに…</li> </ul> </li> </ul> </li> <li><a href="https://www.legifrance.gouv.fr/loda/article_lc/LEGIARTI000048050213">Law N° 2005-102 Article 47</a> <ul> <li>「障害者の平等な権利と機会、参加および市民権に関する 2005 年 2 月 11 日法律第 2005-102 号 (1)」(<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳)</li> </ul> </li> </ul> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p>第47条<br/> I. 以下の組織のオンライン公衆通信サービスは、この記事で定義されている条件の下、および V で言及されている国務院令によって設定された<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>要件に従って、障害のある人々にアクセス可能です。</p> <p>V. - 社会行動規範および家族に関する条項 L. 146-1 に記載されている評議会の助言を受けて制定された国務院の法令は、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>宣言に関する規則を含む、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する規則を定めます。ウェブサイトおよびアプリケーションの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する公共部門機関の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B2%A4%BD%A3%B5%C4%B2%F1">欧州議会</a>および理事会の指令 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/EU">EU</a>) 2016/2102 (2016 年 10 月 26 日) の第 1 条の 4 および第 2 条のポイント 4 に記載されているものの中の除外内容製品およびサービスに適用される<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>要件、オンライン公衆通信サービスの種類によって異なる場合がある実施条件に関する、2019 年 4 月 17 日の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B2%A4%BD%A3%B5%C4%B2%F1">欧州議会</a>および<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B2%A4%BD%A3%CD%FD%BB%F6%B2%F1">欧州理事会</a>の指令 (<a class="keyword" href="https://d.hatena.ne.jp/keyword/EU">EU</a>) 2019/882オンライン公衆通信サービスの遵守期限は、デジタル・ストリート・ファニチャーの経過措置を除き、3 年を超えることはできません。 この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>は、オンライン公共通信サービスに携わる職員のト<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EC%A1%BC%A5%CB%A5%F3">レーニン</a>グ方法を定義します。</p></blockquote> <ul> <li><a href="https://www.legifrance.gouv.fr/loda/id/JORFTEXT000038811937/">Décret n° 2019-768</a> <ul> <li><a href="https://ja.wikipedia.org/wiki/%E3%83%87%E3%82%AF%E3%83%AC">デクレ - Wikipedia</a>。"<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>と訳されることもある"</li> <li>「障害のある人々に対するオンライン公衆通信サービスの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する 2019 年 7 月 24 日付けの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第 2019-768 号」(<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳)</li> </ul> </li> </ul> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p>第一章 オンライン通信サービスにおける障害者の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>要件(第1条から第4条まで)<br/> 第1条<br/> 2005年2月11日制定法第47条第1項第1項第4項に規定する障害者のオンライン公衆通信サービスは、2016年10月26日の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B2%A4%BD%A3%B5%C4%B2%F1">欧州議会</a>および理事会の2016/2102指令第6条に規定された条件の下で、(以下略)</p></blockquote> <h2 id="フランスの技術的要件-RGAA">フランスの技術的要件 RGAA</h2> <p><a href="https://www.tpgi.com/french-law-2005-102-rgaa-and-web-accessibility/">French Law 2005-102, RGAA and Web Accessibility - TPGi</a>(前出のTPGiの記事)</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p>フランスの法律には、RGAA (Référentiel Général d'Accessibilité pour les Administrations) と呼ばれる<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する技術的要件も含まれています。</p></blockquote> <p><a href="https://fr.wikipedia.org/wiki/R%C3%A9f%C3%A9rentiel_g%C3%A9n%C3%A9ral_d%27am%C3%A9lioration_de_l%27accessibilit%C3%A9">Référentiel général d'amélioration de l'accessibilité — Wikipédia</a></p> <p>MS Edgeによる翻訳:</p> <blockquote><p>General Accessibility Framework for Administrations(現在はGeneral Accessibility Improvement Repository(RGAA))は、フランスにおいて、Web、テレビ、電話の3つのチャネルについて、国家、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%BC%AB%BC%A3">地方自治</a>体、それらに依存する公的機関、および特定の民間サービスのオンラインサービスの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の技術的モダリティを定義することを目的としています1.</p> <p>RGAAは、2005年2月11日の法律第47条で定められた「障害者の権利と機会の平等、参加および市民権」に関する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>義務に由来しています2その施行令は2009年5月16日に官報に掲載されました3.2009 年 10 月に Web チャネルで承認されました4,5,6,7.</p></blockquote> <ul> <li><a href="https://accessibilite.numerique.gouv.fr/">RGAA</a> <ul> <li><a href="https://accessibilite.numerique.gouv.fr/obligations/evaluation-conformite/">Évaluation de la conformité à la norme de référence</a>「参照規格への適合性の評価」(<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳)</li> </ul> </li> </ul> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p><strong>バックグラウンド</strong><br/> 障害者に対するオンライン公衆通信サービスの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する2019年7月24日の上記<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第2019-768号の第5条に従い、前述の第47条の1°から3°に記載されている者は、参照基準に従って、オンライン公衆通信サービスの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を検証するものとします。 この規格の技術的方法を適用することによって。<br/> (中略)<br/> 上記第47条第4項に規定する者は、次の3つの条件を条件として、別の検査方法を使用することができる。<br/> (中略)<br/> <strong>規格への適合率</strong><br/> (中略)<br/> GRFA基準の達成率は、検証済みの基準の数を適用可能な基準の数で割って計算されます。</p></blockquote> <p><a href="https://sante.gouv.fr/ministere/article/declaration-d-accessibilite-du-site-sante-gouv-fr">Déclaration d’accessibilité du site sante.gouv.fr</a> "フランス保健当局の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>声明"</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p><a href="https://sante.gouv.fr/">https://sante.gouv.fr/</a> サイトは、RGAA バージョン 4.1 の一般的な<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>改善<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D5%A5%EC%A1%BC%A5%E0%A5%EF%A1%BC%A5%AF">フレームワーク</a>に部分的に準拠しています。不適合と考えられる逸脱を以下に示します。<br/> (中略)<br/> RGAA基準の87.88%が満たされています。</p></blockquote> <p>WAICの<a href="https://waic.jp/docs/jis2016/compliance-guidelines/202104/">ウェブコンテンツの JIS X 8341-3:2016 対応度表記ガイドライン</a>でいうところの「一部準拠」を胸を張っていえるようにしよ?</p> <hr /> <p>RGAAたのしい? たのしくない?</p> <p><a href="https://accessibilite.numerique.gouv.fr/obligations/champ-application/">Rappel du champ d’application</a>「適用範囲の注意喚起」(<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳)</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p><strong>除外されるコンテンツ</strong><br/> 一部のコンテンツは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>義務を免除されており、法的義務の範囲外です。</p> <p>1. 2018年9月23日以前に発行されたオフィス形式で入手可能なファイル(関係機関が実施するタスクに関連する行政手続きの完了に必要である場合を除きます)。<br/> 2. 2020 年 9 月 23 日より前にリリースされた、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%BF%A5%E9%A5%AF%A5%C6%A5%A3%A5%D6">インタラクティブ</a> <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8">コンポーネント</a>を含む事前に録画されたオーディオおよびビデオ コンテンツ。<br/> 3. ライブオーディオおよびビデオコンテンツ(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%BF%A5%E9%A5%AF%A5%C6%A5%A3%A5%D6">インタラクティブ</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8">コンポーネント</a>を含むものを含む)。<br/> 4. 地図およびオンライン地図サービス(ただし、場所またはルートを提供することを目的とした地図の場合、重要な情報がアクセス可能なデジタル形式で提供されている場合)。<br/> 5. 関係する組織によって資金提供、開発、または管理されていない<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B5%A1%BC%A5%C9%A5%D1%A1%BC%A5%C6%A5%A3">サードパーティ</a>のコンテンツ。<br/> 6. 以下の理由により完全にアクセスできないヘリテージコレクションアイテムの複製<br/> - <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>要件と関係する作品の保存との不適合、または特に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>ストの観点からの複製の信憑性のいずれか。<br/> - 写本やその他の遺産コレクションのテキストを簡単に書き写し、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の義務と互換性のあるコンテンツの形式で複製することを可能にする、自動化された費用対効果の高いソリューションが利用できないこと。<br/> 7. 2019 年 9 月 23 日より前に公開された<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%C8%A5%E9%A5%CD%A5%C3%A5%C8">イントラネット</a>および<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A8%A5%AF%A5%B9%A5%C8%A5%E9%A5%CD%A5%C3%A5%C8">エクストラネット</a>の内容は、これらのサイトが詳細なレビューの対象となるまで。<br/> 8. 2019年9月23日以降に有効な行政手続きの完了に必要でなく、更新または変更もされないウェブサイトおよびモバイルアプリケーションのコンテンツ、特に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A1%BC%A5%AB%A5%A4%A5%D6">アーカイブ</a>。<br/> ただし、2019年7月24日の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第2019-768号が第10条に規定された条件の下で発効するまでは、州、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%BC%AB%BC%A3">地方自治</a>体、およびそれらに依存する公的機関は、2009年5月14日の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第2009-546号に規定された<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>義務の対象となります。</p></blockquote> <p>適合なにそれおいしいの</p> <hr /> <p><a href="https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/">Critères et tests</a>「基準とテスト」(<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳)</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p>1. 画像 1.1\ 各情報画像には、代替テキストがありますか?<br/> 基準1.1の検定と参考文献<br/> 1.1.1 情報を含む各画像 (<img タグ>または WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> role="img" 属性を持つタグ) には、代替テキストがありますか?</p> <p>テスト方法 1.1.1 1. WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性を持つ要素または要素を使用して構造化されたドキュメント内の画像を検索する<img>role="img" ;<br/> 2. 画像ごとに、画像が情報を伝えるかどうかを判断します。<br/> 3. 要素の場合は、画像に次の代替テキストの少なくとも 1 つがあることを確認します。<img><br/> - WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性による関連テキストの通過<a class="keyword" href="https://d.hatena.ne.jp/keyword/aria">aria</a>-labelledby ;<br/> - WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性の内容<a class="keyword" href="https://d.hatena.ne.jp/keyword/aria">aria</a>-label ;<br/> - 属性の内容alt ;<br/> - 属性の内容。title<br/> 4.WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性を持つ要素の場合は、画像に次の代替テキストが少なくとも 1 つあることを確認します。role="img"<br/> - WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性による関連テキストの通過<a class="keyword" href="https://d.hatena.ne.jp/keyword/aria">aria</a>-labelledby ;<br/> W- AI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 属性の内容。<a class="keyword" href="https://d.hatena.ne.jp/keyword/aria">aria</a>-label<br/> 5. 少なくとも 1 つの代替テキストが見つかった場合、テストは検証されます。</p></blockquote> <p>(中略)</p> <blockquote><p>Références<br/> WCAG 2.1<br/> Critère(s) de succès :<br/> 1.1.1 (A)<br/> Technique(s) suffisante(s) et/ou échec(s) (en anglais) :<br/> H36 H37 H53 F65 H24<br/> EN 301 549 V2.1.2 (2018-08) (en anglais) <br/> 9.1.1.1 Non-text Content (A)</p></blockquote> <p>ははーん(フランス語だけどなんとなく読める)</p> <p><a href="https://accessibilite.numerique.gouv.fr/methode/glossaire/#alternative-textuelle-image">Alternative textuelle (image)</a>用語「代替テキスト」</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a>訳:</p> <blockquote><p>次のようなグラフィック要素の支援技術によって<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EC%A5%F3%A5%C0%A5%EA%A5%F3%A5%B0">レンダリング</a>される「アクセシブルな名前」。(以下略)</p></blockquote> <p>そっかぁ…</p> momdo メモ:PDFのタグとWAI-ARIAのマッピングの話 hatenablog://entry/6801883189067218089 2023-12-16T08:55:12+09:00 2023-12-16T08:55:12+09:00 10月末に、w3c/ariaにConsider working with PDFA on a PDF-AAM documentというissueが作成されていたという話(完)。 …だけではアレなので、もうちょい補足しておくと、AAM (Accessibility API Mappings)で一番馴染みがあるだろうHTML-AAMは、HTMLの要素とWAI-ARIAのロールとOSのアクセシビリティAPIのマッピングを定義する仕様だったりするわけですが、それのPDF版を作ろうという話になっていると。 実際にPDF AssociationのBridging PDF and Web Accessibil… <p>10月末に、<a class="keyword" href="https://d.hatena.ne.jp/keyword/w3c">w3c</a>/<a class="keyword" href="https://d.hatena.ne.jp/keyword/aria">aria</a>に<a href="https://github.com/w3c/aria/issues/2070">Consider working with PDFA on a PDF-AAM document</a>というissueが作成されていたという話(完)。</p> <p>…だけではアレなので、もうちょい補足しておくと、AAM (Accessibility <a class="keyword" href="https://d.hatena.ne.jp/keyword/API">API</a> Mappings)で一番馴染みがあるだろう<a href="https://www.w3.org/TR/html-aam-1.0/">HTML-AAM</a>は、HTMLの要素とWAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>のロールとOSの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/API">API</a>の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%C3%A5%D4%A5%F3%A5%B0">マッピング</a>を定義する仕様だったりするわけですが、それのPDF版を作ろうという話になっていると。</p> <p>実際に<a href="https://pdfa.org/">PDF Association</a>の<a href="https://pdfa.org/bridging-pdf-and-web-accessibility/">Bridging PDF and Web Accessibility</a>という記事では、<a class="keyword" href="https://d.hatena.ne.jp/keyword/Excel">Excel</a>ファイルとして<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%C3%A5%D4%A5%F3%A5%B0">マッピング</a>作業の一部を見ることができます。このファイルの中では、PDFのタグ(PDF 1.7だけでなく、PDF 2.0のタグも含まれる)と、類似のHTMLの要素とWAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>のロール、そしてOSの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/API">API</a>が<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%C3%A5%D4%A5%F3%A5%B0">マッピング</a>されています。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>とPDF Associationで<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%F8%BA%EE%B8%A2">著作権</a>の処理をどうするのかという法的な問題をクリアする必要があるけど、そこさえクリアすればたぶん<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>でPDF-AAMが公開されていくことになる…と思われます(PDF Associationで[も?]公開されるかもだけど)。</p> <p>ただまあ、WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>はもともと、HTMLや<a class="keyword" href="https://d.hatena.ne.jp/keyword/SVG">SVG</a>のような<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%AF%A5%A2%A5%C3%A5%D7">マークアップ</a>言語のセマンティックスを拡張するために策定されたものではあり、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%AF%A5%A2%A5%C3%A5%D7">マークアップ</a>言語ではないPDFに<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>の考え方が導入されることになるというのは当初想定していなかったはず。WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a>がここまで影響範囲を拡げることになるとは、10年前<a href="#f-17f2d14a" id="fn-17f2d14a" name="fn-17f2d14a" title="WAI-ARIA 1.0が勧告されたのは2014年3月のこと。もう10年経つのか…">*1</a>には思わなかったよね…。</p> <div class="footnote"> <p class="footnote"><a href="#fn-17f2d14a" id="f-17f2d14a" name="f-17f2d14a" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">WAI-<a class="keyword" href="https://d.hatena.ne.jp/keyword/ARIA">ARIA</a> 1.0が勧告されたのは2014年3月のこと。もう10年経つのか…</span></p> </div> momdo ウェブコンテンツアクセシビリティガイドライン(WCAG)は何が難しいのか、あるいは難しさに立ち向かう方法 hatenablog://entry/6801883189058137195 2023-11-12T13:12:31+09:00 2023-11-13T22:46:50+09:00 LINEヤフーにおけるこれからのアクセシビリティというスライドで「WCAGはハードルが高い」という文言を見かけました。どうしてハードルが高い、言いかえるならば難しいとされるのか、その難しさはどこから来るのかをちょっと深掘りしてみようと思います。 WCAGという言葉について、改めて見ておきましょう。WCAGはもっぱら、Web Content Accessibility Guidelines(ウェブコンテンツアクセシビリティガイドライン)というW3Cの発行する技術文書を指すわけですけども、現時点でよく参照されるのがウェブアクセシビリティ基盤委員会(WAIC)が公開している日本語訳のWCAG 2.1… <p><a href="https://speakerdeck.com/lycorptech_jp/fukuoka-a11yconf-ly-corpration">LINEヤフーにおけるこれからのアクセシビリティ</a>というスライドで「WCAGはハードルが高い」という文言を見かけました。どうしてハードルが高い、言いかえるならば難しいとされるのか、その難しさはどこから来るのかをちょっと深掘りしてみようと思います。</p> <iframe class="speakerdeck-iframe" frameborder="0" src="https://speakerdeck.com/player/6a776101cd934b94afa708c28a09ce49?slide=13" title="LINEヤフーにおけるこれからのアクセシビリティ" allowfullscreen="true" style="border: 0px; background: padding-box padding-box rgba(0, 0, 0, 0.1); margin: 1em; padding: 0px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 40px; width: 80%; height: auto; aspect-ratio: 560 / 315;" data-ratio="1.7777777777777777"></iframe> <p>WCAGという言葉について、改めて見ておきましょう。WCAGはもっぱら、Web Content Accessibility Guidelines(ウェブコンテンツ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>)という<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>の発行する技術文書を指すわけですけども、現時点でよく参照されるのが<a href="https://waic.jp/">ウェブアクセシビリティ基盤委員会(WAIC)</a>が公開している日本語訳の<a href="https://waic.jp/translations/WCAG21/">WCAG 2.1</a>でしょう。ちなみに本家の<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>は、WAICが現時点で公開している<a href="https://www.w3.org/TR/2023/REC-WCAG21-20230921/">WCAG 2.1</a>の改訂版を今年9月に公開し、さらにバージョンの進んだ<a href="https://www.w3.org/TR/2023/REC-WCAG22-20231005/">WCAG 2.2</a>を先月に発行したばかりだったりします。</p> <p>WCAG 2.1だったり2.2だったり、あるいはWCAG 2.0というような2系列のものをひっくるめて、WCAG 2と呼ぶことがあります<a href="#f-d3cc36a7" id="fn-d3cc36a7" name="fn-d3cc36a7" title="W3C WAIのWCAG 2 Overviewがそう言っている">*1</a>。そのWCAG 2とは別に、WCAG 3.0<a href="#f-8bf5fb15" id="fn-8bf5fb15" name="fn-8bf5fb15" title="このWCAGは、W3C Accessibility Guidelinesの略称であり、WCAG 2と別物と言える">*2</a>という<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>を<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>は開発しようとしています<a href="#f-4ac8b274" id="fn-4ac8b274" name="fn-4ac8b274" title="WCAG 3.0の概要はWCAG 3 Introductionに記載されている">*3</a>。</p> <p>このWCAG 3.0の開発にあたって、Silver Task Force<a href="#f-359ddc57" id="fn-359ddc57" name="fn-359ddc57" title="Silverは、WCAG 3.0のコードネーム">*4</a>は、2017年から2018年にわたりWCAG 2にどのような問題があるのかの研究・調査を行いました<a href="#f-67684daf" id="fn-67684daf" name="fn-67684daf" title="Requirements for WCAG 3.0 - 1.3 Silver Task Force Researchからたどれる">*5</a>。その調査結果のサマリーが<a href="https://docs.google.com/presentation/d/1POs7orJ4ALB0bq5_vyo4v8RxDcr-5ctwD1noVgpXuJc/edit#slide=id.gc6f73a04f_0_0">Googleスライド</a>にまとめられています。</p> <p>そのスライドの6枚目では、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の問題点として、</p> <blockquote><p>1. Too Difficult to Read<br/> 2. Difficult to get started<br/> 3. Ambiguity in interpreting the success criteria<br/> 4. Persuading Others to use WCAG</p></blockquote> <p>という4つのポイントを挙げています。最初に挙げられているのが「難しすぎて読めない」というものです。どういうことなのかは続きで記載されています。</p> <blockquote><p>Undefined acronyms, specialized terms, pseudo-legalese, and complex sentence structure decrease user’s comprehension, especially for people in the development cycle who are less technical (project managers, designers, social media marketing leads), regulators, and international users who need translations.</p></blockquote> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google%CB%DD%CC%F5">Google翻訳</a>をあわせて載せておきます:</p> <blockquote><p>未定義の頭字語、専門用語、擬似法律用語、および複雑な文構造は、特に技術的に詳しくない開発サイクルの人々 (プロジェクト マネージャー、デザイナー、ソーシャル メディア <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%B1%A5%C6%A5%A3%A5%F3%A5%B0">マーケティング</a> リーダー)、規制当局、および翻訳を必要とする国際ユーザーにとって、ユーザーの理解力を低下させます。</p></blockquote> <p>WCAG 2の文章自体が難解だ、ということですね。ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関連する前提知識だけでなく、技術文書であることも手伝って、HTMLや<a class="keyword" href="https://d.hatena.ne.jp/keyword/CSS">CSS</a>などの実装寄りの前提知識も、暗黙のうちに要求されるような記述になっています。文章中の文の構造も複雑で、これに引きずられるように、WAICが公開している日本語訳も難しく、ときには正確に日本語に翻訳できていない箇所もあります。</p> <p>2つ目の「始めるのが難しい」を見ていきましょう。</p> <blockquote><p>WCAG is so complex in structure and content with documents, layers and resources that it is overwhelming to people who want to use it as a reference. Among other issues, it also difficult to search for – across multiple documents, and search within. This can be intimidating for people new to the topic who are genuinely interested in and / or tasked with supporting accessibility.</p></blockquote> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google%CB%DD%CC%F5">Google翻訳</a>:</p> <blockquote><p>WCAGは、ドキュメント、レイヤー、リソースを含む構造とコンテンツが非常に複雑なので、リファレンスとして使用したい人にとっては圧倒されます。とりわけ、複数のドキュメントにまたがって検索したり、ドキュメント内を検索したりすることは困難です。これは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に真に興味がある、または<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>をサポートする任務を負っている、このトピックに初めて携わる人々にとっては威圧的なものになる可能性があります。</p></blockquote> <p>WCAG 2は、文章の構成がWCAG 2独特のレイヤーを形成しており、さらにWCAG 2の構成自体が、WCAG 2の関連文書とセットで読まないと読み解けないようになっています。これからウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に取り組んでいく人にとっては、ハードモードを通り越したナイトメアモードな難易度になっているといえます。つまり、<strong>最初にWCAG 2を読んではいけません</strong>。事前準備をしたり、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門家のサポートを得られるようにしたりした上で、WCAG 2を読むのがおすすめです。</p> <p>3つ目の「達成基準の解釈が曖昧である」について、</p> <blockquote><p>There isn’t a clear distinction on what is the “right answer”. Even accessibility experts disagree. As the technology and contexts that can make requests and output web content continues to expand, it becomes less clear over time, which contexts the guidelines apply to. A browser is now only one of many such contexts.</p></blockquote> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google%CB%DD%CC%F5">Google翻訳</a>:</p> <blockquote><p>何が「正しい答え」なのかについては、明確な区別はありません。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門家ですらこれに同意しません。リク<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A8%A5%B9">エス</a>トを行って Web コンテンツを出力できるテク<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%CE%A5%ED">ノロ</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B8%A1%BC">ジー</a>とコンテキストが拡大し続けるにつれて、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>がどのコンテキストに適用されるのかが時間の経過とともに明確になりません。ブラウザは現在、そのような多くのコンテキストの1つにすぎません。</p></blockquote> <p>達成基準<a href="#f-14659820" id="fn-14659820" name="fn-14659820" title="Success Criteriaのこと">*6</a>というのは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を確保するに当たって満たす必要のあるWCAG 2が定めた項目のことです。あるウェブページに対して、ある達成基準を満たせているのかどうかをチェックすると、達成基準自体の曖昧さも手伝って、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門家間ですら解釈がブレるという非常に厄介な事態を引き起こします。ある会社による<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックで達成基準を満たせているとされても、別の会社によるチェックでは達成基準を満たせてないという結果が返ってくる原因はここにあります。</p> <p>最後となる4つ目の「他人を説得してWCAGを利用させる」について、</p> <blockquote><p>Demonstrating that accessibility is not only important to people with disabilities, but that it also benefits the business as a whole can be a challenge. The fact that accessibility is required by law does not necessarily influence decision makers to invest in accessibility. There are many compelling reasons for this, but ultimately, it can be difficult to calculate or predict the business and human impact within any given industry.</p></blockquote> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Google%CB%DD%CC%F5">Google翻訳</a>:</p> <blockquote><p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が障害を持つ人々にとって重要であるだけでなく、ビジネス全体にも利益をもたらすことを実証することは、困難な場合があります。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が法律で義務付けられているという事実は、意思決定者が<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に投資することに必ずしも影響を与えるわけではありません。これには説得力のある理由がたくさんありますが、最終的には、特定の業界内でビジネスと人的影響を計算したり予測したりするのは難しい場合があります。</p></blockquote> <p>WCAG 2に取り組んでいくと、どうよいことが起きるのか、どんな利益をもたらすのか…というのをWCAG 2だけで会社のマネージャーや経営層なりを説得するのは困難です。これはWCAG 2自身が技術文書にしか過ぎないためでもありますが、そうはいっても必要な資料を見つけるのが極めて困難な状況にあるとこの調査は分析しています。</p> <p>このような難しさを解決する1つの方策として、WCAG 3.0の開発が考えられているわけですが、まだ初期の策定段階です。現時点でおぼろげながら形は見えるものの、大枠が整備されているとは言いがたい状況にあります。WCAG 3.0を作成するWorking Groupは2024年にもレビューできる状態のWCAG 3.0を発行するようなことを言っていますが、個人的にはほとんど信用できないと思っています<a href="#f-05e764da" id="fn-05e764da" name="fn-05e764da" title="今月に更新されたAccessibility Guidelines Working Group Charterによる">*7</a>。また、それなりに使えるものが<a class="keyword" href="https://d.hatena.ne.jp/keyword/2020%C7%AF%C2%E5">2020年代</a>に出てくるのかも個人的には怪しいと思っています。なによりも、WCAG 3.0はWCAG 2と別物ですから、WCAG 2と中期的に付き合っていく必要があるわけです。</p> <hr style="margin-top:2em;margin-bottom:2em;"> <p>では、WCAG 2の困難さに立ち向かっていくにはどうすればよいのでしょうか。まず考えられるのは、オンライン上の無料で入手可能なリソースを当たっていくという手です。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>にはWAIというウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門の組織があって、WCAG 2やウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を説明するリソースが多数あります。英語ではあるものの、幸いなことにWCAG 2とは違って、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A1%B3%A3%CB%DD%CC%F5">機械翻訳</a>で読めるような英語で書かれていて、読むのにそこまで苦労しないと思われます。</p> <ul> <li><a href="https://www.w3.org/WAI/standards-guidelines/wcag/docs/">The WCAG 2 Documents</a>では、WCAG 2自身の構造と、WCAG 2を理解する上で欠かせないWCAG 2の関連文書についての概要が説明されています。</li> <li><a href="https://www.w3.org/WAI/fundamentals/accessibility-principles/">Accessibility Principles</a>は、WCAG 2の要求事項(達成基準)がどのようなことを求めているのかの概要を掴むことができるでしょう。 <ul> <li>それより手前のウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>とはそもそも何なのか?について、WCAG 2は説明しません。じっくり最初から取り組むということであれば<a href="https://www.w3.org/WAI/fundamentals/">Accessibility Fundamentals Overview</a>がよいかもしれません。</li> </ul> </li> </ul> <p>英語はいやだという人は、日本語の資料もあります。</p> <ul> <li>筆者と<a href="https://twitter.com/bakera/">@bakera</a>とで作成した<a href="https://docs.google.com/presentation/d/1U74164uPJsHQU12OcAeZPVwfwCzAWJy6hSPZyCxG8kM/edit#slide=id.p">アクセシビリティ・ガイドラインの歩き方(初心者編)</a>というスライドを公開しています。少し古いですが、WCAG 2をどう読んでいけばよいのかのヒントを記載していますので、未見の方は一読していただければ幸いです。</li> <li>デジタル庁の<a href="https://www.digital.go.jp/resources/introduction-to-web-accessibility-guidebook">ウェブアクセシビリティ導入ガイドブック</a>を当たるのもよいでしょう。ただし、WCAG 2という観点ではわかりやすさが優先されていることもあり、やや正確性に欠けるところも見受けられます。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の入門としてよい資料ではありますが、官公庁が出しているから全面的に信用できるというわけではないことに注意してください。</li> </ul> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関連する書籍を当たってみるという手もあるでしょう。いくつか挙げてみたいと思います。</p> <ul> <li><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ</a>。古典的ですがウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>界隈で最初の1冊としてよく取り上げられます。</li> <li><a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)</a>。2023年に発売された実践的な書籍。中級者向けの書籍であり、実装についての記載はもちろんのこと、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DC%A5%C8%A5%E0%A5%A2%A5%C3%A5%D7">ボトムアップ</a>的に組織にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を定着させた著者陣による方法論や、マネージャーや経営層を説得するためのヒントもあります。</li> <li><a href="https://www.amazon.co.jp/dp/483998087X?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">見えにくい、読みにくい「困った!」を解決するデザイン (Compass Booksシリーズ)</a>。必ずしもWCAGに即しているわけではないですが、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を考慮したビジュアルデザインのとっかかりとして読んでみるのもよいでしょう。</li> <li><a href="https://www.amazon.co.jp/dp/4862465277?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">HTML解体新書-仕様から紐解く本格入門</a>。拙著(<a href="https://twitter.com/bakera/">@bakera</a>との共著)ですが、HTML仕様とWCAGがどう結びつくのかを注記で折に触れて言及しています。仕様の読み方についても触れており、これもWCAGを読むための手がかりになるかのもしれません。未見の方は手に取っていただけると幸いです。</li> <li><a href="https://www.amazon.co.jp/dp/B0BL6R37BT?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">武器になるHTML</a>。これからHTMLを身につけるというのによい1冊。HTMLと<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の結びつきを意識した作りになっています。</li> </ul> <p>必要な知識を蓄えて、心の準備ができたら、<a href="https://waic.jp/translations/WCAG21/Understanding/">WCAG 2.1 解説書</a>を読み進めていきましょう。ただし、(日本語訳の宿命ですが)日本語訳は原文の<a href="https://www.w3.org/WAI/WCAG21/Understanding/">WCAG 2.1 Understanding Docs</a>に比べて古い日付のものをベースに翻訳しています。必要に応じて<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A1%B3%A3%CB%DD%CC%F5">機械翻訳</a>に頼りながら原文を読んでいくとよいでしょう。また、日本語訳は翻訳の誤りがあるかもしれません。翻訳の誤りや翻訳で疑問に思う箇所を見つけた場合は、<a href="https://docs.google.com/forms/d/e/1FAIpQLSdIpvogLx8kGIMewhQ6MzhG2pOCQZ50iIBViGg8pUrRJuslKg/viewform">Googleフォーム</a>でコメントをしてみてください。</p> <p>とまあ、今日のところはこんな感じでおしまいです。</p> <p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/516DF8MI-vL._SL500_.jpg" class="hatena-asin-detail-image" alt="デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ" title="デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">デザイニングWebアクセシビリティ: アクセシブルな設計やコンテンツ制作のアプローチ</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%C2%C0%C5%C4%CE%C9%C5%B5" class="keyword">太田良典</a>,<a href="https://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%CE%CF%CC%E9" class="keyword">伊原力也</a></li><li>ボーンデジタル</li></ul><a href="https://www.amazon.co.jp/dp/B01N3CGZ7W?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/411WuOGG+eL._SL500_.jpg" class="hatena-asin-detail-image" alt="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)" title="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus)</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%20%CE%CF%CC%E9" class="keyword">伊原 力也</a>,<a href="https://d.hatena.ne.jp/keyword/%BE%AE%CE%D3%20%C2%E7%CA%E5" class="keyword">小林 大輔</a>,<a href="https://d.hatena.ne.jp/keyword/%CB%F1%C5%C4%20%C1%F0%B0%EC" class="keyword">桝田 草一</a>,<a href="https://d.hatena.ne.jp/keyword/%BB%B3%CB%DC%20%CE%E2" class="keyword">山本 伶</a></li><li><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%BB%BD%D1%C9%BE%CF%C0%BC%D2">技術評論社</a></li></ul><a href="https://www.amazon.co.jp/dp/4297133660?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/483998087X?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/51bh7xoV4AL._SL500_.jpg" class="hatena-asin-detail-image" alt="見えにくい、読みにくい「困った!」を解決するデザイン (Compass Booksシリーズ)" title="見えにくい、読みにくい「困った!」を解決するデザイン (Compass Booksシリーズ)"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/483998087X?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">見えにくい、読みにくい「困った!」を解決するデザイン (Compass Booksシリーズ)</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%B4%D6%C5%E8%20%BA%BB%C3%CE" class="keyword">間嶋 沙知</a></li><li><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%A4%A5%CA%A5%D3%BD%D0%C8%C7">マイナビ出版</a></li></ul><a href="https://www.amazon.co.jp/dp/483998087X?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/4862465277?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/51T7l4SfGYL._SL500_.jpg" class="hatena-asin-detail-image" alt="HTML解体新書-仕様から紐解く本格入門" title="HTML解体新書-仕様から紐解く本格入門"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/4862465277?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">HTML解体新書-仕様から紐解く本格入門</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%C2%C0%C5%C4%20%CE%C9%C5%B5" class="keyword">太田 良典</a>,<a href="https://d.hatena.ne.jp/keyword/%C3%E6%C2%BC%20%C4%BE%BC%F9" class="keyword">中村 直樹</a></li><li>ボーンデジタル</li></ul><a href="https://www.amazon.co.jp/dp/4862465277?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div> <div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0BL6R37BT?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/41xPjmt7RQL._SL500_.jpg" class="hatena-asin-detail-image" alt="武器になるHTML" title="武器になるHTML"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0BL6R37BT?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">武器になるHTML</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%BC%C6%C5%C4%20%B9%A8%C0%E7" class="keyword">柴田 宏仙</a></li><li><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%BB%BD%D1%C9%BE%CF%C0%BC%D2">技術評論社</a></li></ul><a href="https://www.amazon.co.jp/dp/B0BL6R37BT?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div></p> <div class="footnote"> <p class="footnote"><a href="#fn-d3cc36a7" id="f-d3cc36a7" name="f-d3cc36a7" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> WAIの<a href="https://www.w3.org/WAI/standards-guidelines/wcag/">WCAG 2 Overview</a>がそう言っている</span></p> <p class="footnote"><a href="#fn-8bf5fb15" id="f-8bf5fb15" name="f-8bf5fb15" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">このWCAGは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> Accessibility Guidelinesの略称であり、WCAG 2と別物と言える</span></p> <p class="footnote"><a href="#fn-4ac8b274" id="f-4ac8b274" name="f-4ac8b274" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">WCAG 3.0の概要は<a href="https://www.w3.org/WAI/standards-guidelines/wcag/wcag3-intro/">WCAG 3 Introduction</a>に記載されている</span></p> <p class="footnote"><a href="#fn-359ddc57" id="f-359ddc57" name="f-359ddc57" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">Silverは、WCAG 3.0のコードネーム</span></p> <p class="footnote"><a href="#fn-67684daf" id="f-67684daf" name="f-67684daf" class="footnote-number">*5</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://www.w3.org/TR/wcag-3.0-requirements/#silver-task-force-research">Requirements for WCAG 3.0 - 1.3 Silver Task Force Research</a>からたどれる</span></p> <p class="footnote"><a href="#fn-14659820" id="f-14659820" name="f-14659820" class="footnote-number">*6</a><span class="footnote-delimiter">:</span><span class="footnote-text">Success Criteriaのこと</span></p> <p class="footnote"><a href="#fn-05e764da" id="f-05e764da" name="f-05e764da" class="footnote-number">*7</a><span class="footnote-delimiter">:</span><span class="footnote-text">今月に更新された<a href="https://www.w3.org/2023/11/ag-charter">Accessibility Guidelines Working Group Charter</a>による</span></p> </div> momdo パズル認証で切符が買えない問題から考える交通バリアフリーとウェブアクセシビリティ hatenablog://entry/6801883189054144351 2023-10-28T20:17:30+09:00 2023-10-28T20:18:06+09:00 千葉日報が2023年10月16日付けで次の記事を掲載していました。27日にはヤフーニュースでも配信されました。ちなみにヤフーニュースでは全文を読むことができます。 パズル認証が障壁に 視覚障害で特急切符買えず 東武鉄道「不正利用防止への理解を」 識者「バリアフリー対応は責務」【ちば特 千葉日報特報部】 | 千葉日報オンライン パズル認証が障壁に 視覚障害で特急切符買えず 東武鉄道「不正利用防止への理解を」 識者「バリアフリー対応は責務」【ちば特 千葉日報特報部】(千葉日報オンライン) - Yahoo!ニュース 記事の冒頭にはこうあります。 「ネットで東武鉄道の特急券を買いたくても、視覚障害のた… <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%E9%CD%D5%C6%FC%CA%F3">千葉日報</a>が2023年10月16日付けで次の記事を掲載していました。27日にはヤフーニュースでも配信されました。ちなみにヤフーニュースでは全文を読むことができます。</p> <ul> <li><a href="https://www.chibanippo.co.jp/news/local/1118140">パズル認証が障壁に 視覚障害で特急切符買えず 東武鉄道「不正利用防止への理解を」 識者「バリアフリー対応は責務」【ちば特 千葉日報特報部】 | 千葉日報オンライン</a></li> <li><a href="https://news.yahoo.co.jp/articles/ea320c4b59701a3340511c72dd60264956026f44">パズル認証が障壁に 視覚障害で特急切符買えず 東武鉄道「不正利用防止への理解を」 識者「バリアフリー対応は責務」【ちば特 千葉日報特報部】(千葉日報オンライン) - Yahoo!ニュース</a></li> </ul> <p>記事の冒頭にはこうあります。</p> <blockquote><p>「ネットで<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%EC%C9%F0%C5%B4%C6%BB">東武鉄道</a>の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%C3%B5%DE%B7%F4">特急券</a>を買いたくても、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>のためパズル認証の操作ができず、サービスを利用できない」。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%A5%B6%B6%BB%D4">船橋市</a>に住む読者の男性からこんな困惑の声が寄せられた。取材を進めると、千葉県内に特急の路線を持つ鉄道のうち、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%EC%C9%F0%C5%B4%C6%BB">東武鉄道</a>のみが<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%C1%A5%B1%A5%C3%A5%C8%A5%EC%A5%B9">チケットレス</a><a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%C3%B5%DE%B7%F4">特急券</a>の購入時にパズル認証を必須とするシステムを採用し続けていた。同社は「不正利用防止のためには必要」と理解を求める。一方、デジタル化によって生じた新たな障壁について、識者は「公共<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%F2%C4%CC%B5%A1%B4%D8">交通機関</a>は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>への感度を高め、対応する責務がある」と指摘した。</p></blockquote> <h2 id="パズル認証について">パズル認証について</h2> <p>まずもって、パズル認証とは何なのかを改めて確認しておきましょう。新聞記事でも取り上げられていますが、パズルのピースをマウスでドラッグ&ドロップ、あるいは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>であれば長押しして、パズルを完成させるというものです。記事に記載されている画像をそのまま以下に転載しています。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20231028/20231028194524.jpg" alt="&#x5343;&#x8449;&#x65E5;&#x5831;&#x306E;&#x8A18;&#x4E8B;&#x3067;&#x793A;&#x3055;&#x308C;&#x3066;&#x3044;&#x308B;&#x30D1;&#x30BA;&#x30EB;&#x8A8D;&#x8A3C;" width="663" height="699" loading="lazy" title="" class="hatena-fotolife" style="width:320px" itemprop="image"></span></p> <p>このパズル認証は、一種の<a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a>(キャプチャ)です。<a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a>というのは簡単に言えば、ユーザーがプログラムではなく、人間であること証明させる仕組みになります<a href="#f-afb89e8d" name="fn-afb89e8d" title="もう少ししっかりとした説明はCAPTCHA(キャプチャ認証)とは - IT用語辞典 e-Wordsあたりを参照してください">*1</a>。</p> <p>パズル認証については、目で見て操作する機能であるために、視覚に障害のあるユーザーが、どうがんばっても操作できないという根本的な問題があります。これは、<a href="https://tsunaweb.book.mynavi.jp/tsunaweb/tsuna/detail/id=5692">Webアクセシビリティに向き合う理由 事例詳細|つなweB</a>という記事でも説明されています。</p> <blockquote><p>画面を見られない<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者は、「スクリーンリーダー」と呼ばれる、画面内の表示内容を音声で読み上げるソフトウェア(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AA%A1%BC%A5%D7%A5%F3%A5%BD%A1%BC%A5%B9">オープンソース</a>の「NVDA」や<a class="keyword" href="https://d.hatena.ne.jp/keyword/iOS">iOS</a>に標準で組み込まれている「VoiceOver」など)を用います。そうしたユーザーが困るのが音声読み上げができない状態で、最たる例がパズル認証や画像認証です(02・例1)。クレジットカードなど決済が絡むWebサイトでよく見かけるこれらの認証は、セキュリティ上の観点からは必要であっても、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者や、キーボード操作しかできないユーザーだと、認証のための操作ができません。もし代替となる手段の提供もないと、認証後に続く場面には進めないユーザーが出てくることになります。</p></blockquote> <p>筆者はセキュリティの専門家ではないので詳しくはないのですが、パズル認証に関しては、<a href="https://news.gehirn.jp/security/513/">IVSで優勝したというパズル型CAPTCHA Capyを突破してみた | Gehirn News</a>というブログ記事<a href="#f-954e4cc0" name="fn-954e4cc0" title="Gehirn(ゲヒルン)https://www.gehirn.co.jp/については、今では特務機関NERV防災で有名ですが、情報セキュリティが本業だという認識です">*2</a>が2013年12月には既にあり、プログラムで突破できることが示されていました。</p> <p>また、<a href="https://cir.nii.ac.jp/crid/1050294562443551488?lang=en">CNNを用いたパズルCAPTCHA攻撃のリスク</a>という論文が2022年に出されています。<a href="#f-08d9791a" name="fn-08d9791a" title="英文タイトルはIs Puzzle-Based CAPTCHA Secure Against Attacks Based on CNN?ですが、これはIEEEに採択されています https://ieeexplore.ieee.org/document/10049032/metrics">*3</a>論文のAbstract(要約)をそのまま記載します。</p> <blockquote><p>近年,Web サイトに対する <a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> による<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C9%D4%C0%B5%A5%A2%A5%AF%A5%BB%A5%B9">不正アクセス</a>が増加傾向にある.<a class="keyword" href="https://d.hatena.ne.jp/keyword/Bot">Bot</a> による自動アクセスを防ぐ手段として,<a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> と人間を識別する <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> が広く用いられている.しかし,<a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> の高度化により,従来の難度の <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> を突破する <a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> が現れている.その一方で高度な <a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> のアクセスを防ぐような <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> は人間にとって難しいものとなり,ユーザの利便性と <a class="keyword" href="https://d.hatena.ne.jp/keyword/bot">bot</a> に対する認証強度が<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%C8%A5%EC%A1%BC%A5%C9%A5%AA%A5%D5">トレードオフ</a>となってしまうことが問題となっている.本論文では,Capy パズル <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> を対象に,機械には難しく人間には簡単な<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%B9%A5%BF%A5%F3%A5%B9">インスタンス</a>とはどのようなものか考察する.その第一段階として Capy パズル <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> と同等の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%B9%A5%BF%A5%F3%A5%B9">インスタンス</a>を解く<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A1%B3%A3%B3%D8%BD%AC">機械学習</a>のモデルを生成した.このモデルは背景画像にピースが埋め込まれた<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%B9%A5%BF%A5%F3%A5%B9">インスタンス</a>画像からピースの位置を判別する.判別のモデルには CNN(Convolutional Neural Network)を用い,従来の手法よりも高い 99.81% という精度で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%B9%A5%BF%A5%F3%A5%B9">インスタンス</a>画像からピースの位置を特定した.これにより<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A1%B3%A3%B3%D8%BD%AC">機械学習</a>によってCapyパズル <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> は容易に突破されうるリスクを示した.</p></blockquote> <p>結局のところ、(どこまで厳しい条件なのかはさておき)条件さえ整えてしまえば、プログラムがパズル認証を突破できてしまうわけです。そしてその一方で、視覚に障害のあるプログラムではない人間のユーザーが認証できないという問題があります。これは<a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a>の本来の目的を果たしているといえるのでしょうか。極端な解釈をすれば、パズル認証はセキュリティとして意味をなさず、視覚に障害のあるユーザーに対する単なる障壁にしかならないということになります。</p> <p>そういった状況の中で、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%EC%C9%F0%C5%B4%C6%BB">東武鉄道</a>の言い分を見てみますと、</p> <blockquote><p>同社は取材に文書で回答。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者から申し出があった場合は「個別に対応している」とした上で、<br/> (中略)<br/> パズル認証不要の期間については「セキュリ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%C6%A5%A3%A1%BC">ティー</a>と利便性のバランスを鑑みて(中略)」との答え。他の認証方法も考慮した上での判断という。<br/> また、障害者へのサービスは多方面から求められているとし、当事者の視点に立った企業努力をしていると訴えた。</p></blockquote> <p>ここまでで見てきたように、技術的にはパズル認証自体に問題があるのですから、そもそも論としてパズル認証をやめよという話になってくるのですが、残念ながら<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%E9%CD%D5%C6%FC%CA%F3">千葉日報</a>の記事ではそこまで踏み込めていません。もっとも、識者として交通ジャーナリストのコメントは掲載されていますが、交通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>に通じていても情報分野の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>やセキュリティに詳しいわけではないでしょうから、ある種の必然なのかもしれません。</p> <p>ちなみにウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>については、前出の記事では以下のように説明されています。</p> <blockquote><p>ここで改めて「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」について説明します。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>とは、アクセスのしやすさという意味の言葉で、Webに限らずさまざまな製品やサービス、建築物や機械などあらゆるものを対象とします。対象をWebコンテンツにした場合に、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/Web%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">Webアクセシビリティ</a>」という言葉で言い表すことになります。</p></blockquote> <p>ものすごく大雑把には、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>と<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は同じものだと思ってもらえればとりあえずはよいと思います。</p> <h2 id="国の動きなど">国の動きなど</h2> <p>ここで話を変えて、国の動きについて見てみましょう。識者のコメントとしては、</p> <blockquote><p>「公共<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%F2%C4%CC%B5%A1%B4%D8">交通機関</a>は、誰でも、どこへでも移動できるのが大前提」と枝久保氏。国基準の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>以外にも細かい障壁は数多く存在するといい「より感度を高め、対応する責務がある」と注文を付けた。</p></blockquote> <p>とあります。ここで、国基準の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>というものはどういったものでしょうか?</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%C5%DA%B8%F2%C4%CC%BE%CA">国土交通省</a>のページには、<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/sosei_barrierfree_mn_000001.html">公共交通機関の旅客施設・車両等・役務の提供に関する移動等円滑化整備ガイドライン(バリアフリー整備ガイドライン)</a>というものがあります。この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>整備<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>では、「第5部 情報提供の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>確保に向けた<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の項目があります。その中では、</p> <blockquote><p>障害者等が円滑にウェブサイト等を利用し必要な情報を得られるようにするために、JIS X 8341-3:2016 に基づき、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を確保する。</p></blockquote> <p>というものがあり、考え方としては、</p> <blockquote><p>障害者等にとって、円滑に旅客施設を利用するためにエレベーターやトイレ等の設備の設置状況や設置位置、受けられるサービスの内容等について、ウェブサイト等により事前に情報を収集することが重要となる。</p></blockquote> <p>とされています。この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>整備<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>の書きぶりからは、あくまでウェブサイトで情報収集ができるようにすることを念頭に置いているのであって、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%E9%CD%D5%C6%FC%CA%F3">千葉日報</a>の記事にあるような、切符が買えない状況を想定しているとは言いがたいのではないでしょうか。言いかえると、公共<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%F2%C4%CC%B5%A1%B4%D8">交通機関</a>の各事業者にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の問題が存在していることをしっかりと認識してもらうのは現状では難しいのではないか、と個人的には思うところです。</p> <p>ところで、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%C5%DA%B8%F2%C4%CC%BE%CA">国土交通省</a>には、2023年9月に開催された<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/sosei_barrierfree_tk_000337.html">第10回「移動等円滑化評価会議」の配付資料</a>の「参考資料2 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%C5%DA%B8%F2%C4%CC%BE%CA">国土交通省</a>等における最近の主な取組」では、</p> <blockquote><p>③ウェブによる障害者用乗車券等の予約決済の実現<br/> ○ 令和3年度<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CA%E4%C0%B5%CD%BD%BB%BB">補正予算</a>以降、支援措置をメニュー化。<br/> ○ 予算措置も踏まえ、事業者・事業者団体との間で導入促進に向けた調整を引き続き実施。</p></blockquote> <p>とあります。これは2021年6月に出された<a href="https://www.mlit.go.jp/report/press/sogo09_hh_000298.html">大臣指示</a>に由来するものと認識していますが、大臣指示から2年が経過しているにもかかわらず、何らかの進展があるようには参考資料からは読み取れません。もっとも議事録が出てきていないので、どのような話がなされたのか、現時点では不明ですが。</p> <p>それとは別に、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B2%F1%BF%DE%BD%F1%B4%DB">国会図書館</a>の<a href="https://www.ndl.go.jp/jp/diet/publication/issue/index.html">調査と情報-Issue Brief-</a>というページに、No.1180(2022年3月)として<a href="https://dl.ndl.go.jp/view/download/digidepo_12153724_po_1180.pdf?contentNo=1">公共交通機関のバリアフリー対策</a>というものを見つけました。</p> <blockquote><p>3 その他の課題(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CD%AD%BC%B1%BC%D4">有識者</a>の意見)<br/> その他、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法をめぐっては「都市と地方の格差」、「情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」、「心の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」について<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CD%AD%BC%B1%BC%D4">有識者</a>から課題が指摘されている。<br/> (中略)<br/> 「情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」について、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B6%E1%B5%A6%C2%E7%B3%D8">近畿大学</a>名誉教授の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%B0%C0%B1">三星</a>昭宏氏は、「視覚・<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C4%B0%B3%D0%BE%E3%B3%B2">聴覚障害</a>者向けの有効な情報提供はまだ部分的で、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者が一人で初めての所へ行くことは困難である」と指摘する。また、先述の秋山哲男氏は、「交通において MaaS、CASEなど情報化が急速に進む中での障害者を取り残さない対策が不可欠である」と指摘している。</p></blockquote> <p>PDFで15ページの資料の中に、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>への言及が実質1段落しかないわけですが、言及があることに胸をなで下ろすべきでしょうか、それとも1段落しか言及されていないことを嘆くべきでしょうか。秋山氏の指摘は、雑誌<a href="https://www.jstage.jst.go.jp/browse/jais/-char/ja">福祉のまちづくり研究</a>の特集記事<a href="https://www.jstage.jst.go.jp/article/jais/23/1/23_26/_article/-char/ja/">福祉のまちづくりの総括</a>でなされているものですが、今後の課題という位置付けとなっています。交通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>の専門家からは、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を含めた情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>というのはどうやらまだまだ遠い存在であるようです<a href="#f-8d5aa885" name="fn-8d5aa885" title="ちなみに三星氏の元文書はウェブでは読めませんでしたhttp://www.tessinkyo.jp/syuppan2.html">*4</a>。</p> <p>さて、障害者差別解消法という法律の話がウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の業界ではよく出てきます。この法律がどういったものなのかは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a>の<a href="https://www8.cao.go.jp/shougai/suishin/sabekai_leaflet-r05.html">リーフレット「令和6年4月1日から合理的配慮の提供が義務化されます!」</a>に譲りますが、この法律は来年4月に改正した法律が施行されます。法改正にあわせて、どのようにすればよいのかという<a href="https://www8.cao.go.jp/shougai/suishin/sabekai.html#houshin">基本方針</a>も改定されています。細かい話は省きますが、その基本方針の中では次のような例示が追加されています。</p> <blockquote><p>オンラインでの申込手続が必要な場合に、手続を行うためのウェブサイトが障害者にとって利用しづらいものとなっていることから、手続に際しての支援を求める申出があった場合に、求めに応じて電話や電子メールでの対応を行う(合理的配慮の提供)とともに、以後、障害者がオンライン申込みの際に不便を感じることのないよう、ウェブサイトの改良を行う(環境の整備)。</p></blockquote> <p>この例示は、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%E9%CD%D5%C6%FC%CA%F3">千葉日報</a>が取り上げている「パズル認証切符が買えない」という問題そのものなわけですが、現実には<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%EC%C9%F0%C5%B4%C6%BB">東武鉄道</a>のサイトの改修が行われていないわけです。もちろんこのブログ記事の執筆時点では、民間企業の合理的配慮というものが努力義務であって、義務ではないという話もあります(来年4月から義務化)。</p> <p>しかし、合理的配慮というものが義務化されることで、本当に環境の整備(これは努力義務のまま)が促進されるのでしょうか? 具体例こそ基本方針に明記されるようになったわけですが、今回のような話を見る限り、明るい未来が待っているわけではないのかもしれません。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>については<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/index.html">バリアフリー法</a>という法律が存在していて、例えば鉄道の駅にはエレベーターを設置するというような決まりがあります。しかしその一方で、情報分野でウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>というものに技術的に直接言及するような法律は存在していません。</p> <p>障害者差別解消法で少し込み入った理屈でウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を進めようというのではなく、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法の情報分野版となる、情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>法<a href="#f-460a2923" name="fn-460a2923" title="情報アクセシビリティ法については、石川先生が言及されています。例えば https://www.normanet.ne.jp/~jdc/tech/semi/ishikawa/index.html">*5</a>でもって、ものごとを進めていく必要があるのではないかと個人的に思っています。あくまで例えばになりますが、「公共<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%F2%C4%CC%B5%A1%B4%D8">交通機関</a>は、音声読み上げで切符を買うことができるウェブサイトを提供する」というような決まりがあればよいのかなと思うのですが、みなさんはどう思われるでしょうか。</p> <h2 id="技術的な話">技術的な話</h2> <p>もっとも、現状を嘆くだけでは何も始まりませんから、ここでほんのちょっぴり希望が持てそうな技術的な話をしましょう。ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について明るい各位はご存じのとおり、<a href="https://www.w3.org/TR/2023/REC-WCAG22-20231005/">WCAG 2.2</a>が今月に勧告されています<a href="#f-bce114a0" name="fn-bce114a0" title="WCAG 2.2の2つ前のバージョンであるWCAG 2.0がJIS X 8341-3:2016と技術的に同等です">*6</a>。WCAG 2.1から新しい達成基準(Success Criterion)が追加されているわけですが、その中で<a href="https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication-minimum.html">3.3.8 Accessible Authentication (Minimum) (AA)</a><a href="#f-5ea8b571" name="fn-5ea8b571" title="仮訳として「アクセシブルな認証」などとされています。参考:https://accessible-usable.net/2023/10/entry_231006.html">*7</a>という達成基準がパズル認証を考えるきっかけになるかもしれません。具体的には、</p> <blockquote><p>A cognitive function test (such as remembering a password or solving a puzzle) is not required for any step in an authentication process [...]</p></blockquote> <p>というものです。ここでいうpuzzleがパズル認証のパズルを指すのかについての確信は持てませんが、<a href="https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication-minimum.html">この達成基準のUnderstanding WCAG 2.2</a>では<a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a>について触れられており<a href="#f-a4dc640e" name="fn-a4dc640e" title="W3C NoteのInaccessibility of CAPTCHAへのリンクもあります">*8</a>、いずれにせよサイトのログインに関係する達成基準が新たに設けられていることは確かです。</p> <p>Understanding WCAG 2.2でも少し言及がされていますが、最近では、WebAuthnのようなパスワード不要の認証技術も登場してきています<a href="#f-0406446e" name="fn-0406446e" title="Cloudflareの人類はCAPTCHAで毎日約500年をムダにしている。この狂気から脱却する時が来たとかが参考になるかもしれません">*9</a>。WebAuthnが絶対的な解になるのかどうかはわかりませんが、セキュリティと<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>(あるいは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>)を両立する1つの方法であることは確かだと思います。WCAG 2.2がパズル認証だけでなく、ウェブサイトのログイン全般についての<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を見直すきっかけになる…のかもしれないという話でした。</p> <h2 id="まとめ">まとめ</h2> <p>いろいろと書きましたが、言いたいことのポイントはだいたい以下の感じです。</p> <ul> <li>パズル認証自体に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>上の根本的な問題が存在している <ul> <li>技術的には別の認証方法に変更できる余地がある</li> </ul> </li> <li>ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>という考え方が世の中に広まっていない <ul> <li>マスコミや交通事業者、交通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>の専門家に、ウェブを含む情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について十分認知してもらえてないように思う</li> <li>国の取り組みを加速してもらいたい</li> </ul> </li> <li>我が国の法律として、直接ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に切り込めるものがなく、あったほうがよいと思っている</li> </ul> <p>ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の業界にいる人間としては、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>という考え方をもっと広めていく必要があるし、広める努力もしないといけないよね、と改めて思うところではあります。</p> <div class="footnote"> <p class="footnote"><a href="#fn-afb89e8d" name="f-afb89e8d" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">もう少ししっかりとした説明は<a href="https://e-words.jp/w/CAPTCHA.html">CAPTCHA(キャプチャ認証)とは - IT用語辞典 e-Words</a>あたりを参照してください</span></p> <p class="footnote"><a href="#fn-954e4cc0" name="f-954e4cc0" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">Gehirn(ゲ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D2%A5%EB">ヒル</a>ン)<a href="https://www.gehirn.co.jp/">https://www.gehirn.co.jp/</a>については、今では<a href="https://nerv.app">特務機関NERV防災</a>で有名ですが、情報セキュリティが本業だという認識です</span></p> <p class="footnote"><a href="#fn-08d9791a" name="f-08d9791a" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">英文タイトルはIs Puzzle-Based <a class="keyword" href="https://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> Secure Against Attacks Based on CNN?ですが、これは<a class="keyword" href="https://d.hatena.ne.jp/keyword/IEEE">IEEE</a>に採択されています <a href="https://ieeexplore.ieee.org/document/10049032/metrics">https://ieeexplore.ieee.org/document/10049032/metrics</a></span></p> <p class="footnote"><a href="#fn-8d5aa885" name="f-8d5aa885" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">ちなみに<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%B0%C0%B1">三星</a>氏の元文書はウェブでは読めませんでした<a href="http://www.tessinkyo.jp/syuppan2.html">http://www.tessinkyo.jp/syuppan2.html</a></span></p> <p class="footnote"><a href="#fn-460a2923" name="f-460a2923" class="footnote-number">*5</a><span class="footnote-delimiter">:</span><span class="footnote-text">情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>法については、石川先生が言及されています。例えば <a href="https://www.normanet.ne.jp/~jdc/tech/semi/ishikawa/index.html">https://www.normanet.ne.jp/~jdc/tech/semi/ishikawa/index.html</a></span></p> <p class="footnote"><a href="#fn-bce114a0" name="f-bce114a0" class="footnote-number">*6</a><span class="footnote-delimiter">:</span><span class="footnote-text">WCAG 2.2の2つ前のバージョンであるWCAG 2.0がJIS X 8341-3:2016と技術的に同等です</span></p> <p class="footnote"><a href="#fn-5ea8b571" name="f-5ea8b571" class="footnote-number">*7</a><span class="footnote-delimiter">:</span><span class="footnote-text">仮訳として「アクセシブルな認証」などとされています。参考:<a href="https://accessible-usable.net/2023/10/entry_231006.html">https://accessible-usable.net/2023/10/entry_231006.html</a></span></p> <p class="footnote"><a href="#fn-a4dc640e" name="f-a4dc640e" class="footnote-number">*8</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a> Noteの<a href="https://www.w3.org/TR/turingtest/">Inaccessibility of CAPTCHA</a>へのリンクもあります</span></p> <p class="footnote"><a href="#fn-0406446e" name="f-0406446e" class="footnote-number">*9</a><span class="footnote-delimiter">:</span><span class="footnote-text">Cloudflareの<a href="https://blog.cloudflare.com/ja-jp/introducing-cryptographic-attestation-of-personhood-ja-jp/">人類はCAPTCHAで毎日約500年をムダにしている。この狂気から脱却する時が来た</a>とかが参考になるかもしれません</span></p> </div> momdo ウェブアクセシビリティは合理的配慮ですか?(追記あり) hatenablog://entry/6801883189051585527 2023-10-18T23:08:15+09:00 2023-10-26T15:06:02+09:00 一般にウェブアクセシビリティは、合理的配慮の事前的改善措置となる、環境の整備に分類されます。総務省のみんなの公共サイト運用ガイドライン(2016年版)によれば、 障害者差別解消法(平成 28 年 4 月 1 日施行)において、ウェブアクセシビリティを含む情報アクセシビリティは、合理的配慮を的確に行うための環境の整備と位置づけられており、事前的改善措置として計画的に推進することが求められています。 とあり…などと自信満々に答えられてたのですが、政府広報オンラインのウェブアクセシビリティとは?分かりやすくゼロから解説!という記事(下記スクリーンショット中の下線は筆者によります。*1)によると、 障… <p>一般にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は、合理的配慮の事前的改善措置となる、環境の整備に分類されます。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%ED%CC%B3%BE%CA">総務省</a>の<a href="https://www.soumu.go.jp/main_sosiki/joho_tsusin/b_free/guideline.html">みんなの公共サイト運用ガイドライン(2016年版)</a>によれば、</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20231018/20231018223111.png" alt="&#x307F;&#x3093;&#x306A;&#x306E;&#x516C;&#x5171;&#x30B5;&#x30A4;&#x30C8;&#x904B;&#x7528;&#x30AC;&#x30A4;&#x30C9;&#x30E9;&#x30A4;&#x30F3;&#xFF08;2016&#x5E74;&#x7248;&#xFF09;&#x306E;&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <blockquote><p>障害者差別解消法(平成 28 年 4 月 1 日施行)において、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を含む情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は、合理的配慮を的確に行うための環境の整備と位置づけられており、事前的改善措置として計画的に推進することが求められています。</p></blockquote> <p>とあり…などと自信満々に答えられてたのですが、<a href="https://www.gov-online.go.jp/">政府広報オンライン</a>の<a href="https://www.gov-online.go.jp/useful/article/202310/2.html">ウェブアクセシビリティとは?分かりやすくゼロから解説!</a>という記事(下記<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B9%A5%AF%A5%EA%A1%BC%A5%F3%A5%B7%A5%E7%A5%C3%A5%C8">スクリーンショット</a>中の下線は筆者によります。<a href="#f-1537cd0d" name="fn-1537cd0d" title="「みんなの公共サイト運用ガイドラン」と脱字を起こしているのですが、いろいろと心配になりますね…">*1</a>)によると、</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20231018/20231018223119.png" alt="&#x30A6;&#x30A7;&#x30D6;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3068;&#x306F;&#xFF1F;&#x5206;&#x304B;&#x308A;&#x3084;&#x3059;&#x304F;&#x30BC;&#x30ED;&#x304B;&#x3089;&#x89E3;&#x8AAC;&#xFF01;&#x306E;&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <blockquote><p>障害者のある人への合理的配慮とは、(中略)ウェブサイトの場合ではJIS X 8341-3:2016に準拠したウェブサイトを作り、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を確保することがこれに当たります。</p></blockquote> <p>とあるわけで、JIS X 8341-3:2016<a href="#f-b24b5344" name="fn-b24b5344" title="規格そのものはJIS検索で参照できます。技術的にはWCAG 2.0と同一です">*2</a>に準拠したウェブサイトが合理的配慮に当たる、と読めるわけですね…。これは、みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>と言っていることが違うように思いますが、本当のところはどうなんでしょうか…?<a href="#f-56330eea" name="fn-56330eea" title="それはそれとして、「障害者のある人」は語彙として変ですね…。">*3</a><ins>(2023-10-25時点で、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%C9%DC%B9%AD%CA%F3%A5%AA%A5%F3%A5%E9%A5%A4%A5%F3">政府広報オンライン</a>の内容が修正されていることを確認しています。最後に追記をしています。)</ins></p> <p>さて、そもそも合理的配慮とは何でしょう?というのは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a>の<a href="https://www8.cao.go.jp/shougai/suishin/sabekai_leaflet-r05.html">リーフレット「令和6年4月1日から合理的配慮の提供が義務化されます!」</a>がわかりやすく説明されていると思います。<a href="#f-26914482" name="fn-26914482" title="合理的配慮とは何なのかについてはリーフレットに説明を譲ります">*4</a></p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20231018/20231018223126.png" alt="&#x30EA;&#x30FC;&#x30D5;&#x30EC;&#x30C3;&#x30C8;&#x300C;&#x4EE4;&#x548C;&#xFF16;&#x5E74;&#xFF14;&#x6708;&#xFF11;&#x65E5;&#x304B;&#x3089;&#x5408;&#x7406;&#x7684;&#x914D;&#x616E;&#x306E;&#x63D0;&#x4F9B;&#x304C;&#x7FA9;&#x52D9;&#x5316;&#x3055;&#x308C;&#x307E;&#x3059;&#xFF01;&#x300D;&#x306E;&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EA%A1%BC%A5%D5%A5%EC%A5%C3%A5%C8">リーフレット</a>の中には<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>という言葉そのものは出てきませんが、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EA%A1%BC%A5%D5%A5%EC%A5%C3%A5%C8">リーフレット</a>10ページの「障害のある人への適切に対応するためのチェックリスト」の2つ目に、「障害のある人にとってのバリアとなる社内のルールやマニュアル、設備等がないか確認しましょう」という項目があります。ここでは、</p> <blockquote><p> マニュアルの見直しや研修の実施等のソフト面の対応や、施設の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化等のハード面の対応といった、合理的配慮を的確に行うために、不特定多数の障害者を対象として行う事前改善措置のことを「環境の整備」といいます(「環境の整備」は努力義務)。</p></blockquote> <p>という説明がされています。この「施設の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化等」にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>も含まれていると捉えるのが自然と言えるでしょう。</p> <p>話が変わって、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a>の<a href="https://jireidb.shougaisha-sabetukaishou.go.jp">障害者差別解消に関する事例データベース</a>という事例集があります。そこで「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」をキーワードとして検索すると、次の3件がヒットします<a href="#f-d5b5cf20" name="fn-d5b5cf20" title="検索結果のURLが張れないので、結果の一部を引用しています">*5</a>。ちなみに、いずれも環境の整備の事例として分類されています。</p> <blockquote><p>【銀行において、利便性向上の観点から誰もが使いやすいATMを設置した件】銀行内で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応を進めるにあたり、利便性向上を考え車椅子利用者や、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>の方など、誰もが使いやすいATMを採用するため検討を行った。</p> <p>【銀行において利便性向上の観点から電子記帳台を設置した件】銀行内で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応を進めるにあたり、利便性向上を考え、誰もが手続しやすい窓口となるような検討を行った。</p> <p>【百貨店において利便性向上の観点から車椅子専用駐車スペースの表示方法を改善した件】百貨店において<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応を進めるにあたり、利便性向上を考え利用者が来店しやすい店舗となるよう車椅子専用駐車スペースの表示方法について検討を行った。</p></blockquote> <p>このように、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>ではない<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は検索結果としてヒットしますが、残念ながらウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>についての事例は存在しません。</p> <p>この事例データベースで「ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」という言葉が1つもヒットしないという状況が、世の中でウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>という言葉が知られていないとも捉えられるわけです。もっとも、知られてないからこそ、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%AF%C9%DC%B9%AD%CA%F3%A5%AA%A5%F3%A5%E9%A5%A4%A5%F3">政府広報オンライン</a>で記事にされているわけですけども…。</p> <p>まとめますと、ここまで調べた限りでは、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は合理的配慮というよりかは、環境の整備に当たると考えるのが適切だと筆者は捉えています。</p> <p>ほかにもいろいろと言いたいことはあるのですが<a href="#f-c699de65" name="fn-c699de65" title="そもそもの話として、ウェブアクセシビリティが「合理的配慮」なのか「環境の整備」なのかという分類そのものが、あまり有意義なものではないと思っています">*6</a>、まずは事例データベースにウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が掲載されるところからではないかと思いました。</p> <hr /> <p><strong>2023-10-25追記</strong></p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20231025/20231025214841.png" alt="&#x653F;&#x5E9C;&#x5E83;&#x5831;&#x30AA;&#x30F3;&#x30E9;&#x30A4;&#x30F3;&#x300C;&#x30A6;&#x30A7;&#x30D6;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3068;&#x306F;&#xFF1F; &#x5206;&#x304B;&#x308A;&#x3084;&#x3059;&#x304F;&#x30BC;&#x30ED;&#x304B;&#x3089;&#x89E3;&#x8AAC;&#xFF01;&#x300D;&#x306E;&#x30B9;&#x30AF;&#x30EA;&#x30FC;&#x30F3;&#x30B7;&#x30E7;&#x30C3;&#x30C8;" width="1200" height="899" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>くだんのコラムについて、</p> <blockquote><p>また、その合理的配慮を的確に行うため、環境の整備が努力義務となっており、ウェブサイトの場合ではJIS X 8341-3:2016に準拠したウェブサイトを作り、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を確保することがこれに当たります。</p></blockquote> <p>と環境の整備ということが明記されるようになっていました。ということで解釈の不一致はなくなった模様です。</p> <div class="footnote"> <p class="footnote"><a href="#fn-1537cd0d" name="f-1537cd0d" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">「みんなの公共サイト運用ガイドラン」と脱字を起こしているのですが、いろいろと心配になりますね…</span></p> <p class="footnote"><a href="#fn-b24b5344" name="f-b24b5344" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">規格そのものは<a href="https://www.jisc.go.jp/app/jis/general/GnrJISSearch.html">JIS検索</a>で参照できます。技術的には<a href="https://waic.jp/translations/WCAG20/Overview.html">WCAG 2.0</a>と同一です</span></p> <p class="footnote"><a href="#fn-56330eea" name="f-56330eea" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">それはそれとして、「障害者のある人」は語彙として変ですね…。</span></p> <p class="footnote"><a href="#fn-26914482" name="f-26914482" class="footnote-number">*4</a><span class="footnote-delimiter">:</span><span class="footnote-text">合理的配慮とは何なのかについては<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EA%A1%BC%A5%D5%A5%EC%A5%C3%A5%C8">リーフレット</a>に説明を譲ります</span></p> <p class="footnote"><a href="#fn-d5b5cf20" name="f-d5b5cf20" class="footnote-number">*5</a><span class="footnote-delimiter">:</span><span class="footnote-text">検索結果のURLが張れないので、結果の一部を引用しています</span></p> <p class="footnote"><a href="#fn-c699de65" name="f-c699de65" class="footnote-number">*6</a><span class="footnote-delimiter">:</span><span class="footnote-text">そもそもの話として、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が「合理的配慮」なのか「環境の整備」なのかという分類そのものが、あまり有意義なものではないと思っています</span></p> </div> momdo メモ:WCAG 2.1 (2023)では、達成基準4.1.1は常に満たされていると扱うべきという話 hatenablog://entry/820878482969504399 2023-09-21T23:22:35+09:00 2023-09-21T23:24:53+09:00 ソースは2023年9月21日付けで更新されたWCAG 2.1。観測の埒外からの更新はちょっと…。 https://www.w3.org/TR/2023/REC-WCAG21-20230921/#parsing Updated W3C Recommendation: Web Content Accessibility Guidelines (WCAG) 2.1 | 2023 | News | W3C 以下、達成基準4.1.1で変更された注記の仮訳。 NOTE This Success Criterion should be considered as always satisfied for a… <p>ソースは2023年9月21日付けで更新されたWCAG 2.1。観測の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%D4%BF%B3%B0">埒外</a>からの更新はちょっと…。<br/> <a href="https://www.w3.org/TR/2023/REC-WCAG21-20230921/#parsing">https://www.w3.org/TR/2023/REC-WCAG21-20230921/#parsing</a></p> <p><a href="https://www.w3.org/news/2023/updated-w3c-recommendation-web-content-accessibility-guidelines-wcag-2-1/">Updated W3C Recommendation: Web Content Accessibility Guidelines (WCAG) 2.1 | 2023 | News | W3C</a></p> <p>以下、達成基準4.1.1で変更された注記の仮訳。</p> <blockquote><p>NOTE<br/> This Success Criterion should be considered as always satisfied for any content using HTML or <a class="keyword" href="https://d.hatena.ne.jp/keyword/XML">XML</a>.</p></blockquote> <p>注記<br/> この達成基準は、HTMLまたは<a class="keyword" href="https://d.hatena.ne.jp/keyword/XML">XML</a>を使用するすべてのコンテンツについて常に満たされているとみなされるべきです。</p> <blockquote><p>NOTE<br/> Since this criterion was written, the HTML Living Standard has adopted specific requirements governing how user agents must handle incomplete tags, incorrect element nesting, duplicate attributes, and non-unique IDs. [HTML]</p> <p>Although the HTML Standard treats some of these cases as non-conforming for authors, it is considered to "allow these features" for the purposes of this Success Criterion because the specification requires that user agents support handling these cases consistently. In practice, this criterion no longer provides any benefit to people with disabilities in itself.</p> <p>Issues such as missing roles due to inappropriately nested elements or incorrect states or names due to a duplicate ID are covered by different Success Criteria and should be reported under those criteria rather than as issues with 4.1.1.</p></blockquote> <p>注記<br/> この基準が作成されて以来、HTML Living Standardは、ユーザーエージェントが不完全なタグ、不正な要素のネスト、重複した属性、および一意でないIDをどのように処理しなければならないかを規定する明確な要件を採用しました。[HTML]</p> <p>HTML Standardはまた、これらのケースの一部を著者に対して不適合として扱いますが、仕様ではユーザーエージェントがこれらのケースの一貫した処理をサポートすることを要求しているため、この達成基準の目的では「これらの機能を許可する」と見なされます。実際には、この基準自体は、もはや障害のある人々に何の利益ももたらしません。</p> <p>不適切にネストされた要素による役割の欠落、IDの重複による不正な状態や名前などの問題は、別々の達成基準で扱われており、4.1.1の問題としてではなく、それらの基準に基づいて報告されるべきです。</p> momdo アクセシビリティとユーザビリティという言葉はインターネットに普及にあわせて使われるようになった? hatenablog://entry/820878482966258360 2023-09-10T15:53:19+09:00 2023-09-10T15:53:19+09:00 細かいところ目を瞑れば、これからアクセシビリティに取り組むにあたってのとっかかりとして、ほどよいリソースだと思っているデジタル庁のウェブアクセシビリティ導入ガイドブックですが*1、いろいろあってちょっと読み返してみました。 大なり小なり引っかかる点はいくつもあるのはまあ置いておいて、その引っかかった箇所のうちの一つがこの記事のタイトルです。ガイドブックにはこうあります。 本当にそうなの?という疑問が出てきます。ということで、Google Books Ngram Viewerでざっくり調べてみました。ちなみに、Ngram Viewerというのはカレントアウェアネス E2533いわく、 一般に“n… <p>細かいところ目を瞑れば、これから<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に取り組むにあたってのとっかかりとして、ほどよいリソースだと思っているデジタル庁の<a href="https://www.digital.go.jp/resources/introduction-to-web-accessibility-guidebook">ウェブアクセシビリティ導入ガイドブック</a>ですが<a href="#f-93848f05" name="fn-93848f05" title="この記事を書いている時点で2023年5月12日版が最新なので、このバージョンの話をします">*1</a>、いろいろあってちょっと読み返してみました。</p> <p>大なり小なり引っかかる点はいくつもあるのはまあ置いておいて、その引っかかった箇所のうちの一つがこの記事のタイトルです。ガイドブックにはこうあります。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910144448.png" alt="&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3068;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3000;&#x300C;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x300D;&#x3068;&#x300C;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x300D;&#x306F;&#x3069;&#x3061;&#x3089;&#x3082;&#x5916;&#x6765;&#x8A9E;&#x3067;&#x3059;&#x3057;&#x3001;&#x30A4;&#x30F3;&#x30BF;&#x30FC;&#x30CD;&#x30C3;&#x30C8;&#x306E;&#x666E;&#x53CA;&#x306B;&#x3042;&#x308F;&#x305B;&#x3066;&#x4F7F;&#x308F; &#x308C;&#x308B;&#x3088;&#x3046;&#x306B;&#x306A;&#x3063;&#x305F;&#x6B74;&#x53F2;&#x306E;&#x6D45;&#x3044;&#x8A00;&#x8449;&#x3067;&#x3059;&#x3002;" width="800" height="123" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>本当にそうなの?という疑問が出てきます。ということで、<a href="https://books.google.com/ngrams/">Google Books Ngram Viewer</a>でざっくり調べてみました。ちなみに、Ngram Viewerというのは<a href="https://current.ndl.go.jp/e2533">カレントアウェアネス E2533</a>いわく、</p> <blockquote><p>一般に“ngram viewer”と言った場合,書籍の全文テキストデータを利用して,特定の単語やフレーズの頻度を出版年代に沿って可視化できるサービスを指し,2010年に公開された“<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a> Books Ngram Viewer”がその端緒である。</p></blockquote> <p>ということだそうで、今回の目的にぴったりと言えそうです。accessibilityとusabilityで調べてみた結果が以下です(<a href="https://books.google.com/ngrams/graph?content=accessibility%2Cusability&amp;year_start=1900&amp;year_end=2019&amp;corpus=en-2019&amp;smoothing=3">元グラフ</a>)。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910142718.png" alt="accessibility&#x3068;usability&#x306E;1900&#x5E74;&#x304B;&#x3089;2019&#x5E74;&#x307E;&#x3067;&#x306E;&#x51FA;&#x73FE;&#x983B;&#x5EA6;&#x306E;&#x30B0;&#x30E9;&#x30D5;&#x3002;accessibility&#x306E;&#x51FA;&#x73FE;&#x983B;&#x5EA6;&#x306F;usability&#x3092;&#x5E38;&#x306B;&#x4E0A;&#x56DE;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;&#x51FA;&#x73FE;&#x983B;&#x5EA6;&#x3068;&#x3057;&#x3066;&#x306F;&#x3001;accessibility&#xFF1A;1900&#x5E74;&#x304C;&#x7D04;0.0001%&#x3001;2019&#x5E74;&#x304C;&#x7D04;0.00045%&#x3002;accessibility&#xFF1A;1990&#x5E74;&#x304C;&#x7D04;0%&#x3001;2019&#x5E74;&#x304C;&#x7D04;0.0002%&#x3002;&#x983B;&#x5EA6;&#x306E;&#x50BE;&#x5411;&#x3068;&#x3057;&#x3066;&#x306F;&#x3044;&#x305A;&#x308C;&#x3082;&#x5897;&#x52A0;&#x50BE;&#x5411;&#x3060;&#x304C;&#x3001;&#x30B0;&#x30E9;&#x30D5;&#x306E;&#x5909;&#x5316;&#x3068;&#x3057;&#x3066;&#x3001;accessibility&#x306F;1970&#x5E74;&#x3054;&#x308D;&#x306B;&#x50BE;&#x304D;&#x304C;&#x5897;&#x52A0;&#x3057;&#x3001;1977&#x5E74;&#x9803;&#x306B;&#x6975;&#x5927;&#x3068;&#x306A;&#x308A;&#x3001;&#x305D;&#x306E;&#x5F8C;&#x6E1B;&#x5C11;&#x3001;1985&#x5E74;&#x9803;&#x306B;&#x6975;&#x5C0F;&#x3068;&#x306A;&#x308A;&#x5897;&#x52A0;&#x3001;2005&#x5E74;&#x9803;&#x306B;&#x6975;&#x5927;&#x3001;&#x305D;&#x306E;&#x5F8C;&#x6E1B;&#x5C11;&#x3057;&#x3001;2019&#x5E74;&#x306B;&#x81F3;&#x308B;&#x3002;usability&#x306F;1970&#x5E74;&#x9803;&#x306B;&#x50BE;&#x304D;&#x304C;&#x3084;&#x3084;&#x5897;&#x52A0;&#x3001;1990&#x5E74;&#x9803;&#x306B;&#x306F;&#x3055;&#x3089;&#x306B;&#x50BE;&#x304D;&#x304C;&#x5897;&#x52A0;&#x3001;2000&#x5E74;&#x9803;&#x306B;&#x3055;&#x3089;&#x306B;&#x50BE;&#x304D;&#x5897;&#x52A0;&#x3057;&#x3001;2005&#x5E74;&#x9803;&#x306B;&#x6975;&#x5927;&#x3068;&#x306A;&#x308B;&#x3002;&#x305D;&#x306E;&#x5F8C;&#x307B;&#x307C;&#x6A2A;&#x3070;&#x3044;&#x3067;2019&#x5E74;&#x306B;&#x81F3;&#x308B;&#x3002;" width="800" height="289" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>面白いことに、常にaccessibilityがusabilityよりも値として上回っており、2倍ほど違うのは意外な感じを受けました。</p> <p>さておき、グラフでは単語accessibilityもusabilityも増加傾向にあるわけですが、インターネットの普及という意味で<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%A4%A5%EB%A5%B9%A5%C8%A1%BC%A5%F3">マイルストーン</a>になるだろう、<a href="https://ja.wikipedia.org/wiki/Microsoft_Windows_95">Windows 95</a>が発売された1995年に注目してみます。accessibilityに関しては、収録データで最新の2019年と1995年とでパーセンテージでほぼ同じと言えますし、usabilityについては1995年のパーセンテージは、2019年の半分程度となっています。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/World%20Wide%20Web">World Wide Web</a>が誕生した<a href="#f-9937a538" name="fn-9937a538" title="関連:WWW誕生から30周年 Googleもロゴで祝福">*2</a>とされる1989年を基点とするなら、usabilityはインターネットもといウェブの普及にあわせて増えていったということがまだできそうですが、accessibilityは極大を示している1978年と同程度であり、これは2019年と大きな違いはありません。このグラフを信じるならば、ちょっとデジタル庁の説明は怪しいのではないでしょうか。</p> <p>でもこれは英語の話でしょう?と言われるとつらいものがあるわけですが、日本語を収録している、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B2%F1%BF%DE%BD%F1%B4%DB">国会図書館</a>が公開している<a href="https://lab.ndl.go.jp/ngramviewer/">NDL Ngram Viewer</a>は、</p> <blockquote><p>図書については刊行年代が1960年代まで、雑誌については刊行年代が1990年代までの資料を主に対象</p></blockquote> <p>としているので最近のデータが取れません。あまり深く考えずに「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」と「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>」でグラフを打ち出しても、下記のように2000年でガクンと値が落ちます(<a href="https://lab.ndl.go.jp/ngramviewer/?keyword=%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3%2F%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3&amp;size=100&amp;from=0&amp;materialtype=full">元グラフ</a>)。これは雑誌データが2000年までしかないためと思われ、有意な結果とは言えないでしょう。ここでも<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のほうがほとんどの年で上回っているのは意外だという感想はあるのですが。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910142723.png" alt="&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3068;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306E;1945&#x5E74;&#x304B;&#x3089;2023&#x5E74;&#x307E;&#x3067;&#x306E;&#x51FA;&#x73FE;&#x983B;&#x5EA6;&#x306E;&#x30B0;&#x30E9;&#x30D5;&#x3002;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306F;1949&#x5E74;&#x306B;1&#x3001;2000&#x5E74;&#x304C;&#x6700;&#x5927;&#x3067;616&#x3001;2013&#x5E74;&#x306B;1&#x3002;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306F;1970&#x5E74;&#x306B;3&#x3001;2000&#x5E74;&#x304C;&#x6700;&#x5927;&#x3067;413&#x3001;2010&#x5E74;&#x306B;17&#x3002;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306F;&#x983B;&#x7E41;&#x306B;&#x6975;&#x5927;&#x30FB;&#x6975;&#x5C0F;&#x3092;&#x7E70;&#x308A;&#x8FD4;&#x3057;&#x3066;2000&#x5E74;&#x306B;&#x6700;&#x5927;&#x306B;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306F;1994&#x5E74;&#x304B;&#x3089;2000&#x5E74;&#x307E;&#x3067;&#x306B;&#x92ED;&#x3044;&#x50BE;&#x304D;&#x3092;&#x898B;&#x305B;&#x3066;&#x3044;&#x308B;&#x304C;&#x3001;&#x305D;&#x308C;&#x4EE5;&#x5916;&#x306E;&#x5E74;&#x306F;&#x307B;&#x307C;0&#x4ED8;&#x8FD1;&#x3067;&#x6A2A;&#x3070;&#x3044;&#x306B;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;" width="800" height="318" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>では2000年までのデータでなにか面白いものが出せないか?ということで、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」と「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>」に、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」を加えて打ち出したのが次のグラフです(<a href="https://lab.ndl.go.jp/ngramviewer/?keyword=%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3%2F%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3%2F%E3%83%90%E3%83%AA%E3%82%A2%E3%83%95%E3%83%AA%E3%83%BC&amp;size=100&amp;from=0&amp;materialtype=full">元グラフ</a>)。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910151237.png" alt="&#x30D0;&#x30EA;&#x30A2;&#x30D5;&#x30EA;&#x30FC;&#x3068;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3001;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306E;1945&#x5E74;&#x304B;&#x3089;2000&#x5E74;&#x307E;&#x3067;&#x306E;&#x51FA;&#x73FE;&#x983B;&#x5EA6;&#x306E;&#x30B0;&#x30E9;&#x30D5;&#x3002;&#x30D0;&#x30EA;&#x30A2;&#x30D5;&#x30EA;&#x30FC;&#x306F;2000&#x5E74;&#x306B;&#x7D04;14000&#x3068;&#x5168;&#x90E8;&#x306E;&#x7CFB;&#x5217;&#x3067;&#x6700;&#x5927;&#x3068;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;1994&#x5E74;&#x3067;1500&#x3067;&#x3042;&#x308A;&#x3001;&#x307B;&#x307C;&#x50BE;&#x304D;&#x304C;&#x540C;&#x3058;&#x30DA;&#x30FC;&#x30B9;&#x3067;2000&#x5E74;&#x306B;&#x81F3;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x3068;&#x30E6;&#x30FC;&#x30B6;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x304C;&#x305D;&#x308C;&#x305E;&#x308C;&#x6700;&#x5927;1000&#x672A;&#x6E80;&#x306E;&#x305F;&#x3081;&#x3001;&#x3069;&#x306E;&#x5E74;&#x3067;&#x3082;&#x898B;&#x305F;&#x76EE;&#x306F;&#x307B;&#x307C;0&#x4ED8;&#x8FD1;&#x3067;&#x30D7;&#x30ED;&#x30C3;&#x30C8;&#x3055;&#x308C;&#x3066;&#x3044;&#x308B;&#x306E;&#x3068;&#x5BFE;&#x7167;&#x7684;&#x306B;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x3002;" width="800" height="327" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」の出現頻度は1994年で1500,2000年で約14000と急速な伸びを示しているのに対して、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」は1994年で289、2000年で616、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>」は1994年で23、2000年で413となっており、10倍以上の差が付けられています。このグラフを信じるなら、2000年時点では<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>も<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>もどんぐりの背比べであり、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>のほうが圧倒的な存在感を示していることになります。</p> <p>ところで、<a href="https://waic.jp/news/20230214/">WAICの「障害者基本計画(第5次)案に関する意見募集について」へのパブリックコメント</a>で言及されているように、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」と「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」で法律上の言葉の混用が見られるわけですが、一方で導入ガイドブックでは「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」という語は一切出てきません。「ガイドブックの目的」では、</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910142748.png" alt="&#x30AC;&#x30A4;&#x30C9;&#x30D6;&#x30C3;&#x30AF;&#x306E;&#x76EE;&#x7684;&#x3000;&#x672C;&#x30AC;&#x30A4;&#x30C9;&#x30D6;&#x30C3;&#x30AF;&#x306F;&#x3001;&#x30A6;&#x30A7;&#x30D6;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306B;&#x521D;&#x3081;&#x3066;&#x53D6;&#x308A;&#x7D44;&#x3082;&#x3046;&#x3068;&#x3057;&#x3066;&#x3044;&#x308B;&#x884C;&#x653F;&#x5B98;&#x306E;&#x65B9;&#x3084;&#x4E8B;&#x696D;&#x8005;&#x5411;&#x3051;&#x306B;&#x3001;&#x30A6;&#x30A7;&#x30D6;&#x30A2;&#x30AF;&#x30BB;&#x30B7;&#x30D3;&#x30EA;&#x30C6;&#x30A3;&#x306E;&#x8003;&#x3048;&#x65B9;&#x3084;&#x6982;&#x8981;&#x3001;&#x53D6;&#x308A;&#x7D44;&#x307F;&#x65B9;&#x306E;&#x30DD;&#x30A4;&#x30F3;&#x30C8;&#x3092;&#x89E3;&#x8AAC;&#x3059;&#x308B;&#x305F;&#x3081;&#x306E;&#x8CC7;&#x6599;&#x3067;&#x3059;&#x3002;&#x4F55;&#x306B;&#x3069;&#x3046;&#x53D6;&#x308A;&#x7D44;&#x3081;&#x3070;&#x3044;&#x3044;&#x306E;&#x304B;&#x3001;&#x3069;&#x3046;&#x3084;&#x3063;&#x3066;&#x8ABF;&#x9054;&#x306B;&#x7D44;&#x307F;&#x8FBC;&#x3081;&#x3070;&#x3044;&#x3044;&#x306E;&#x304B;&#x3001;&#x59D4;&#x8A17;&#x4E8B;&#x696D;&#x8005;&#x3068;&#x306E;&#x5186;&#x6ED1;&#x306A;&#x30B3;&#x30DF;&#x30E5;&#x30CB;&#x30B1;&#x30FC;&#x30B7;&#x30E7;&#x30F3;&#x3001;&#x610F;&#x601D;&#x6C7A;&#x5B9A;&#x306E;&#x30DD;&#x30A4;&#x30F3;&#x30C8;&#x304C;&#x308F;&#x304B;&#x308B;&#x3088;&#x3046;&#x306B;&#x306A;&#x308B;&#x3053;&#x3068;&#x3092;&#x76EE;&#x7684;&#x3068;&#x3057;&#x3066;&#x3044;&#x307E;&#x3059;&#x3002;" width="800" height="256" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>とあって、まあそういう目的のリソースじゃないといえばそうなんでしょうが、言葉の頻度という話を持ち出すのならば、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」を引き合いに出しつつ、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」との言葉の関係性についてガイドブック中で触れられてもよいのではないかと思ったりもします。</p> <p>話がそれてしまいましたが、そもそもこのガイドブックは、</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/m/momdo/20230910/20230910142714.png" alt="&#x5229;&#x7528;&#x3068;&#x914D;&#x5E03;&#x3000;&#x672C;&#x30AC;&#x30A4;&#x30C9;&#x30D6;&#x30C3;&#x30AF;&#x306F;&#x3001;&#x5185;&#x5BB9;&#x306E;&#x6B63;&#x78BA;&#x6027;&#x3084;&#x7DB2;&#x7F85;&#x6027;&#x306B;&#x3064;&#x3044;&#x3066;&#x4FDD;&#x8A3C;&#x3059;&#x308B;&#x3053;&#x3068;&#x304C;&#x3067;&#x304D;&#x307E;&#x305B;&#x3093;&#x3002;&#x672C;&#x30AC;&#x30A4;&#x30C9;&#x30D6;&#x30C3;&#x30AF;&#x306E;&#x5185;&#x5BB9;&#x306B;&#x3064;&#x3044;&#x3066;&#x3001;&#x30C7;&#x30B8;&#x30BF;&#x30EB;&#x5E81;&#x4EE5;&#x5916;&#x306E;&#x7D44;&#x7E54;&#x306E;&#x65B9;&#x3078;&#x306E;&#x30B5;&#x30DD;&#x30FC;&#x30C8;&#x3082;&#x884C;&#x3046;&#x3053;&#x3068;&#x304C;&#x3067;&#x304D;&#x307E;&#x305B;&#x3093;&#x3002;&#x4E88;&#x3081;&#x3054;&#x4E86;&#x627F;&#x304F;&#x3060;&#x3055;&#x3044;&#x3002;" width="800" height="142" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p> <p>とあって、いってしまえば「信じてくれるな」ということになります。ただ、だからといって、わかりやすさのために怪しげな説明を混ぜ込んでもいいというものでもないでしょう。</p> <p>ちなみに冒頭でリンクしているHTMLのページ「位置付けとロードマップ」では、</p> <blockquote><p>2023年度中を目処に、デジタル社会推進標準<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>への<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CA%D4%C6%FE">編入</a>を目指しています。</p></blockquote> <p>とあり、この状態でそのまま<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CA%D4%C6%FE">編入</a>となると、それは話がまた別ですよね…というお話でした。</p> <div class="footnote"> <p class="footnote"><a href="#fn-93848f05" name="f-93848f05" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">この記事を書いている時点で2023年5月12日版が最新なので、このバージョンの話をします</span></p> <p class="footnote"><a href="#fn-9937a538" name="f-9937a538" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">関連:<a href="https://www.itmedia.co.jp/news/articles/1903/12/news062.html">WWW誕生から30周年 Googleもロゴで祝福</a></span></p> </div> momdo 国交省・経産省所管事業分野における障害者差別解消法の対応指針のパブコメ hatenablog://entry/820878482957450402 2023-08-11T15:39:33+09:00 2023-08-11T15:39:33+09:00 出てました。 「国土交通省所管事業における障害を理由とする差別の解消の推進に関する対応指針」の改定案及び「国土交通省における障害を理由とする差別の解消の推進に関する対応要領」等の改定案に関する意見募集について(受付締切日時:2023年8月25日0時0分) 経済産業省所管事業分野における障害を理由とする差別の解消の推進に関する対応指針(改定案)に関する意見募集について|e-Govパブリック・コメント(受付締切日時:2023年9月1日23時59分) なぜか国交省はzipで固まってますが、国交省の場合は、zipの中の「01_国交省所管事業 対応指針(案)(新旧対照表)るびなし.pdf」がお目当ての対… <p>出てました。</p> <ul> <li><a href="https://public-comment.e-gov.go.jp/servlet/Public?CLASSNAME=PCMMSTDETAIL&amp;id=155230110&amp;Mode=0">「国土交通省所管事業における障害を理由とする差別の解消の推進に関する対応指針」の改定案及び「国土交通省における障害を理由とする差別の解消の推進に関する対応要領」等の改定案に関する意見募集について</a>(受付締切日時:2023年8月25日0時0分)</li> <li><a href="https://public-comment.e-gov.go.jp/servlet/Public?CLASSNAME=PCMMSTDETAIL&amp;id=595123057&amp;Mode=0">経済産業省所管事業分野における障害を理由とする差別の解消の推進に関する対応指針(改定案)に関する意見募集について|e-Govパブリック・コメント</a>(受付締切日時:2023年9月1日23時59分)</li> </ul> <p>なぜか<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>はzipで固まってますが、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の場合は、zipの中の「01_<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>所管事業 対応指針(案)(新旧対照表)るびなし.pdf」がお目当ての対応指針案ということになります。<a href="#f-51d692a1" name="fn-51d692a1" title="基本方針と対応指針の関係性については、障害者差別解消法に基づく基本方針の改定にある、障害者差別解消法に基づく基本方針の改定の「第4 事業者が講ずべき障害を理由とする差別を解消するための措置に関する基本的な事項」に具体的に書かれています。">*1</a></p> <p>さて、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の対応指針で筆者の目を惹いたものを見てみる前に、この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の対応指針とはなんぞや、というところから。</p> <p>本文(p.11)では、</p> <blockquote><p>三 障害を理由とする不当な差別的取扱い及び合理的配慮の具体例 ・ この対応指針は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%C5%DA%B8%F2%C4%CC%BE%CA">国土交通省</a>所管事業の事業者向けに作成されたものであり、別紙において主な事業に関する障害を理由とする不当な差別的取扱い及び合理的配慮の具体例を示している。なお、別紙の例以外であっても不当な差別的取扱い及び合理的配慮に該当するものがあることに留意する。</p></blockquote> <p>とあります。これはつまり、別紙を見れば、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%C5%DA%B8%F2%C4%CC%BE%CA">国土交通省</a>所管事業の具体的な事業者がわかる、ということになります。</p> <p>○ 別紙【航<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B6%F5%CE%B9">空旅</a>客ターミナル施設事業関係】(p.53)では、</p> <blockquote><p>1 対象事業 空港法(昭和31年法律第80号)第15条第1項に規定する空港機能施設事業のうち、航<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B6%F5%CE%B9">空旅</a>客の取扱施設(以下「航<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B6%F5%CE%B9">空旅</a>客ターミナル施設」という。)を管理する事業を対象とする。</p></blockquote> <p>とあります。<a href="https://www.mlit.go.jp/koku/koku_tk5_000004.html">航空:空港 - 国土交通省</a>に事業者の一覧が見て取れますが、たとえば、<a href="https://ja.wikipedia.org/wiki/%E6%9D%B1%E4%BA%AC%E5%9B%BD%E9%9A%9B%E7%A9%BA%E6%B8%AF">東京国際空港</a>(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B1%A9%C5%C4%B6%F5%B9%C1">羽田空港</a>)であれば、第1・<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C2%E82%CE%B9%B5%D2%A5%BF%A1%BC%A5%DF%A5%CA%A5%EB">第2旅客ターミナル</a>(国内線)を運営する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%FC%CB%DC%B6%F5%B9%C1%A5%D3%A5%EB%A5%C7%A5%F3%A5%B0">日本空港ビルデング</a>株式会社、第3旅客ターミナル(国際線)を運営する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C5%EC%B5%FE%B9%F1%BA%DD%B6%F5%B9%C1%A5%BF%A1%BC%A5%DF%A5%CA%A5%EB">東京国際空港ターミナル</a>株式会社と読み解くことができるでしょう。<a href="#f-d00c60d9" name="fn-d00c60d9" title="こんな感じで各省庁ごとに所管事業が異なるわけですから、情報アクセシビリティにだけ着目するとしても、各省庁分だけ見ていく必要があるわけですね…。これが縦割り行政というやつですかね。">*2</a></p> <p>そして、別紙【航<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B6%F5%CE%B9">空旅</a>客ターミナル施設事業関係】の続き(p.54)を読んでいくと、旧(現行)指針には、</p> <blockquote><p>(2)合理的配慮の提供の具体例 ・ WEBサイトにて、障害のある利用者用の情報を分かりやすく掲載するとともに、音声読みあげ、文字拡大機能をつける。</p></blockquote> <p>という何とも言いがたい文言があったわけですが、これは改定案では削除されました。よいことですね。(こういう<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%EC%A5%B2">アレゲ</a>な文言が対応指針という法で定められた文書にあると、サイト構築の要件に入ってしまうわけです。なにせ、法で定められた文書に挙げられている具体例ですからね。)</p> <p>個別具体の話をざっくり触れたところで、本文に戻ってみましょう。</p> <p>(4)環境の整備と合理的配慮の関係(p.9、p.10)を抜粋してみると、</p> <blockquote><p>・ 法は、個別の場面において、個々の障害者に対して行われる合理的配慮を的確に行うための不特定多数の障害者を主な対象として行われる事前的改善措置(施設や設備の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化、意思表示やコミュニケーションを支援するためのサービス・介助者等の人的支援、障害者による円滑な情報の取得・利用・発信のための情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等)を、環境の整備として事業者の努力義務としている。環境の整備においては、新しい技術開発が投資負担の軽減をもたらすこともあることから、技術進歩の動向を踏まえた取組が期待される。また、ハード面のみならず、社員に対する研修や、規定の整備等の対応も含まれることが重要である。</p> <p>・ 合理的配慮の提供と環境の整備の関係に係る一例としては以下の例が挙げられる。</p> <p>○ オンラインでの申込手続が必要で、ウェブサイトの手続に際しての支援を求める申出があった場合に、求めに応じて代替手段(電話・電子メール・対面等)を提案し、本人の意向を確認しながら対応を行う(合理的配慮の提供)とともに、以後、障害者がオンライン申込みの際に不便を感じることのないよう、過重な負担がない範囲でウェブサイトの改良を行う(環境の整備)。</p></blockquote> <p>このあたりの文言は、基本方針にあるものがそのまま記載されるような格好といえるでしょう。</p> <p>話は変わって、別紙【予報業務関係】(p.63)<a href="#f-02a6ab7b" name="fn-02a6ab7b" title="忘れがちですが、気象庁は国交省の外局です。">*3</a>では、</p> <blockquote><p>1 対象事業 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A4%BE%DD%B6%C8%CC%B3%CB%A1">気象業務法</a>(昭和27年法律第165号)第17条の規定に基づき許可を受けて実施する予報業務を対象とする。</p></blockquote> <p>どんな事業者なのかは、<a class="keyword" href="https://d.hatena.ne.jp/keyword/Wikipedia">Wikipedia</a>の<a href="https://ja.wikipedia.org/wiki/%E4%BA%88%E5%A0%B1%E6%A5%AD%E5%8B%99%E8%A8%B1%E5%8F%AF%E4%BA%8B%E6%A5%AD%E8%80%85">予報業務許可事業者</a>がわかりやすいでしょう。有名どころでは、<a href="https://tenki.jp/">tenki.jp</a>を運営する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%FC%CB%DC%B5%A4%BE%DD%B6%A8%B2%F1">日本気象協会</a>ですとか、<a href="https://weathernews.jp/">ウェザーニュース</a>を運営する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A6%A5%A7%A5%B6%A1%BC%A5%CB%A5%E5%A1%BC%A5%BA">ウェザーニューズ</a>なんかが当たると。</p> <p>で、別紙【予報業務関係】の続きには、</p> <blockquote><p>なお、予報業務は、情報通信技術の活用により様々な媒介を通じてサービス提供される形態が主であり、サービス提供における情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等の「環境の整備」に努める必要があるが、以下では、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>(平成25 年法律第65 号)第11 条第1 項の規定に基づき、サービス提供に先だった相談や契約等の場面を中心に「不当な差別的取扱い」及び「合理的配慮」の具体例を示す。</p></blockquote> <p>『サービス提供における情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等の「環境の整備」に努める必要がある』と明言しているところが興味深いな、と。</p> <p>先に挙げたように、空港は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の所管事業なわけですが、鉄道やバス、フェリー(<a href="https://ja.wikipedia.org/wiki/%E6%97%85%E5%AE%A2%E8%88%B9">旅客船</a>)も同じく、となります。しかし、そのような文言は見当たりません。<a href="https://www.mlit.go.jp/sogoseisaku/barrierfree/sosei_barrierfree_mn_000001.html">バリアフリー整備ガイドライン</a>に情報提供の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>確保に向けた<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>として「ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について」があるにもかかわらず、です。このあたりにウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の存在感の薄さがあるのかな…と感じる次第です。</p> <hr /> <p>続いて<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B7%D0%BB%BA%BE%CA">経産省</a>。対応指針(改定案)新旧対照表が提供されているので、これを見ていきます。</p> <p>3 対応指針の位置付け(p.1)には、</p> <blockquote><p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B7%D0%BA%D1%BB%BA%B6%C8%BE%CA">経済産業省</a>が所管する分野における事業者*(以下「事業者」という。)が適切に対応するために必要な事項を定めたものである。</p> <p>* 対象となる事業者は、商業その他の事業を行う者(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>の経営する企業及び公営企業型<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%C6%C8%CE%A9%B9%D4%C0%AF%CB%A1%BF%CD">地方独立行政法人</a>を含み、国、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%C8%CE%A9%B9%D4%C0%AF%CB%A1%BF%CD">独立行政法人</a>等、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>及び公営企業型以外の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%C6%C8%CE%A9%B9%D4%C0%AF%CB%A1%BF%CD">地方独立行政法人</a>を除く。)であり、目的の営利・非営利、個人・法人の別を問わず、同種の行為を反復継続する意思をもって行う者である。したがって、例えば、一般社団法人や<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B0%EC%C8%CC%BA%E2%C3%C4%CB%A1%BF%CD">一般財団法人</a>、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B8%F8%B1%D7%BC%D2%C3%C4%CB%A1%BF%CD">公益社団法人</a>や公益財団法人、個人事業者や対価を得ない無報酬の事業を行う者、非営利事業を行う<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BC%D2%B2%F1%CA%A1%BB%E3%CB%A1%BF%CD">社会福祉法人</a>や<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C6%C3%C4%EA%C8%F3%B1%C4%CD%F8%B3%E8%C6%B0%CB%A1%BF%CD">特定非営利活動法人</a>も対象となり、また対面やオンラインなどサービス等の提供形態の別も問わない。</p></blockquote> <p>これはまあ、現行の対応指針と基本的には変わらないのですが(それはそう)、「対面やオンラインなどサービス等の提供形態の別も問わない。」という文言が追加されているのは1つのポイントでしょう。</p> <p>第5 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%B7%D0%BA%D1%BB%BA%B6%C8%BE%CA">経済産業省</a>所管事業分野における相談窓口(p.7)では、</p> <blockquote><p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%B7%D0%BA%D1%BB%BA%B6%C8%BE%CA">経済産業省</a>所管事業分野に係る相談窓口は以下のとおり。<br/> (所管事業分野に係るもの)<br/> ○<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B7%D0%BA%D1%BB%BA%B6%C8%BE%CA">経済産業省</a> 本省 業所管課室(別表1)</p></blockquote> <p>別表1(p.7~9)というものが追加されています。以下にそのまま記載してみましたが、実に多岐にわたりますね。</p> <table> <caption>別表1 本省</caption> <tbody> <tr> <th colspan=2>事業分野<th>相談窓口 </tr> <tr> <td>製造業</td><td>印刷業</td><td>商務情報政策局<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C6%A5%F3%A5%C4%BB%BA%B6%C8">コンテンツ産業</a>課</td> </tr> <tr> <td rowspan=3>電気・ガス・熱供給</td><td>電気</td><td>電力・ガス取引監視等委員会相談窓口</td> </tr> <tr> <td rowspan=2>ガス</td><td> (プロパンガスに係ること)<br><a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%F1%B8%BB%A5%A8%A5%CD%A5%EB%A5%AE%A1%BC%C4%A3">資源エネルギー庁</a>資源・燃料部燃料流通政策室</td> </tr> <tr> <td>(都市ガスに係ること)<br>電力・ガス取引監視等委員会相談窓口</td> </tr> <tr> <td><a class="keyword" href="https://d.hatena.ne.jp/keyword/%BE%F0%CA%F3%C4%CC%BF%AE%B6%C8">情報通信業</a></td><td>情報サービス(ソフトウェア作成業等)</td><td>商務情報政策局情報産業課ソフトウェア・情報サービス戦略室</td> </tr> <tr> <td rowspan=2>運輸、郵便</td><td rowspan=2>通関業(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B3%B0%B0%D9%CB%A1">外為法</a>関連貨物の場合)</td> <td>(安全保障関連貨物・技術関連(輸出/取引許可)に係ること)<br>貿<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B0%D7%B7%D0">易経</a>済協力局安全保障貿易審査課</td> </tr> <tr> <td>(上記以外の輸出入承認/取引許可に係ること)<br>貿<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B0%D7%B7%D0">易経</a>済協力局貿易審査課</td> </tr> <tr> <td rowspan=13>卸売・小売</td><td>繊維・衣類等卸売</td><td>製造産業局生活製品課</td> </tr> <tr> <td>建築材料、鉱物・金属材料等卸売</td> <td>(建築材料に係ること)製造産業局生活製品課住宅産業室<br>(鉱物に係ること)<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%F1%B8%BB%A5%A8%A5%CD%A5%EB%A5%AE%A1%BC%C4%A3">資源エネルギー庁</a>資燃部鉱物資源課</td> </tr> <tr> <td>農業用機械器具卸売</td><td>(農業機械に係ること)<br>製造産業局産業機械課</td> </tr> <tr> <td>自動車卸売・小売</td><td>製造産業局自動車課</td> </tr> <tr> <td>自転車卸売・小売</td><td>製造産業局車両室</td> </tr> <tr> <td>電気機械器具、その他の機械器具卸売</td><td>(民生用に係ること)商務情報政策局情報産業課<br>(産業用に係ること)製造産業局産業機械課</td> </tr> <tr> <td>化粧品卸売・小売</td><td>商務・サービスグループ生物化学産業課</td> </tr> <tr> <td>ペット用品小売</td><td>製造産業局生活製品課</td> </tr> <tr> <td>百貨店・デパート、総合スーパー、ショッピングセンター</td><td>商務・サービスグループ消費・流通政策課</td> </tr> <tr> <td><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%D3%A5%CB%A5%A8%A5%F3%A5%B9%A5%B9%A5%C8%A5%A2">コンビニエンスストア</a></td><td>商務・サービスグループ消費・流通政策課</td> </tr> <tr> <td>ホームセンター</td><td>製造産業局生活製品課住宅産業室</td> </tr> <tr> <td>ガソリンスタンド</td><td><a class="keyword" href="https://d.hatena.ne.jp/keyword/%BB%F1%B8%BB%A5%A8%A5%CD%A5%EB%A5%AE%A1%BC%C4%A3">資源エネルギー庁</a>資源・燃料部燃料流通政策室</td> </tr> <tr> <td>通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BF%AE%C8%CE">信販</a>売</td><td>商務・サービスグループ消費・流通政策課</td> </tr> <tr> <td>金融、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CA%DD%B8%B1%B6%C8">保険業</a></td><td>クレジットカード業</td><td>(キャッシングサービス以外に係ること)<br>商務・サービスグループキャッシュレス推進室</td> </tr> <tr> <td>不動産、物品賃貸業</td><td>リース業</td><td>商務・サービスグループ消費経済企画室</td> </tr> <tr> <td rowspan=2>学術研究、専門・技術サービス業</td><td>広告業</td><td>商務情報政策局<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C6%A5%F3%A5%C4%BB%BA%B6%C8">コンテンツ産業</a>課</td> </tr> <tr> <td>写真館</td><td>商務・サービスグループサービス政策課</td> </tr> <tr> <td rowspan=10>生活関連サービス、娯楽業</td><td><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A8%A5%B9">エス</a>テティック業</td><td>商務・サービスグループヘルスケア産業課</td> </tr> <tr> <td>リ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E9%A5%AF">ラク</a>ゼーション業</td><td>商務・サービスグループヘルスケア産業課</td> </tr> <tr> <td>ネイルサービス業</td><td>商務・サービスグループサービス政策課</td> </tr> <tr> <td>葬儀業</td><td>商務・サービスグループサービス政策課</td> </tr> <tr> <td>結婚式場業</td><td>商務・サービスグループサービス政策課</td> </tr> <tr> <td>競輪場、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BE%AE%B7%BF%BC%AB%C6%B0%BC%D6">小型自動車</a>の競走場</td><td>製造産業局車両室</td> </tr> <tr> <td>フィットネスクラブ</td><td>商務・サービスグループヘルスケア産業課</td> </tr> <tr> <td>ゴルフ場、ゴルフ練習場、テニスクラブ、ボーリング場</td><td>商務・サービスグループサービス政策課</td> </tr> <tr> <td>遊園地<td>商務・サービスグループクールジャパン政策課</td> </tr> <tr> <td><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AB%A5%E9%A5%AA%A5%B1%A5%DC%A5%C3%A5%AF%A5%B9">カラオケボックス</a><td>商務情報政策局<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C6%A5%F3%A5%C4%BB%BA%B6%C8">コンテンツ産業</a>課 </tr> <tr> <td rowspan=2>教育、学習支援業<td>学習塾<td>商務・サービスグループサービス政策課 </tr> <tr> <td>習い事教室<td>(<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B1%D1%B2%F1%CF%C3%B6%B5%BC%BC">英会話教室</a>等に係ること)<br>商務・サービスグループサービス政策課 </tr> <tr> <td rowspan=2>サービス業(他に分類されないもの)<td>コールセンター<td>商務・サービスグループサービス政策課 </tr> <tr> <td>展示会企画・運営<td>商務・サービスグループクールジャパン政策課 </tr> </tbody> </table> <p>ただ、相談窓口こそ、業種にわかれて記載されているのですけれども、(4)環境の整備との関係では、</p> <blockquote><p>法第5条においては、個別の場面において、個々の障害者に対して行われる合理的配慮を的確に行うための不特定多数の障害者を主な対象として行われる事前的改善措置(施設や設備の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化、意思表示やコミュニケーションを支援するためのサービス・介助者等の人的支援、障害者による円滑な情報の取得・利用・発信のための情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等)を、環境の整備として事業者の努力義務としている。環境の整備においては、新しい技術開発が投資負担の軽減をもたらすこともあることから、技術進歩の動向を踏まえた取組が期待される。また、ハード面のみならず、職員に対する研修や、規程の整備等の対応も含まれることが重要である。</p> <p>障害を理由とする差別の解消のための取組は、法や<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%E2%CE%F0%BC%D4%A1%A2%BE%E3%B3%B2%BC%D4%C5%F9%A4%CE%B0%DC%C6%B0%C5%F9%A4%CE%B1%DF%B3%EA%B2%BD%A4%CE%C2%A5%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">高齢者、障害者等の移動等の円滑化の促進に関する法律</a>(平成 18 年法律第 91 号)等不特定多数の障害者を対象とした事前的な措置を規定する法令に基づくこのような環境の整備に係る施策や取組を着実に進め、環境の整備と合理的配慮の提供を両輪として進めることが重要である。</p> <p>環境の整備は、不特定多数の障害者向けに事前的改善措置を行うものであるが、合理的配慮は、環境の整備を基礎として、その実施に伴う負担が過重でない場合に、特定の障害者に対して、個別の状況に応じて講じられる措置である。したがって、各場面における環境の整備の状況により、合理的配慮の内容は異なることとなる。合理的配慮の提供と環境の整備の関係に係る一例は別紙のとおりである。</p> <p>なお、多数の障害者が直面し得る社会的障壁をあらかじめ除去するという観点から、他の障害者等への波及効果についても考慮した環境の整備を行うことは有効である。また環境の整備は、障害者との関係が長期にわたる場合においても、その都度の合理的配慮の提供が不要となるという点で、中・長期的なコストの削減・効率化にも資することとなる。</p></blockquote> <p>基本指針をだいたい引っ張ってきてる感じですね。「各場面における環境の整備の状況により、合理的配慮の内容は異なることとなる。合理的配慮の提供と環境の整備の関係に係る一例は別紙のとおりである。」とあって、別紙に具体例が示されるわけですが、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>のように、別紙に記載されている例示が業種に分かれてないという。</p> <p>たとえば、対面の小売業と、オンラインの通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%BF%AE%C8%CE">信販</a>売業では、求められるものが異なってくると思うのですが、画一で示して本当にいいんですかねえ…。まあ、障害者当事者団体が物申す場面だとは思いますけど。</p> <p>とまあ、こんな感じでこれから各省庁の対応指針の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D1%A5%D6%A5%B3%A5%E1">パブコメ</a>がたくさんできてます。興味のある方は<a href="https://public-comment.e-gov.go.jp/servlet/Public">e-Gov パブリック・コメント</a>を観測しつつ、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D1%A5%D6%A5%B3%A5%E1">パブコメ</a>を送ってみてはいかがでしょうか。</p> <div class="footnote"> <p class="footnote"><a href="#fn-51d692a1" name="f-51d692a1" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">基本方針と対応指針の関係性については、<a href="https://www.cao.go.jp/press/new_wave/20230331_00008.html">障害者差別解消法に基づく基本方針の改定</a>にある、<a href="https://www.cao.go.jp/press/new_wave/20230331_00008.html">障害者差別解消法に基づく基本方針の改定</a>の「第4 事業者が講ずべき障害を理由とする差別を解消するための措置に関する基本的な事項」に具体的に書かれています。</span></p> <p class="footnote"><a href="#fn-d00c60d9" name="f-d00c60d9" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">こんな感じで各省庁ごとに所管事業が異なるわけですから、情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>にだけ着目するとしても、各省庁分だけ見ていく必要があるわけですね…。これが縦割り行政というやつですかね。</span></p> <p class="footnote"><a href="#fn-02a6ab7b" name="f-02a6ab7b" class="footnote-number">*3</a><span class="footnote-delimiter">:</span><span class="footnote-text">忘れがちですが、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A4%BE%DD%C4%A3">気象庁</a>は<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の外局です。</span></p> </div> momdo メモ:我が国の9割以上の学術団体はウェブサイトのアクセシビリティに対するアクションをしていない hatenablog://entry/820878482947948414 2023-07-07T20:38:02+09:00 2023-07-07T20:38:02+09:00 元ネタ:CA2040 – 学術雑誌のアクセシビリティ:現状と課題 / 植村八潮 | カレントアウェアネス・ポータル https://current.ndl.go.jp/ca2040 元ネタの元ネタ:専修大学学術機関リポジトリ:SI-Box 学術情報・コミュニケーションにおけるアクセシビリティの現状と課題 : 学協会を対象とした質問紙調査を通して https://senshu-u.repo.nii.ac.jp/?action=pages_view_main&active_action=repository_view_main_item_detail&item_id=12916&item_no=1… <p>元ネタ:CA2040 – 学術雑誌の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>:現状と課題 / 植村八潮 | カレント<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%A6%A5%A7%A5%A2%A5%CD%A5%B9">アウェアネス</a>・ポータル<br/> <a href="https://current.ndl.go.jp/ca2040">https://current.ndl.go.jp/ca2040</a></p> <p>元ネタの元ネタ:<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%EC%BD%A4%C2%E7%B3%D8">専修大学</a>学術機関<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EA%A5%DD%A5%B8%A5%C8%A5%EA">リポジトリ</a>:SI-Box 学術情報・コミュニケーションにおける<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の現状と課題 : 学協会を対象とした質問紙調査を通して<br/> <a href="https://senshu-u.repo.nii.ac.jp/?action=pages_view_main&amp;active_action=repository_view_main_item_detail&amp;item_id=12916&amp;item_no=1&amp;page_id=13&amp;block_id=21">https://senshu-u.repo.nii.ac.jp/?action=pages_view_main&amp;active_action=repository_view_main_item_detail&amp;item_id=12916&amp;item_no=1&amp;page_id=13&amp;block_id=21</a></p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>「対応」という言い回しが果たして適当なのかはさておき、元ネタでは、</p> <blockquote><p>筆者らは2021年8月30日から9月13日にかけて、学協会1,958団体を対象に、<a class="keyword" href="https://d.hatena.ne.jp/keyword/Google">Google</a> Formによる質問紙調査を実施した。うち316団体から回答があり、回収率は16.1%であった。</p> <p>回答のあった316団体のうち、紙媒体で学協会誌を発行しているのは270団体で、そのうち、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応を「している」と答えた団体は18団体にすぎない。</p></blockquote> <p>270団体を分母としても、(具体的には何をしているのかはさておき、)せいぜい6.7%しか、なにがしかの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のアクションをしていないということになります。</p> <p>もう少し詳しいことは元ネタの元ネタにあって、</p> <blockquote><p>2.2 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>等の有無<br/> 全体の 316 団体のうち,学協会誌,研究大会,Web サイト等の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>やマニュアルが「ある」と回答した団体が 6 団体,(以下略)</p></blockquote> <p>ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>等が存在する団体は、2%に満たないという計算になります。</p> <p>一見<a class="keyword" href="https://d.hatena.ne.jp/keyword/Twitter">Twitter</a>あたりでウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>についてにわかに盛り上がっているように見えるものの、この紀要論文から考えると、学会の9割以上がウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に対して何もしていないと言えることになるでしょう、と。圧倒的にウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は認知されていないというのは正しい見方であると思うので、まずはここをきっちりおさえる必要があるでしょう…。</p> <p>それはそれとして、この紀要論文の著者も、緩やかにウェブ業界で合意が取られていると思っているウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>と同じものを思い描いているかというと、怪しい面はありますが…。</p> <p>ウェブ業界が各方面に働きかけていく必要もあるでしょうけども、まずは<a href="https://www.jst.go.jp">JST</a>が頑張らないとどうしようもないのでは?という気もしたりしなかったりしますが、はてさて。</p> momdo 令和5年版障害者白書とアクセシビリティ hatenablog://entry/820878482944002038 2023-06-23T23:30:32+09:00 2023-06-23T23:30:32+09:00 6/20(火)に障害者白書が公開されていました。 令和5年版 障害者白書 全文(PDF版) https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/index-pdf.html 第1章 障害の有無により分け隔てられることのない共生社会の実現に向けた取組 第2節 障害者の自立及び社会参加の支援等のための施策の総合的かつ計画的な推進 https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/pdf/s1-2-1.pdf 1.第5次基本計画の策定の経緯 (1)第5次基本計画の… <p>6/20(火)に障害者白書が公開されていました。</p> <p>令和5年版 障害者白書 全文(PDF版)<br/> <a href="https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/index-pdf.html">https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/index-pdf.html</a></p> <p>第1章 障害の有無により分け隔てられることのない共生社会の実現に向けた取組<br/> 第2節 障害者の自立及び社会参加の支援等のための施策の総合的かつ計画的な推進<br/> <a href="https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/pdf/s1-2-1.pdf">https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/pdf/s1-2-1.pdf</a></p> <blockquote><p>1.第5次基本計画の策定の経緯<br/> (1)第5次基本計画の検討開始までの主な取組</p> <p>第4次基本計画では、我が国が障害者権利条約を批准した後に初めて策定される障害者基本計画として条約との整合性確保に留意しつつ、各分野に共通する横断的視点として、(中略)「社会のあらゆる場面における<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>(※1)の向上」(以下略)</p> <p>※1:<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><br/>    施設・設備、サービス、情報、制度等の利用しやすさのこと。</p></blockquote> <p>いつからそうなってたのか、は知らないですけれども、「利用しやすさ」とここではっきり書かれてしまうとなかなかつらいものがあるかなと思うところではあります。</p> <p><a href="https://gihyo.jp/book/2023/978-4-297-13366-5">Webアプリケーションアクセシビリティ</a>で「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>は利用しやすさ?」という投げかけがある<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup>ように、利用しやすいかどうかの手前に、利用できるかどうかというのが問われてくるだろう、という考え方ができます。言いかえるならば、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%E6%A1%BC%A5%B6%A5%D3%A5%EA%A5%C6%A5%A3">ユーザビリティ</a>の土台として<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>があって、まずそもそも利用できないものを利用できるようにするところからなのでは…というものです。ある種「本丸」である障害者白書が「利用しやすさ」という認識で本当に大丈夫なのかしら…。</p> <p>基本的に1.2節に書いていることは<a href="https://www8.cao.go.jp/shougai/suishin/wakugumi.html#kihon5">第5次障害者基本計画</a>に書いていることなので目新しいものはないという認識ですが、基本計画よりかは読みやすいと思います。<a href="https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/pdf/s1-2-4.pdf">1.2節 4/4</a>あたりには情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のことが書いてあって、実は障害者情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>・コミュニケーション施策推進法にそこそこ文章量が割かれているんだと改めて感じた次第です。</p> <p>とはいえ、法に基づく<a href="https://www8.cao.go.jp/shougai/suishin/jouhousyutoku.html#kaigi">障害者による情報取得等に資する機器等の開発及び普及の促進並びに質の向上に関する協議の場</a>の<a href="https://www8.cao.go.jp/shougai/suishin/jouhousyutoku/k_2/index.html">第2回</a>議事概要なんかは、読んでて頭を抱えたわけですが…なかなかに厳しいものがあるなぁ…というのが雑な感想ではあり。</p> <p>まあそのあたりは、2019年に書いてた<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>方面の記事<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>、<sup id="fnref:3"><a href="#fn:3" rel="footnote">3</a></sup>でもうっすら観測していたのですが、「利用しやすさ」と捉えるならそれはそうなるか…?というのが3年半越しの感想ではあるのですが、思っていたよりもこれはよろしくない…のかもしれません(1つの技術的な観点からとして)。</p> <p>さて、別の章に目を向けますと、</p> <p>第5章 住みよい環境の基盤づくり<br/> 第2節 障害のある人の情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を向上するための施策<br/> 「1.情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上」は<a href="https://www8.cao.go.jp/shougai/whitepaper/r05hakusho/zenbun/pdf/s5-2-1.pdf">5.2節 1/4</a>に書かれてるわけなのですけども、ここでは、</p> <blockquote><p>(4)ホームページ等の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>化の推進</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%ED%CC%B3%BE%CA">総務省</a>では、公的機関がウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>(障害のある人や高齢者を含め、誰もがホームページ等で提供される情報や機能を支障なく利用できること)の向上に取り組む際の手順書となる「みんなの公共サイト運用<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」(2016年)を策定し、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保・向上に取り組んでいる。</p></blockquote> <p>とあって、見出しの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>どこ行ったんですかね…というツッコミはできるにはできるわけです。ですけれども、本題はむしろ、「情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>」と「情報<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>」がごっちゃになっているというところでしょうか。これについては、WAICが出した<a href="https://waic.jp/news/20230214/">「障害者基本計画(第5次)案に関する意見募集について」へのパブリックコメント</a>の「コメント1」でいろいろ言っていたりします。</p> <p>その中で、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CA%BF%C0%AE26%C7%AF">平成26年</a>(2014年)1月30日付けの外務省訳の<a href="https://www.mofa.go.jp/mofaj/fp/hr_ha/page22_000899.html">権利条約</a>では、「第九条 施設及びサービス等の利用の容易さ」とあって、この翻訳はいかがなものかというのは国連審査でも指摘されています<sup id="fnref:4"><a href="#fn:4" rel="footnote">4</a></sup>。つまり、2014年には「利用しやすさ」という正確とは言いがたい翻訳がなされてしまっていると言えるでしょうと。</p> <p>ところで、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%CE%A9%B9%F1%B8%EC%B8%A6%B5%E6%BD%EA">国立国語研究所</a>「外来語」委員会が<a href="https://www2.ninjal.ac.jp/gairaigo/Teian1_4/index.html">「外来語」言い換え提案</a>というものを平成18年(2006年)に出しており、そこでは<a href="https://www2.ninjal.ac.jp/gairaigo/Teian1_4/Words/accessibility.gen.html">アクセシビリティー</a>の語が立っており、言い換え語として「利用しやすさ」というものが提案されていたりします…ゴンお前だったのか(?)</p> <p>いずれにせよ、条約が批准された2014年には「利用しやすさ」という微妙にaccessibilityの持つだろう意味とは異なったものが当てはめられており、これが政策を歪めてしまっているのでは?というのが現時点での筆者の見解です。</p> <p>ちなみに中国語では<a href="https://cjjc.weblio.jp/content/%E5%8F%AF%E8%BE%BE%E6%80%A7">可达性</a>(可達性)という語が当てられているそうで、このほうがより<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>をうまく表せているのでは?という説が一部であったりなかったりするようです。</p> <hr /> <p>あと、</p> <p>(メモ)「2030年頃を見据えた情報通信政策の在り方」二次答申(案)に関する意見募集とか<br/> <a href="https://momdo.hatenablog.jp/entry/20230509/1683590173">https://momdo.hatenablog.jp/entry/20230509/1683590173</a></p> <p>のアンサーが出てるぞ、ってマックでJKが言ってた。</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%ED%CC%B3%BE%CA">総務省</a>|報道資料|「2030年頃を見据えた情報通信政策の在り方」<br/> <a href="https://www.soumu.go.jp/menu_news/s-news/01ryutsu20_02000001_00007.html">https://www.soumu.go.jp/menu_news/s-news/01ryutsu20_02000001_00007.html</a></p> <p>「2030年頃を見据えた情報通信政策の在り方」 二次答申(案)に対する御意見及びその考え方(案)<br/> <a href="https://www.soumu.go.jp/main_content/000883921.pdf">https://www.soumu.go.jp/main_content/000883921.pdf</a></p> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> 当該の4ページは公開されているサンプルPDFファイルで読むことができます。<a href="#fnref:1" rev="footnote">&#8617;</a></li> <li id="fn:2"> 2019-10-03 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>の交通<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>方面の検討会でウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する議事概要が結構<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%EC%A5%B2">アレゲ</a>な件 <a href="https://momdo.hatenablog.jp/entry/20191003/1570112620">https://momdo.hatenablog.jp/entry/20191003/1570112620</a><a href="#fnref:2" rev="footnote">&#8617;</a></li> <li id="fn:3"> 2019-11-04 手話の話を枕に、例の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B9%F1%B8%F2%BE%CA">国交省</a>検討会の議事概要から <a href="https://momdo.hatenablog.jp/entry/20191104/1572793585">https://momdo.hatenablog.jp/entry/20191104/1572793585</a><a href="#fnref:3" rev="footnote">&#8617;</a></li> <li id="fn:4"> 2022-09-10 (メモ)障害者権利条約 1回目対日国連審査の資料まとめ <a href="https://momdo.hatenablog.jp/entry/20220910/1662784517">https://momdo.hatenablog.jp/entry/20220910/1662784517</a><a href="#fnref:4" rev="footnote">&#8617;</a></li> </ol> </div> momdo ちょっぴり哀しいカレントアウェアネス-E hatenablog://entry/820878482942221464 2023-06-16T22:54:45+09:00 2023-06-16T22:54:45+09:00 E2603 – アクセシビリティに関する米国図書館協会の報告書 というのがたまたまTLで流れてきたので、ざっくり読んだけんですけども、ウェブアクセシビリティ関連でちょっと哀しみを覚えたので… ウェブコンテンツ、PDF 1996年、Web Accessibility Initiative(WAI)が設立され、その3年後に最初のウェブアクセシビリティに関するガイドラインであるWeb Content Accessibility Guidelines(WCAG)1.0が発表された。WCAGは、ウェブアクセシビリティの4原則として、全てのユーザーにとって、知覚可能であること、容易に操作できること、容易に… <p><a href="https://current.ndl.go.jp/e2603">E2603 – アクセシビリティに関する米国図書館協会の報告書</a></p> <p>というのがたまたまTLで流れてきたので、ざっくり読んだけんですけども、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>関連でちょっと哀しみを覚えたので…</p> <blockquote><p>ウェブコンテンツ、PDF<br/> 1996年、Web Accessibility Initiative(WAI)が設立され、その3年後に最初のウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>であるWeb Content Accessibility Guidelines(WCAG)1.0が発表された。WCAGは、ウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の4原則として、全てのユーザーにとって、知覚可能であること、容易に操作できること、容易に理解できること、技術的に堅固であることを定めている。</p> <p>PDFの<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の問題については多くの研究者が指摘している。PDFは、適切な設定でアクセシブルになるが、実際は多くの学術論文のPDFにおいて、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>への配慮が十分でない。</p></blockquote> <p>元の記事は文献の紹介であり<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup>、どうやらこれを書いたのは大学院生みたいなのですがそれはさておき、たとえウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が専門じゃないにしても、もうちょっとこう頑張ってほしいところ。</p> <p>紹介された<a href="https://www.ala.org/news/member-news/2022/10/ala-and-knology-explore-disability-and-accessibility-accessibility-libraries">文献</a>(のPDF)ではWeb Contentとして3ページ弱の内容が割かれてますけれども、これを1段落にまとめるにしても、WCAG 1.0が(WCAG 2.0の)4つの原則を持っているようにまとめてしまっている状態なわけであり。このあたりはWCAG(の歴史)にある程度触れていればおかしなことに気付くと思われますが、予備知識なしには難しいものなのか…もしれない<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>。もうWCAG 1.0は廃止されましたしね…。</p> <p>ただまあ、PDFの要約はそこそこな感じに圧縮してるんだよなぁ。どうしてこうなった。</p> <p>それにしても、原文PDFは<a href="https://check.axes4.com/en/result/46e88f6f-84d2-4b58-9b7a-422ce966a299">check.axes4.com</a>によるチェックでコケるあたりが皮肉というか何というか。</p> <p>ちなみに原文はCC BY-NC-NDということもあり、参考までにWeb Contentのセクションをそのままはっ付けておきます。<a class="keyword" href="https://d.hatena.ne.jp/keyword/%B5%A1%B3%A3%CB%DD%CC%F5">機械翻訳</a>するなりしてお楽しみください。</p> <blockquote><p>Web Content</p> <p>In 1996, several members of the <a class="keyword" href="https://d.hatena.ne.jp/keyword/World%20Wide%20Web">World Wide Web</a> Consortium (<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>) turned their attention towards web accessibility, ultimately founding the Web Accessibility Initiative (WAI) (Dardailler, 2009). Three years later, the first set of web content accessibility guidelines was released as WCAG 1.0 (Chisholm, Vanderheiden, &amp; Jacobs, 1999). In 1998, the Rehabilitation Act was amended by Congress to include Sect. 508, which required federal agencies to make electronic and information services accessible to people with disabilities (GSA, 2018). Today, library websites serve as a critical point of <a class="keyword" href="https://d.hatena.ne.jp/keyword/access">access</a> to library information and services for disabled and neurodivergent individuals and communities.</p> <p>WCAG 2.0 was released on December 11, 2008. These updated guidelines were designed to “make content accessible to a wider range of people with disabilities, including blindness and low <a class="keyword" href="https://d.hatena.ne.jp/keyword/vision">vision</a>, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity and combinations of these” (Caldwell et al., 2008). The WCAG 2.0 effort included a large-scale reimagination of the former 1.0 guidelines, including the addition of “success criteria,” which were added to simplify the testing process. The release of WCAG 2.0 also saw the introduction of three conformance levels—A, AA, AAA— where Level A represents “the minimum level of conformance” and Level AAA represents conformance with all success criteria (<a class="keyword" href="https://d.hatena.ne.jp/keyword/W3C">W3C</a>, 2016).</p> <p>Furthermore, WCAG provides four principles for web accessibility. The first principle, perceivability, means that the content and interface of a <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a> must be perceivable by all users. The second principle, operability, means that the elements of the <a class="keyword" href="https://d.hatena.ne.jp/keyword/user%20interface">user interface</a> must be easily operable by all users. The third principle, understandability, means that the content and controls of the <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a> must be easily understood by all users. The final principle is that of robustness: content must be technically robust such that it can be perceived by, operated on, and understood by users with current and future technologies, including assistive technologies. Currently, in the United States, laws requiring web accessibility in a growing number of public accommodations, institutions, and agencies (such as public libraries, colleges, and universities) are harmonized with WCAG 2.0 conformance Level AA (Kuykendall, 2017).</p> <p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Most">Most</a> of the research on library accessibility is focused on accessible web content, particularly on academic library sites. Some research, such as that elaborated in Comeaux and Schmetzke (2013), shows that even while libraries intend to make their web content accessible to patrons with disabilities, many still struggle to reach WCAG guidelines. Comeaux and Schmetzke evaluated 56 academic library websites for two years in North America and found around 60% of the libraries’ web pages complied with WCAG 1.0 guidelines. Similarly, Khawaja (2022) recently evaluated the accessibility of a total of 120 public library <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a> URLs in the United States using an evaluation tool for testing WCAG 2.1 <a class="keyword" href="https://d.hatena.ne.jp/keyword/compliance">compliance</a>. Their results showed that public library websites overwhelmingly failed to meet the accessibility standards required by law in Sect. 508 of the Rehabilitation Act.</p> <p>Mulliken (2019) interviewed blind academic library users to understand the barriers they experienced when accessing academic library websites using screen readers. They found that although participants found the library <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a> materials accessible, they could not easily navigate the web pages due to a steep learning curve, which prevented them from being able to successfully use the <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a>. A study by Liu, Bielefeld, and McKay (2017) evaluated urban public library <a class="keyword" href="https://d.hatena.ne.jp/keyword/website">website</a> homepages and uncovered a variety of issues across 219 library websites. The <a class="keyword" href="https://d.hatena.ne.jp/keyword/most">most</a> common errors were websites missing <a class="keyword" href="https://d.hatena.ne.jp/keyword/alternative">alternative</a> text and form labels. In another study, Graves and German (2018) found that few accessible pages provided instructions for accessing library programs and services for those with accommodation needs. Likewise, Vaughan and Warlick (2020) examined a sample of websites from 40 four-year academic institutions and evaluated them based on the presence of 12 types of content, which included things like an accessibility statement, accessibility information, and disability services. They found that fewer than half of the web pages included seven of these 12 content types, and that the majority of the academic library web pages did not contain a single accessible web page at all. Clearly then, despite the array of research published on library web accessibility, accessibility issues continue to be commonly found on library web pages (Brunskill, et al., 2021; Yang et al., 2020).</p></blockquote> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> カレント<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%A6%A5%A7%A5%A2%A5%CD%A5%B9">アウェアネス</a>-Eはそういう立ち位置らしい <a href="https://current.ndl.go.jp/cae">https://current.ndl.go.jp/cae</a><a href="#fnref:1" rev="footnote">&#8617;</a></li> <li id="fn:2"> そうはいっても、日本語版<a class="keyword" href="https://d.hatena.ne.jp/keyword/Wikipedia">Wikipedia</a>にはある程度のことは書かれてるんだよなぁ… <a href="https://ja.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines">https://ja.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines</a><a href="#fnref:2" rev="footnote">&#8617;</a></li> </ol> </div> momdo (メモ)「2030年頃を見据えた情報通信政策の在り方」二次答申(案)に関する意見募集とか hatenablog://entry/4207575160647339044 2023-05-09T08:56:13+09:00 2023-05-09T08:56:13+09:00 こういうところにアクセシビリティを突っ込んでいく必要があると思うんですよ。 「2030年頃を見据えた情報通信政策の在り方」二次答申(案)に関する意見募集 https://www.soumu.go.jp/menu_news/s-news/01ryutsu20_02000001_00003.html 令和5年5月24日(水)必着とのこと。週末に考えますか。 あと、以前にも触れたハザードマップのユニバーサルデザインに関する検討会については報告書が出てきたので、なんか振り返ろうとおもいましたが、「敗戦処理」っぽさがあるのがなんとも…。 いずれにせよ、こういうところにもウェブアクセシビリティの専門家が入… <p>こういうところに<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を突っ込んでいく必要があると思うんですよ。</p> <p>「2030年頃を見据えた情報通信政策の在り方」二次答申(案)に関する意見募集 <a href="https://www.soumu.go.jp/menu_news/s-news/01ryutsu20_02000001_00003.html">https://www.soumu.go.jp/menu_news/s-news/01ryutsu20_02000001_00003.html</a></p> <p>令和5年5月24日(水)必着とのこと。週末に考えますか。</p> <p>あと、以前にも触れた<a href="https://www.mlit.go.jp/river/shinngikai_blog/universal_design/index.html">ハザードマップのユニバーサルデザインに関する検討会</a>については報告書が出てきたので、なんか振り返ろうとおもいましたが、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C7%D4%C0%EF%BD%E8%CD%FD">敗戦処理</a>」っぽさがあるのがなんとも…。</p> <p>いずれにせよ、こういうところにもウェブ<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門家が入り込んでいかないと、という感想ですかね。デジタル庁仕事しろ案件だとも思うけど。</p> momdo (メモ)「高齢者・障害者等に配慮した電気通信アクセシビリティガイドライン 第2版」は有効な文書なのか? hatenablog://entry/4207112889985500418 2023-04-29T12:50:09+09:00 2023-04-29T12:50:09+09:00 いろいろあって、JISハンドブック JIS HB 38 高齢者・障害者等 2022を眺めてたのですが、その中に「高齢者・障害者関連法規及びガイドラインの一覧」*1というのがあります。そこでは、情報通信アクセス協議会*2が策定した高齢者・障害者等に配慮した電気通信アクセシビリティガイドライン 第2版という文書が案内されています。 このガイドラインは平成16年(2004年)に作られたものなのですが、電気通信アクセシビリティガイドライン策定等への取組みというページを見ると、JIS X 8341-4とITU-T F.790に発展解消したようにも見えます。このガイドラインは依然として有効な文書なのか、置… <p>いろいろあって、<a href="https://webdesk.jsa.or.jp/books/W11M0100/index/?syohin_cd=318924">JISハンドブック JIS HB 38 高齢者・障害者等 2022</a>を眺めてたのですが、その中に「高齢者・障害者関連法規及び<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>の一覧」<a href="#f-ba97fdfc" name="fn-ba97fdfc" title="p.2805">*1</a>というのがあります。そこでは、<a href="https://www.ciaj.or.jp/access/">情報通信アクセス協議会</a><a href="#f-501482e0" name="fn-501482e0" title="実はWAICの上部組織だったりします">*2</a>が策定した<a href="https://www.ciaj.or.jp/access/Guide2/index.html">高齢者・障害者等に配慮した電気通信アクセシビリティガイドライン 第2版</a>という文書が案内されています。</p> <p>この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>は平成16年(2004年)に作られたものなのですが、<a href="https://www.ciaj.or.jp/access/Torikumi/index.html">電気通信アクセシビリティガイドライン策定等への取組み</a>というページを見ると、JIS X 8341-4と<a class="keyword" href="https://d.hatena.ne.jp/keyword/ITU-T">ITU-T</a> F.790に発展解消したようにも見えます。この<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>は依然として有効な文書なのか、置き換えられて廃止されたのか、というのが気になりましたというだけのお話です。まあ、JISハンドブックに載っているのですから、依然として有効なのかもしれません。19年前の文書に意味があるのかという話もありますが。</p> <div class="footnote"> <p class="footnote"><a href="#fn-ba97fdfc" name="f-ba97fdfc" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">p.2805</span></p> <p class="footnote"><a href="#fn-501482e0" name="f-501482e0" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">実はWAICの上部組織だったりします</span></p> </div> momdo 障害者差別解消法の「基本方針」改定と、第5次障害者基本計画の閣議決定。 hatenablog://entry/4207112889971485773 2023-03-15T00:20:52+09:00 2023-03-19T08:27:50+09:00 またの名をパブコメ結果発表。あるいはここ1、2年ぐらい当ブログであれこれ書いてた結果とも。 令和5年3月14日(火)定例閣議案件 | 閣議 | 首相官邸ホームページ https://www.kantei.go.jp/jp/kakugi/2023/kakugi-2023031401.html 一般案件 障害を理由とする差別の解消の推進に関する基本方針の変更について(決定) (内閣府本府) 障害者基本計画(第5次)について(決定) (同上) 障害を理由とする差別の解消の推進に関する基本方針(改定案)へのパブリックコメントを提出しました | アクセシビリティBlog | ミツエーリンクス https… <p>またの名を<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D1%A5%D6%A5%B3%A5%E1">パブコメ</a>結果発表。あるいはここ1、2年ぐらい当ブログであれこれ書いてた結果とも。</p> <p>令和5年3月14日(火)<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C4%EA%CE%E3%B3%D5%B5%C4">定例閣議</a>案件 | <a class="keyword" href="http://d.hatena.ne.jp/keyword/%B3%D5%B5%C4">閣議</a> | <a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%F3%C1%EA%B4%B1%C5%A1">首相官邸</a>ホームページ<br/> <a href="https://www.kantei.go.jp/jp/kakugi/2023/kakugi-2023031401.html">https://www.kantei.go.jp/jp/kakugi/2023/kakugi-2023031401.html</a></p> <blockquote><p>一般案件<br/> 障害を理由とする差別の解消の推進に関する基本方針の変更について(決定)<br/> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a>本府)<br/> 障害者基本計画(第5次)について(決定)<br/> (同上)</p></blockquote> <hr /> <p>障害を理由とする差別の解消の推進に関する基本方針(改定案)への<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D1%A5%D6%A5%EA%A5%C3%A5%AF%A5%B3%A5%E1%A5%F3%A5%C8">パブリックコメント</a>を提出しました | <a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>Blog | <a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DF%A5%C4%A5%A8%A1%BC%A5%EA%A5%F3%A5%AF%A5%B9">ミツエーリンクス</a><br/> <a href="https://www.mitsue.co.jp/knowledge/blog/a11y/202301/24_0910.html">https://www.mitsue.co.jp/knowledge/blog/a11y/202301/24_0910.html</a></p> <p>障害を理由とする差別の解消の推進に関する基本方針(改定案)に関する意見募集について - <a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a><br/> <a href="https://www8.cao.go.jp/shougai/suishin/sabekai/kihonhoushin/iken.html">https://www8.cao.go.jp/shougai/suishin/sabekai/kihonhoushin/iken.html</a></p> <p>障害を理由とする差別の解消の推進 - <a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a> 基本方針<br/> <a href="https://www8.cao.go.jp/shougai/suishin/sabekai.html#houshin">https://www8.cao.go.jp/shougai/suishin/sabekai.html#houshin</a></p> <blockquote><p>オンラインでの申込手続が必要な場合に、手続を行うためのウェブサイトが障害者にとって利用しづらいものとなっていることから、手続に際しての支援を求める申出があった場合に、求めに応じて電話や電子メールでの対応を行う(合理的配慮の提供)とともに、以後、障害者がオンライン申込みの際に不便を感じることのないよう、ウェブサイトの改良を行う(環境の整備)。</p></blockquote> <p>こちらは原案どおりでした。ちなみに<a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a>のP50にこの文言そのものが記載されているのは読者諸氏がご存じのとおりかと思います<a href="#f-df2b40e9" name="fn-df2b40e9" title="この文言を本書につっ込んではどうかとレビュー時に口出ししたのは当アカウントだったりします">*1</a>。</p> <p>なお、この基本方針は、「<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律の施行の日から適用する。」とありますが、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a>では「※令和6年4月1日より施行」とあって、いつの間にか施行日が決まってました。</p> <p><ins>2020-03-19追記</ins></p> <p>上記の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B3%D5%B5%C4%B7%E8%C4%EA">閣議決定</a>で、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>も決定されたことによります。</p> <p>インターネット官報 令和5年3月17日(号外 第53号)<br/> <a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律の施行期日を定める<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>(六〇) <a href="https://kanpou.npb.go.jp/20230317/20230317g00053/20230317g000530000f.html">https://kanpou.npb.go.jp/20230317/20230317g00053/20230317g000530000f.html</a></p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律の施行期日を定める<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>(令和5年<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第60号)<br/> <a href="https://www8.cao.go.jp/shougai/suishin/sabekai.html#law">https://www8.cao.go.jp/shougai/suishin/sabekai.html#law</a></p> <blockquote><p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>第六十号<br/> <a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律の施行期日を定める<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a><br/> 内閣は、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律(令和三年法律第五十六 号)附則の規定に基づき、この<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a>を制定する。<br/> <a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%E3%B3%B2%A4%F2%CD%FD%CD%B3%A4%C8%A4%B9%A4%EB%BA%B9%CA%CC%A4%CE%B2%F2%BE%C3%A4%CE%BF%E4%BF%CA%A4%CB%B4%D8%A4%B9%A4%EB%CB%A1%CE%A7">障害を理由とする差別の解消の推進に関する法律</a>の一部を改正する法律の施行期日は、令和六年<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%CD%B7%EE%B0%EC%C6%FC">四月一日</a> とする。</p></blockquote> <hr /> <p>「障害者基本計画(第5次)案に関する意見募集について」への<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D1%A5%D6%A5%EA%A5%C3%A5%AF%A5%B3%A5%E1%A5%F3%A5%C8">パブリックコメント</a>を提出しました | ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>基盤委員会(WAIC)<br/> <a href="https://waic.jp/news/20230214/">https://waic.jp/news/20230214/</a></p> <p>障害者基本計画(第5次)案に関する意見募集について - <a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%E2%B3%D5%C9%DC">内閣府</a><br/> <a href="https://www8.cao.go.jp/shougai/keikaku5th_iken.html">https://www8.cao.go.jp/shougai/keikaku5th_iken.html</a></p> <blockquote><p>企業等が自社で開発するデジタル機器・サービスが情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>基準(JIS X 8341 シリーズ等)に適合しているかどうかを自己評価するチェックシートである「情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式」(通称:「日本版 VPAT」)等の普及展開を促進する。また、引き続き、デジタル・ガバメント推進標準<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に則り、政府情報システムに係る調達において当該様式などを用いて、障害の種類・程度を考慮した確認を求める。[3-(1)-4]</p></blockquote> <p>障害者基本計画(第5次計画 令和5年度~令和9年度)<br/> <a href="https://www8.cao.go.jp/shougai/suishin/wakugumi.html#kihon5">https://www8.cao.go.jp/shougai/suishin/wakugumi.html#kihon5</a></p> <blockquote><p>企業等が自社で開発するデジタル機器・サービスが情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>基準(JIS X 8341 シリーズ等)に適合しているかどうかを自己評価するチェックシートである「情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式」等の普及展開を促進する。また、引き続き、デジタル・ガバメント推進標準<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>にのっとり、政府情報システムに係る調達において当該様式などを用いて、障害の種類・程度を考慮した確認を求める。[3-(1)-4]</p></blockquote> <p>現時点で実態にそぐわない<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C4%CC%BE%CE%CC%BE">通称名</a>が削除されました。よかった。</p> <p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/41OLWPRb75L._SL500_.jpg" class="hatena-asin-detail-image" alt="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus" title="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="http://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%20%CE%CF%CC%E9" class="keyword">伊原 力也</a>,<a href="http://d.hatena.ne.jp/keyword/%BE%AE%CE%D3%20%C2%E7%CA%E5" class="keyword">小林 大輔</a>,<a href="http://d.hatena.ne.jp/keyword/%CB%F1%C5%C4%20%C1%F0%B0%EC" class="keyword">桝田 草一</a>,<a href="http://d.hatena.ne.jp/keyword/%BB%B3%CB%DC%20%CE%E2" class="keyword">山本 伶</a></li><li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%B5%BB%BD%D1%C9%BE%CF%C0%BC%D2">技術評論社</a></li></ul><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div></p> <div class="footnote"> <p class="footnote"><a href="#fn-df2b40e9" name="f-df2b40e9" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">この文言を本書につっ込んではどうかとレビュー時に口出ししたのは当アカウントだったりします</span></p> </div> momdo Webアプリケーションアクセシビリティ発刊によせて hatenablog://entry/4207112889968434860 2023-03-04T21:04:58+09:00 2023-03-04T21:04:58+09:00 拙著HTML解体新書でレビューいただいた@sukoyakarizumuから声かけをいただいて、Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plusにレビュワーとして参加していました。すでに発売中で、なんでもすでに増刷がかかっているようです。よいことですね。 見本誌をご恵贈いただいていたので、発売前になにがしかブログ記事を書くのがいいよねと思いつつも、やっぱり最後まで読み通してからかな…とか思っていたら、結局最後まで目を通せずに今日まで来てしまいました。 ひととおり読むことが今日までできていない理由は、576ページという本書のボリュームにあり… <p>拙著<a href="https://www.amazon.co.jp/dp/B0BJ1SGBG5?tag=momdos35xreac-22&amp;linkCode=osi&amp;th=1&amp;psc=1">HTML解体新書</a>でレビューいただいた<a href="https://twitter.com/sukoyakarizumu">@sukoyakarizumu</a>から声かけをいただいて、<a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=osi&amp;th=1&amp;psc=1">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a>にレビュワーとして参加していました。すでに発売中で、なんでもすでに増刷がかかっているようです。よいことですね。</p> <p>見本誌をご恵贈いただいていたので、発売前になにがしかブログ記事を書くのがいいよねと思いつつも、やっぱり最後まで読み通してからかな…とか思っていたら、結局最後まで目を通せずに今日まで来てしまいました。</p> <p>ひととおり読むことが今日までできていない理由は、576ページという本書のボリュームにあります。このページ数でも著者陣が書きたかったものが全部収め切れなかったということで、紙面からこぼれ落ちたものが<a href="https://gihyo.jp/list/group/%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3%E3%82%92%E7%B5%84%E7%B9%94%E3%81%A7%E5%90%91%E4%B8%8A%E3%81%95%E3%81%9B%E3%82%8B%E2%94%80%E2%94%80%E7%A4%BE%E5%86%85%E5%A4%96%E3%81%AE%E8%AA%8D%E7%9F%A5-%E5%8A%B9%E6%9E%9C%E6%B8%AC%E5%AE%9A%E3%81%8B%E3%82%89-%E6%96%B0%E8%A6%8F%E9%96%8B%E7%99%BA%E3%81%B8%E3%81%AE%E7%B5%84%E3%81%BF%E8%BE%BC%E3%81%BF%E3%81%BE%E3%81%A7">アクセシビリティを組織で向上させる──社内外の認知・効果測定から、新規開発への組み込みまで 記事一覧 | gihyo.jp</a>に掲載されています。この連載で本書の「テンション」を掴むことができるかもしれません。</p> <p>そういうわけで通読できていないという状況ではあるのですが、せっかくなのでブログ記事としてしたためておくことにします。</p> <p>さて、この書籍はどういう内容なのか?については、「はじめに」の「本書の構成」で</p> <blockquote><p>本書の構成は、筆者たちがそれぞれの事業会社で経験した、Webアプリケーションの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を高めるための歩みをたどっています。</p></blockquote> <p>とあるのがある種すべて、といえます。著者陣の活動を<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C4%C9%C2%CE%B8%B3">追体験</a>できるともいえるでしょう。1.3節や1.5節で高齢者や障害者の統計データが見られるのは、<a href="https://twitter.com/magi1125">@magi1125</a>が<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>によるビジネス貢献を模索していた<a href="#f-acc8dc7d" name="fn-acc8dc7d" title="https://developers.freee.co.jp/entry/freee-a11y-2020とか">*1</a>中でかき集めたものなのかもしれません。7章でも<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を組織に根付かせるために著者陣がこれまでやってきた試行錯誤が見て取れます。</p> <p>また「本書の対象読者」では、</p> <blockquote><p>本書の主な対象読者は、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に興味のあるデザイナーやエンジニア、特にWebアプリケーションを開発している方です。</p></blockquote> <p>とあります。2章ではマシンリーダブルな実装はどういうものなのか、3章から5章にかけては、具体的なウェブサイト・アプリケーションのモジュールに対してどう実装していくのがよいのかがびっしり書かれています。</p> <p>これは裏を返せば、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>をWCAGの達成基準に当てはめてチェックするというロールについては、メインのターゲットにはならないことになります。つまり、これを読めばWCAGの達成基準について、直接的に理解が深まるわけではありません。しかし、本書はタイトルどおり、アプリケーションの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を高めるためのさまざまなエッセンスやチップスがこれでもかというくらいに詰め込んでいる書籍に仕上がっています。いうなれば、<a href="https://waic.jp/translations/WCAG21/Techniques/">WCAG 2.1達成方法集</a>や<a href="https://www.w3.org/WAI/ARIA/apg/">ARIA Authoring Practices Guide</a>を通して、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を身につけていくようなイメージといえるでしょう。</p> <p>さて、いくら実装を頑張ったところで、もともとのデザインが<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DD%A5%F3%A5%B3%A5%C4">ポンコツ</a>(?)だったならば、どう頑張ってもアクセシブルにはできません。ではどのように画面を設計をすればよいのか?それに対して8章が詳しく説明してくれています。筆者はこの方面に明るくないのですが、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B2%BC%CE%AE">下流</a>工程としての実装を強く意識しつつ、実装から見て上流となるUIデザインとウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を直接的に結び付ける章だと思っており、こういった観点での説明というのはほかではなかなか見られないのではないでしょうか。ここからさらに<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%F0%CA%F3%A5%A2%A1%BC%A5%AD%A5%C6%A5%AF%A5%C1%A5%E3">情報アーキテクチャ</a>(IA)にさかのぼっていくこともできるのかもしれません。</p> <p>付録では支援技術についてまとめられています。これだけの横断的に集められた資料もあまりないのかなと思います。とはいえ本書で、</p> <blockquote><p>多種多様なデ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%A4%A5%B9">バイス</a>やソフトウェアがありますが、どれも最終的には<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DD%A5%A4%A5%F3%A5%C6%A5%A3%A5%F3%A5%B0%A5%C7%A5%D0%A5%A4%A5%B9">ポインティングデバイス</a>による入力、あるいはキーボードによる入力に変換されて処理されます。</p></blockquote> <p>とあるように、大雑把に言ってしまえばマウスやキーボードのエミュレーションにしか過ぎません。一般に公開されたリソースでは、特定の障害特性を考えてウェブサイト・アプリケーションを作っているわけではないと思っています。支援技術を使っているユーザーを目の当たりにすることは、強烈な印象を与え、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を強く意識させてくれますが、その支援技術のユーザーのためだけにサイトやアプリケーションが存在しているわけではないでしょう。特定の支援技術の利用シーンに引っ張られすぎて、マウスをポチポチとクリックしてサイトやアプリケーションを使っている、支援技術を特段必要としないある種の典型的なユーザーのことを忘れないようにしたいところです。</p> <p>ところで話は跳躍しますが、それでは<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A1%BC%A5%C1%A5%E3%A5%EB%A5%EA%A5%A2%A5%EA%A5%C6%A5%A3">バーチャルリアリティ</a>(<a class="keyword" href="http://d.hatena.ne.jp/keyword/VR">VR</a>)、たとえば映画『<a href="https://wwws.warnerbros.co.jp/matrix-movie/">マトリックス</a>』や『<a href="https://wwws.warnerbros.co.jp/readyplayerone/">レディ・プレイヤー1</a>』、あるいは小説・アニメ『<a href="https://www.swordart-online.net/">ソードアート・オンライン</a>』の世界がやってきたら<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>はどうなるのでしょうか?それに対して直接の回答にはなりませんが、<a href="https://www.w3.org/TR/xaur/">XR Accessibility User Requirements</a>という<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a>の文書がまとまっていています。当然ではありますが、本書はそのような状況を扱っていません。</p> <p>たとえ未知のデ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%A4%A5%B9">バイス</a>が将来普及したとしても、ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の考え方が根底から覆されることはないはずです。WCAG 2.0が2008年に勧告されてから15年経ちますが、勧告に向けて策定作業が進められているWCAG 2.2は、WCAG 2.1と同様に依然としてWCAG 2.0をコアにして拡張したものです。</p> <p>WCAG2を発展させるWCAG 3.0というような話もありますが、少なくとも、向こう3年で何かが固まることはありません<a href="#f-69552690" name="fn-69552690" title="https://github.com/w3c/wcag/blob/charter-2022/charter.htmlからそう読み取れるかなと">*2</a>。仕様としてはWCAG2に当面は付き合う必要があるわけですが、もしかしたらWCAG3で検討されたものが部分的にWCAG2にフィードバックされることがあるかもしれません。たとえばスコアリングシステムが降ってくれば、0か1かの世界から解放されるわけです。というか早く来て(?)</p> <p>話がそれてしまいましたが、まとめましょう。著者陣(<a href="https://twitter.com/magi1125">@magi1125</a>、<a href="https://twitter.com/sukoyakarizumu">@sukoyakarizumu</a>、<a href="https://twitter.com/masup9">@masup9</a>、<a href="https://twitter.com/ymrl">@ymrl</a>)のファンである、ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に興味があって、最低限のことは知っているけれどももっと実装に関する情報が欲しい、UI設計とウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の結びつきを知りたい・深掘りしたい、所属組織にウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>を根付かせるためのヒントが欲しい、というような人に本書が応えてくれることと思います。気になる方は、書店で一度手に取ってみてはいかがでしょうか。</p> <p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=osi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="noopener"><img src="https://m.media-amazon.com/images/I/41OLWPRb75L._SL500_.jpg" class="hatena-asin-detail-image" alt="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus" title="Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=osi&amp;th=1&amp;psc=1" target="_blank" rel="noopener">Webアプリケーションアクセシビリティ──今日から始める現場からの改善 WEB+DB PRESS plus</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="http://d.hatena.ne.jp/keyword/%B0%CB%B8%B6%20%CE%CF%CC%E9" class="keyword">伊原 力也</a>,<a href="http://d.hatena.ne.jp/keyword/%BE%AE%CE%D3%20%C2%E7%CA%E5" class="keyword">小林 大輔</a>,<a href="http://d.hatena.ne.jp/keyword/%CB%F1%C5%C4%20%C1%F0%B0%EC" class="keyword">桝田 草一</a>,<a href="http://d.hatena.ne.jp/keyword/%BB%B3%CB%DC%20%CE%E2" class="keyword">山本 伶</a></li><li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%B5%BB%BD%D1%C9%BE%CF%C0%BC%D2">技術評論社</a></li></ul><a href="https://www.amazon.co.jp/dp/B0BTLCDDK5?tag=momdos35xreac-22&amp;linkCode=osi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="noopener">Amazon</a></div></div></p> <h2 id="あわせてよみたい">あわせてよみたい</h2> <ul> <li><a href="https://tsmd.jp/posts/web-application-accessibility/">比類なき一冊。書籍『Webアプリケーションアクセシビリティ』にレビュワーとして参加しました / tsmd.jp</a></li> <li><a href="https://note.com/ymrl/n/nd1dc8678145f">「Webアプリケーションアクセシビリティ」どこから読む?|ymrl|note</a></li> </ul> <div class="footnote"> <p class="footnote"><a href="#fn-acc8dc7d" name="f-acc8dc7d" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://developers.freee.co.jp/entry/freee-a11y-2020">https://developers.freee.co.jp/entry/freee-a11y-2020</a>とか</span></p> <p class="footnote"><a href="#fn-69552690" name="f-69552690" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text"><a href="https://github.com/w3c/wcag/blob/charter-2022/charter.html">https://github.com/w3c/wcag/blob/charter-2022/charter.html</a>からそう読み取れるかなと</span></p> </div> momdo JIS X 8341-3:2016のいう「サイズの大きなテキスト」について hatenablog://entry/4207112889964452494 2023-02-19T11:34:38+09:00 2023-02-19T11:34:38+09:00 JIS X 8341-3:2016(WCAG 2.0)では、用語集で「サイズの大きな (テキスト)」が定義されている。WAICの公開しているWCAG 2.0日本語訳のサイズの大きな (テキスト)は次のように記載されている*1: サイズの大きな (テキスト) (large scale (text)) 少なくとも 18 ポイント、又は 14 ポイントの太字。あるいは、中国語、日本語、及び韓国語 (CJK) のフォントは、それと同等の文字サイズ。 (中略) 注記 5: 半角の英数字のテキストにおける 18 ポイント及び 14 ポイントのサイズは、拡大印刷の最小サイズ (14 ポイント) と標準的な大… <p>JIS X 8341-3:2016(WCAG 2.0)では、用語集で「サイズの大きな (テキスト)」が定義されている。WAICの公開しているWCAG 2.0日本語訳の<a href="https://waic.jp/docs/WCAG20/Overview.html#larger-scaledef">サイズの大きな (テキスト)</a>は次のように記載されている<a href="#f-49df4045" name="fn-49df4045" title="ちなみに、JIS X 8341-3:2016と、WCAG 2.0のWAIC訳とで内容が微妙に異なっている">*1</a>:</p> <blockquote><p>サイズの大きな (テキスト) (large scale (text))<br/> 少なくとも 18 ポイント、又は 14 ポイントの太字。あるいは、中国語、日本語、及び韓国語 (CJK) のフォントは、それと同等の文字サイズ。<br/> (中略)<br/> 注記 5: 半角の英数字のテキストにおける 18 ポイント及び 14 ポイントのサイズは、拡大印刷の最小サイズ (14 ポイント) と標準的な大きい文字サイズ (18 ポイント) に基づいている。例えば、CJK 言語のようなその他の文字については、「同等な」サイズはその言語での拡大印刷の最小サイズと拡大印刷でその次に大きな標準のサイズとなる。</p> <p>訳注: 日本語の全角文字の場合は、<a href="http://www.mext.go.jp/a_menu/shotou/kyoukasho/1282361.htm">拡大教科書普及推進会議 第一次報告「第 2 章 拡大教科書の標準的な規格について」</a>に基づき、22 ポイント又は 18 ポイントの太字を「同等な」サイズとみなすのが妥当である。</p></blockquote> <p>なお原文は、</p> <blockquote><p>large scale (text)<br/> with at least 18 point or 14 point bold or font size that would yield equivalent size for Chinese, Japanese and Korean (CJK) fonts<br/> (中略)<br/> The 18 and 14 point sizes for roman texts are taken from the minimum size for large print (14pt) and the larger standard font size (18pt). For other fonts such as CJK languages, the "equivalent" sizes would be the minimum large print size used for those languages and the next larger standard large print size.</p></blockquote> <p>となっている。</p> <p>ここで注目したいのは、日本語の場合において、訳注にてWCAG 2.0の規定よりも1段階大きなサイズに言及しており、そのサイズを<a class="keyword" href="http://d.hatena.ne.jp/keyword/%EF%E7%C3%CD">閾値</a>とすることが「妥当」であるとしている。果たして日本語の場合にサイズを大きくすることは本当に「妥当」なのかどうか。このことについて見ていきたいというのがこの記事の趣旨である。</p> <h2 id="サイズの大きなテキストの用法と由来">「サイズの大きなテキスト」の用法と由来</h2> <p>「サイズの大きなテキスト」は、達成基準1.4.3で用いられている。WCAG 2.1解説書<a href="https://waic.jp/docs/WCAG21/Understanding/contrast-minimum.html">達成基準 1.4.3: コントラスト (最低限)を理解する</a>では、意図の冒頭に</p> <blockquote><p>この達成基準の意図は、(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>ストを強化する支援技術を使用していない) 中度のロービジョンの人がテキストを読めるように、テキストとその背景との間に十分な<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>ストを提供することである。</p></blockquote> <p>とあり、</p> <blockquote><p>18 ポイントのテキスト又は 14 ポイントの太字のテキストは、より低い<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比を要求するのに十分な大きさであると判断される (関連リソースにある "The American Printing House for the Blind Guidelines for Large Printing and The Library of Congress Guidelines for Large Print"を参照のこと)。</p></blockquote> <p>とある。実際に関連リソースのあるAmerican Printing House (APH)のページでは、<a href="https://www.acb.org/large-print-guidelines">Best Practices and Guidelines for Large Print Documents used by the Low Vision Community authored by the Council of Citizens with Low Vision International An Affiliate of the American Council of the Blind Arlington, VA</a>のGuidelines<a href="#f-0126181c" name="fn-0126181c" title="2.1解説書の関連リソース https://waic.jp/docs/WCAG21/Understanding/contrast-minimum.html#resources からは、 Guidelines for the Development of Documents in Large Print https://www.aph.org/resources/large-print-guidelines/ が提供されているが、PDFということもあり、同等のことが書かれているHTMLページを選んだ">*2</a>で、</p> <blockquote><p>In general, at least an 18 point, and preferably a 20 point, bold, sans serif, mono or fixed space font is desirable.</p></blockquote> <p>というところに見える。同じAPHが運営するVisionAwareというサイトの<a href="https://visionaware.org/everyday-living/essential-skills/reading-writing-and-vision-loss/large-print/">Using Large Print</a>では、</p> <blockquote><p>The standard font size for large print is 18 point, ...</p></blockquote> <p>という塩梅である。これがWCAG2で18ポイントが標準的なサイズとした根拠、となる。</p> <h2 id="その他に海外の大活字のサイズに言及しているリソース">その他に海外の大活字のサイズに言及しているリソース</h2> <p><a href="https://www.dinf.ne.jp/doc/japanese/access/guideline/Accessible_PublishingBestV4/Accessible_Publishing_Guidelines_v4.html">アクセシブルな出版物の制作 出版社のためのベストプラクティスガイドライン</a>の<a href="https://www.dinf.ne.jp/doc/japanese/access/guideline/Accessible_PublishingBestV4/Accessible_Publishing_Guidelines_v4.html#what_is_an_accessible_product#preparation_of_your_files">ファイルの作成</a>では、</p> <blockquote><p>文書の文字サイズは12-14ポイントにする(14ポイントが望ましい)。</p></blockquote> <p>とある。また、<a href="https://www.dinf.ne.jp/doc/japanese/access/guideline/lesersokerbok/index.html">すべての人のための図書を製作する方法</a>の<a href="https://www.dinf.ne.jp/doc/japanese/access/guideline/lesersokerbok/large_print.html">大活字本</a>では、</p> <blockquote><p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>の人のための大活字本は、一般の図書よりも文字が大きく、語間と行間が広くなっている。これは他の読者にとっても役に立つ場合がある。<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CE%A5%EB%A5%A6%A5%A7%A1%BC">ノルウェー</a>の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者団体によれば、一般読者向けのテキストでは、活字サイズの最低基準は12ポイントとなっている。</p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>の人にとっては、14ポイントあるいは16ポイントの方がよい。「大活字本」という言葉を使用するときは、14ポイント以上、行間はダブルスペース、語間は通常よりも広くとり、「クリーンな」書体、すなわちセリフが付いていない、均一な太さの文字を使用する。キャプションについてもこれは同様である。</p> <p>16ポイントよりも大きな活字を使用する必要はほとんどない。活字を拡大する読書補助器具を使用している人は、一度に2、3語しか見えないので、大きすぎる文字は難しいからである。サボン(Sabon)の文字サイズ13.5ポイントで行間19ポイント、あるいはタイムズ(Times)の15ポイントは、ともに適切である。</p> <p>「すべての人のための図書」財団では、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>の成人読者向け小説などの大活字本の製作を支援している。</p></blockquote> <p>とある。</p> <h2 id="拡大教科書普及推進会議報告書について">「拡大教科書普及推進会議報告書」について</h2> <p>本題のJIS X 8341-3:2016(以下JISとする)の注記で言及されている「拡大教科書普及推進会議 第一次報告」について見ていく。これは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%CA%B8%C9%F4%B2%CA%B3%D8%BE%CA">文部科学省</a>の<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1280052.htm">「拡大教科書普及推進会議報告書」について</a>から辿ることができる。ここでおさえておきたいのは、<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282329.htm">第一次報告</a>とは別に<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282331.htm">第二次報告</a>もあるということが1つ。もう1つは、この報告を受けて、<a href="https://www.mext.go.jp/component/a_menu/education/detail/__icsFiles/afieldfile/2010/01/15/1235124_1.pdf">障害のある児童及び生徒のための教科用特定図書等の普及の促進等に関する法律第六条第一項の規定に基づき定める教科用拡大図書の標準的な規格</a>が定められていることである。<strong>JISから「教科用拡大図書の標準的な規格」ではなく、規格の作成にあたっての報告書が参照されている</strong>のは微妙に思うところではある。訳注から参照する文書としては、規格を参照するのが適当だろう。</p> <hr /> <p>ここで、障害のある児童及び生徒のための教科用特定図書等の普及の促進等に関する法律について触れておこう。これは<a class="keyword" href="http://d.hatena.ne.jp/keyword/%CA%B8%C9%F4%B2%CA%B3%D8%BE%CA">文部科学省</a>で<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1378183.htm">「障害のある児童及び生徒のための教科用特定図書等の普及の促進等に関する法律」(通称:教科書バリアフリー法)について</a>として案内されている。</p> <p>教科書<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法の第6条1項は、</p> <blockquote><p>第六条 <a class="keyword" href="http://d.hatena.ne.jp/keyword/%CA%B8%C9%F4%B2%CA%B3%D8%C2%E7%BF%C3">文部科学大臣</a>は、教科用拡大図書その他教科用特定図書等のうち必要と認められるものについて標準的な規格を定め、これを公表しなければならない。</p></blockquote> <p>とあって、先の規格はこの条文に基づいた規格ということになる。ちなみに、この法律が制定されたのは平成20年(2008年)で、教科書<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法の第6条1項に基づく規格は2010年に改正されている。</p> <p>教科書<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法に基づく規格(抜粋)</p> <blockquote><p>第1 小中学校段階<br/> 1.全般的事項<br/> (2)本規格は、できるだけ多くの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>児童生徒が利用できるものにするため、文字の大きさとして18ポイント~26ポイント(小学校3年までは発達段階を考慮して22ポイント~30ポイント)程度の文字を使用する<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>児童生徒を対象とする。<br/> また、本規格に適合する拡大教科書の発行にあたっては、文字の大きさが22ポイントの版を基準に、その1.2倍と0.8倍の3パターンの版を作成することとする。</p> <p>第2 高等学校段階 1.全般的事項<br/> (1)小中学校段階の標準規格に準ずることを原則とする。<br/> (2)教科・科目の多様化や学習内容の増大及び一層多様化する生徒のニーズにも応えられるよう、文字の大きさを若干小さくすることにも留意し、各教科書発行者が作成・発行している原本教科書を単純拡大した拡大教科書(以下、「単純拡大教科書」という)を規格の一つとする。</p></blockquote> <hr /> <p>拡大教科書普及推進会議の話題に戻ると、<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282329.htm">第一次報告</a>の<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282361.htm">第2章 拡大教科書の標準的な規格について</a>では、</p> <blockquote><p>○ 標準規格は、小学校及び中学校におけるすべての教科の教科書を対象として定めるものとする(※5)。</p> <p>※5 高等学校における教科書については、今後、高校における<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒への教育方法・教材のあり方ワーキンググループにおいて更に詳細な検討を行っていく予定である。</p></blockquote> <p>とある。つまり、小中学生を念頭において策定されたものである、ということがわかる。</p> <blockquote><p>○ 標準規格は、できるだけ多くの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>児童生徒が利用できるものにするため、文字の大きさとして18ポイント~26ポイント(小学校3年までは発達段階を考慮して22ポイント~30ポイント)程度の文字を使用する<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>児童生徒を対象とし(※6)、更に、文字の大きさが22ポイントの版を基準に、その1.2倍と0.8倍の3パターンの版を作成することとする。</p> <p>※6 検定教科書の本文の文字サイズは、概ね10.5~18ポイントである。</p></blockquote> <p>その上で、18ポイントと22ポイントという数字が出てきている。一方で、<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282331.htm">第二次報告</a>は、高校を対象に調査・報告されている。<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282375.htm">第3章 教科書発行者等による拡大教科書の発行量の確保</a>では、</p> <blockquote><p>(2)拡大教科書の作成<br/> ○ 高等学校段階においては、教科書発行者が作成した拡大教科書は未だ発行されておらず、ボランティア団体も小中学校段階の拡大教科書製作に追われている状況にあることなどから、拡大教科書の利用実績も少なく、小中学校段階に比べて、どのように拡大したらよいかの条件や有効性の分析・検証等は十分に行われていない状況にある。</p> <p>したがって、高等学校段階において、どのような拡大教科書を作成すべきかについては、本会議においても多角的な方面から議論が行われた。</p> <p>○高等学校段階において、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒に提供する拡大教科書は、以下に示す理由から、教科書発行者から発行された原本教科書を単純拡大した拡大教科書(文字の大きさは14~18ポイント程度、以下、「単純拡大教科書」という。)とし、その実現に取り組むべきとする意見があった。</p> <p>(理由)</p> <ul> <li>レイアウトの変更を行うとページ数が増加して、分冊にせざるを得ないが、高等学校の教科書は内容も多いため、小中学校段階に比して分冊数が増えることが予想されること。</li> <li>高等学校段階の授業展開においては、教科書の章・節や分冊をまたがって使用するなど、その活用方法は多様であり、教員の指示で必要なページや箇所を速やかに探す必要があるため、レイアウト変更した拡大教科書では扱いにくく、単純拡大したものの方が有効な場合があること。</li> <li>特別支援学校(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>)高等部保健理療科及び理療科(※11)において、使用されている教科書は、文字の大きさが14~16ポイント程度であること。</li> <li>前述した全国盲学校長会のアンケート調査において、「仮に拡大教科書を提供する場合、どのような教科書が適当か」という設問に対して、文字の大きさが14~16ポイントになるように単純拡大したものがよいとする回答が多数を占めたこと。(※12)</li> </ul> <p>○ また、一方で、以下に示す理由から、小中学校段階と同様に標準規格を策定し、レイアウト変更した標準拡大教科書を発行すべきとの意見があった。</p> <p>(理由)</p> <ul> <li>単純拡大教科書による14~18ポイントの文字では、例えば、中学校3年生まで(義務教育段階の標準規格の1つである)26ポイントの文字で学習してきたような強度の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒に対応できないこと。また、文字間や行間も比例して拡大されるため、読書効率が下がるおそれがあること。</li> <li>本文より小さな文字で書かれている注釈や新出語句、添え字などの文字は読みづらいと考えられること。また、字体がゴシック体に変えられない場合、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%CC%C0%C4%AB%C2%CE">明朝体</a>では横画が細く誤読の可能性が高まること。</li> <li>平成12年に行われた、全国の特別支援学校(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>)の中学部・高等部の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒に対する英語の拡大教材の調査においては、22ポイント、28ポイントのものを希望する生徒が多かったこと。</li> <li>小中学校の標準的な規格として示された18ポイント、22ポイント、26ポイントの文字サイズは、高等学校段階の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒にも有効であると考えられること。</li> <li>単純拡大教科書のうち、B4やA3に拡大したものは判が大きく、持ち運びが不便であること。また、学習の際、机上を占める教科書の面積が広くなり、かなり眼を近付けて読書する<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒の場合、顔の移動距離が大きくなってしまうこと。</li> <li>複雑にレイアウトされている検定教科書を単純に拡大しただけでは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>生徒が教員の指示に沿って必要な箇所を速やかに探すことは困難な場合があること。</li> </ul> <p>○本会議としては、これらの意見及び第2章1.に示した基本的な考え方を踏まえ、高等学校段階における拡大教科書は、標準規格に適合する標準拡大教科書を小中学校段階と同様に提供するとともに、高等学校段階のより一層多様化したニーズにも応えられるように、単純拡大教科書も選択肢として、提供していくことが適当と考える。その上で、希望する生徒に対して教科書発行者等が作成する拡大教科書を提供することを基本とし、高等学校段階における標準規格の策定に向け、実証的な研究に早期に取り組むべきと考える。基本的な進め方としては、小中学校の標準規格に準じた拡大教科書を試行的に発行・供給するとともに、単純拡大教科書についても積極的に活用することにより、高等学校段階のより望ましい拡大教科書のあり方について、実証的な調査研究を行う必要がある。</p> <hr /> <p>※11 特別支援学校(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>)高等部には、専門教育を行う学科として保健理療科や理療科があり、これらの学科は卒業によって<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A4%A2%A4%F3%CB%E0%A5%DE%A5%C3%A5%B5%A1%BC%A5%B8%BB%D8%B0%B5%BB%D5">あん摩マッサージ指圧師</a>、はり師、きゅう師の国家試験の受験資格が得られる。ここで使用される教科書については、全国盲学校長会が中心となって「盲学校理療教科用図書編纂委員会」を設け、教科書の基本的仕様を定めている。</p> <p>※12 「文字の大きさ(14~16ポイント)になるように、検定教科書を単純拡大した教科書を3種類用意」が特別支援学校(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>)69校中37校、「レイアウト変更した18、22、26ポイント程度の拡大教科書」を選択した学校が17校であった。</p></blockquote> <p>文字の大きさについては、レイアウトを変更した拡大教科書で小中学校と同等の大きさが適当とする意見がある一方で、原本教科書を単純に拡大したレイアウトを変更しない拡大教科書で14~18ポイント程度が適当とする意見もある。</p> <p>なお、<a href="https://www.mext.go.jp/a_menu/shotou/kyoukasho/1282369.htm">第2章 高等学校段階における弱視生徒への教育方法・教材のあり方</a>では、</p> <blockquote><p>発達の段階が進むと、読書効率が最大となる文字サイズは徐々に小さくなるという調査結果が見られる。しかしながら一方で、進行性の眼疾患等によって、必要とする文字サイズが大きくなっていく者も見られる点に留意する必要がある。</p></blockquote> <p>ともある。さまざまなロービジョンの方がいるわけだが、報告書から読み取れる規格の策定経緯<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A4%AB%A4%E9%A4%B7">からし</a>ても、<strong>教科書<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%EA%A5%A2%A5%D5%A5%EA%A1%BC">バリアフリー</a>法の規格をもって、ただちに22ポイントと18ポイントの太字が「同等な」サイズとみなすことについては、再考の余地があるのではないか…?</strong></p> <h2 id="そのほかの日本の大活字のサイズに言及したリソース">そのほかの日本の大活字のサイズに言及したリソース</h2> <p><a href="https://kotobank.jp/word/%E5%A4%A7%E6%B4%BB%E5%AD%97%E6%9C%AC-1612426">コトバンク(日本大百科全書)の大活字本</a>では、</p> <blockquote><p>一般的な文庫版の文字組は9~10ポイント(1文字約3~3.5ミリメートル角)程度の大きさであるが、大活字本では、12ポイント(同4.2ミリメートル角)~22ポイント(同7.7ミリメートル角)の見やすい書体が採用されている。</p></blockquote> <p>とあって、12ポイントが下限値、22ポイントが上限値となっている。</p> <p>千葉県立図書館の<a href="https://www.library.pref.chiba.lg.jp/reference/pathfinder/pf_shikaku.html">視覚障害について調べる</a>では、</p> <blockquote><p>活字の大きさが8~9ポイントの本が多い中、ロービジョン(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>)の人も読みやすいよう、活字の大きさ(14~22ポイント)やフォントが工夫されている本。</p></blockquote> <p>としている。</p> <p>レファレンス協同データベースには<a href="https://crd.ndl.go.jp/reference/detail?page=ref_view&amp;id=1000142704">大活字本の出版状況について出版されているタイトル数を知りたいです。</a>では、質問として、</p> <blockquote><p>大活字本の出版状況について出版されているタイトル数を知りたいです。 大活字の定義は、出版社に任せます。(18pt以上が一般的かと思いますが、14pt以上であってもかまいません。) 公の数字として、出典を提示できるものであれば、どのような出版物でもかまいません。</p></blockquote> <p>と、少なくとも質問者は18ポイントをひとつの目安として、14ポイントを下限と捉えているようである。回答としては、</p> <blockquote><p>大活字図書に関わる専門機関である大活字文化普及協会に問い合わせましたところ、下の2点の内容の回答をいただきました。<br/> (1) 大活字本について、文字の大きさなど、各出版社の定義づけがそろっていないので、「大活字本」として出版点数の把握は難しいと考えます。<br/> (2) 当方では大活字社から発行しているもの(文字サイズ22pt)を大活字本と考えているので、(以下省略)</p></blockquote> <p>とある。大活字社は22ポイントを大活字と考えている。</p> <p>日本<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者団体連合(日視連)の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>部会による<a href="http://nichimou.org/notice/20201028-jim/">弱視者の困り事 資料集第6号</a>という報告書がある。この中のⅡウェブサイトやアプリ等に関する困り事の6.<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>者(ロービジョン)が読みやすいフォントでは、</p> <blockquote><p>私が仲間と一緒に作った本を出版した際、このUD教科書体を使用し、本文は横書き12ポイントにしたことがある。軽度の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>者(ロービジョン)からは「読みやすい」との評価があった。</p></blockquote> <p>とある。また、Ⅲ日視連加盟団体での<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>(ロービジョン)に関する取り組みとして、</p> <blockquote><p>(5)<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B5%FE%C5%D4%C9%DC">京都府</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者協会 協会の中に「生活環境改善部」があり、ここで<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BC%E5%BB%EB">弱視</a>(ロービジョン)に関する要望活動等を行っている。要望活動の中では(中略)、市が発行する広報誌を14ポイントのゴシックを標準的な仕様としてもらったり、(以下略)</p></blockquote> <p>というような記述もある。なお、この報告書のPDF版は、MSゴシック14ポイントの太字で作成されていると認識している。</p> <h2 id="ツール類の現状">ツール類の現状</h2> <p>現状では、たかだか国家標準の訳注にしか過ぎないので、当然<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックのためのツール類も対応していない。</p> <p><span style="font-size:14pt; font-weight:700; color:#1c90ef;">14pt太字 <a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比3.02:1</span>(訳注に従えば18pt必要)</p> <p><span style="font-size:18pt; font-weight:400; color:#4163e1;">18pt <a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比4.64:1</span>(訳注に従えば22pt必要)</p> <p>少なくともChomre/<a class="keyword" href="http://d.hatena.ne.jp/keyword/Firefox">Firefox</a>、axeについては上記を合格と判定する。</p> <h2 id="まとめ">まとめ</h2> <p>JISの訳注にあるとおり、英語などよりも1段階大きなサイズ(22ポイント/18ポイントの太字)を日本語で「同等」とみなすのか、英語などと同じサイズ(18ポイント/14ポイントの太字)を「同等」とみなすのか。「拡大教科書普及推進会議報告書」で見て取れる規格策定の経緯と、実際に流通している大活字本の中には18ポイントを下回るものがあることから、欧文と同じサイズの基準でもよいのではないか、と感じた。少なくとも、報告書ではなく規格を参照すべきではないかという観点から、訳注の記載を見直す必要はあると考える。</p> <p>もちろん、JISの訳注の記載については、改めてロービジョンのコミュニティの意見を聞く必要があると考えるが、海外のように、日本の当事者団体がこう考えるという文書を出してもらうのが正道だろう。(そのような文書を見つけられなかったので、こうして調べたことになったともいえる。)</p> <p>JISの訳注ではなく、<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a>の文書に「同等な」サイズについて記載する必要もある。WCAG 2.2は策定が進んでしまったこともあり、今からここに記載するのは難しいが、Understanding WCAG 2.2(解説書)に盛り込むのはハードルが下がると考える。</p> <p>また、現状ではCJKと一括りで言及されているが、中国語や韓国語のコミュニティの意見がどうなっているのかも調べる必要があるだろう。</p> <p>日本語の場合に訳注のとおり22ポイント/18ポイントの太字とした場合、当然、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>チェックのツールも対応させるべきだろう。その意味でも、同等のサイズについて、究極的にはWCAG2の用語集に取り込む必要があると考える。</p> <div class="footnote"> <p class="footnote"><a href="#fn-49df4045" name="f-49df4045" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">ちなみに、JIS X 8341-3:2016と、WCAG 2.0のWAIC訳とで内容が微妙に異なっている</span></p> <p class="footnote"><a href="#fn-0126181c" name="f-0126181c" class="footnote-number">*2</a><span class="footnote-delimiter">:</span><span class="footnote-text">2.1解説書の関連リソース <a href="https://waic.jp/docs/WCAG21/Understanding/contrast-minimum.html#resources">https://waic.jp/docs/WCAG21/Understanding/contrast-minimum.html#resources</a> からは、 Guidelines for the Development of Documents in Large Print <a href="https://www.aph.org/resources/large-print-guidelines/">https://www.aph.org/resources/large-print-guidelines/</a> が提供されているが、PDFということもあり、同等のことが書かれているHTMLページを選んだ</span></p> </div> momdo autocomplete属性のものすごく簡単なメモ hatenablog://entry/4207112889960234283 2023-02-04T17:05:18+09:00 2023-02-04T17:09:08+09:00 Autocomplete workshopというミーティングが今年1月に行われたようで、autocomplete方面が盛り上がりつつあるみたいです(whatwg/html#4986)。 このワークショップのノート(Google Doc)が公開されていますけれども、参加者にブラウザーベンダー*1がいるのは当然として、Eコマースのプラットフォーム方面(Shopify、WIX、Checkout.com、Shipper HQ)が参加しているのが興味深いところ。 箇条書きでまとめられているものを雑に引っ張ってみると actocomplete属性の拡張をこれから考えていくことになるが、目下で注目しているの… <p>Autocomplete workshopというミーティングが今年1月に行われたようで、<code>autocomplete</code>方面が盛り上がりつつあるみたいです(<a href="https://github.com/whatwg/html/issues/4986">whatwg/html#4986</a>)。</p> <p><a href="https://docs.google.com/document/d/1MZ1tnmUuKKmYM7uc6OWdfcR2z3kv4bU-ibjno8zMLYE/edit?usp=sharing">このワークショップのノート(Google Doc)</a>が公開されていますけれども、参加者に<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D6%A5%E9%A5%A6%A5%B6%A1%BC">ブラウザー</a>ベンダー<a href="#f-97e52135" name="fn-97e52135" title="AnneがAppleに行ったのをいまさら認識した">*1</a>がいるのは当然として、Eコマースのプラットフォーム方面(<a href="https://www.shopify.com/jp">Shopify</a>、<a href="https://ja.wix.com/">WIX</a>、<a href="https://www.checkout.com/">Checkout.com</a>、<a href="https://shipperhq.com/">Shipper HQ</a>)が参加しているのが興味深いところ。</p> <p>箇条書きでまとめられているものを雑に引っ張ってみると</p> <ul> <li><code>actocomplete</code>属性の拡張をこれから考えていくことになるが、目下で注目しているのは名前と住所</li> <li>250サイトについて入力フォームを調べてみた <ul> <li>日本を含めたいくつかの国は、オートフィルがうまく機能しない <ul> <li>どの情報を1つのフィールドに入力するかについて、サイトごとにまちまち</li> </ul> </li> <li>日本では氏名に読みがなを要求されることがある</li> </ul> </li> <li>Hixieが意図してた<code>address-level</code>の使い方とは異なるだろう</li> <li>金融業界には<a href="https://www.iso20022.org/">ISO 20022</a>がある</li> </ul> <p>まあ、他にもいろいろ書かれていますが、まだまだ始まったばかりということで。</p> <p>WCAG2観点としては、「<a href="https://waic.jp/docs/WCAG21/Understanding/identify-input-purpose.html">達成基準1.3.5 入力目的の特定</a>」を解決する、いまのところの唯一の方法だったりもするので、精度の向上はこの視点でも望ましいみたいな話もあります。</p> <p>ちなみに日本の住所については、デジタル庁が<a href="https://github.com/JDA-DM/GIF/blob/main/440_%E3%82%B3%E3%82%A2%E3%83%87%E3%83%BC%E3%82%BF%E3%83%91%E3%83%BC%E3%83%84/md/442_core_dataparts_address.md">政府相互運用性フレームワーク (GIF) コアデータパーツ 住所(アドレス)</a>という文書でまとめてます。</p> <p>住所の構造については図が載ってて、だいたいこんな感じみたいです:</p> <p><img src="https://raw.githubusercontent.com/JDA-DM/GIF/main/440_%E3%82%B3%E3%82%A2%E3%83%87%E3%83%BC%E3%82%BF%E3%83%91%E3%83%BC%E3%83%84/md/442/media/image1.png" width="640"></p> <div class="footnote"> <p class="footnote"><a href="#fn-97e52135" name="f-97e52135" class="footnote-number">*1</a><span class="footnote-delimiter">:</span><span class="footnote-text">Anneが<a class="keyword" href="http://d.hatena.ne.jp/keyword/Apple">Apple</a>に行ったのをいまさら認識した</span></p> </div> momdo (メモ)W3C AAC Symbol RegistryとWAI-adaptの話 hatenablog://entry/4207112889952179296 2023-01-08T14:07:59+09:00 2023-01-08T14:07:59+09:00 W3C Alternative and Augmented Communication (AAC) Symbol Registry - W3C Draft Registry 13 December 2022 https://www.w3.org/TR/2022/DRY-aac-registry-20221213/ W3C Registry Trackの文書を初めて見たけども、なるほどこういうことか。 Alternative and Augmented Communication (AAC)は、拡大・代替コミュニケーション1などと訳されるもので、DINFの用語解説では以下のように紹介されている。… <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> <a class="keyword" href="http://d.hatena.ne.jp/keyword/Alternative">Alternative</a> and Augmented Communication (<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a>) Symbol Registry - <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Draft Registry 13 December 2022<br/> <a href="https://www.w3.org/TR/2022/DRY-aac-registry-20221213/">https://www.w3.org/TR/2022/DRY-aac-registry-20221213/</a></p> <p><a href="https://www.w3.org/standards/types#registries">W3C Registry Track</a>の文書を初めて見たけども、なるほどこういうことか。</p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/Alternative">Alternative</a> and Augmented Communication (<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a>)は、拡大・代替コミュニケーション<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup>などと訳されるもので、<a href="https://www.dinf.ne.jp/doc/japanese/prdl/jsrd/rehab/r166/r166_glossary.html">DINFの用語解説</a>では以下のように紹介されている。</p> <blockquote><p>コミュニケーション能力に障害がある人が,本人の能力(音声,表情,サイン,身振りなど),ローテク(文字盤,絵カード,シンボル,写真など),ハイテク(電子機器など)その他,様々な手段の活用によって,自分の意思を相手に伝えることを支援する臨床活動の領域ことである。<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B8%C0%B8%EC%BE%E3%B3%B2">言語障害</a>,知的障害,<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>,<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C4%B0%B3%D0%BE%E3%B3%B2">聴覚障害</a>,<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C8%AF%C3%A3%BE%E3%B3%B2">発達障害</a>,身体運動機能障害その他,コミュニケーション障害を伴う広範な障害が対象となる。</p></blockquote> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a>について簡単に検索したところ、日本語の書籍としては、<a href="http://www.kyodo-isho.co.jp/cgi-local/search.cgi?id=book&amp;isbn=978-4-7639-3054-5">言語聴覚士のためのAAC入門</a>が見つかった。<a href="http://www.kyodo-isho.co.jp/coverimg/tachiyomi/978-4-7639-3054-5.pdf">立ち読み</a>できる範囲でも、<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a>が何なのか、なんとなくのイメージが膨らむ。</p> <p>で、<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a> Symbol Registryなのだけども、これはAbstractにもあるように、<a href="https://www.blissymbolics.org">Blissymbolics Communication International</a>(BCI)と共同で発行されたものとある。現に、BCIの<a href="https://www.blissymbolics.org/index.php/symbol-files">Symbol files</a>で入手できるシンボルのIDは、そのまま<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a> Symbol RegistryのIDになっている。(Blissymbols;ブリスシンボルについては、<a href="https://ja.wikipedia.org/wiki/%E3%83%96%E3%83%AA%E3%82%B9%E3%82%B7%E3%83%B3%E3%83%9C%E3%83%AB">Wikipedia</a>も参照)。</p> <p>では、この<a class="keyword" href="http://d.hatena.ne.jp/keyword/AAC">AAC</a> Symbol Registryをどうやってウェブページで利用するのか?<a href="https://www.w3.org/TR/2023/CR-adapt-symbols-20230105/#symbol-example">WAI-Adapt: Symbols Module仕様の4.1.2 Examples</a>では、HTMLでの用法が挙げられている。2つ例を引っ張っておく。</p> <p>例1:個別の単語にシンボルIDを当てるもの</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> adapt-symbol=</span><span class="synConstant">&quot;13621&quot;</span><span class="synIdentifier">&gt;</span>Cup<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> of <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier"> adapt-symbol=</span><span class="synConstant">&quot;17511&quot;</span><span class="synIdentifier">&gt;</span>Tea<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span> </pre> <p>例2:画像にシンボルIDを当てるもの</p> <pre class="code lang-html" data-lang="html" data-unlink><span class="synIdentifier">&lt;</span><span class="synStatement">img</span><span class="synIdentifier"> </span><span class="synType">src</span><span class="synIdentifier">=</span><span class="synConstant">&quot;cup.png&quot;</span><span class="synIdentifier"> adapt-symbol=</span><span class="synConstant">&quot;13621&quot;</span><span class="synIdentifier"> </span><span class="synType">alt</span><span class="synIdentifier">=</span><span class="synConstant">&quot;Cup&quot;</span><span class="synIdentifier">&gt;</span> </pre> <p>実際にどのように動作するのかについては、<a href="https://www.w3.org/TR/2023/DNOTE-adapt-20230103/#proof-of-concept-symbol-example">WAI-Adapt Explainerの1.2.4.1 Proof of Concept: Symbol Example</a>がわかりやすい。ようは、ユーザー設定により自分の好みにあったシンボルを選択できるようにすることが狙いということになる。</p> <p>と、ここまで書いて気づいたんだけど、<a href="https://www.mitsue.co.jp/knowledge/blog/a11y/202011/24_0911.html">パーソナライゼーション・セマンティクスとシンボルによるコミュニケーション</a>で取り上げていることと大差なかった。<a href="https://www.w3.org/standards/history/adapt">WAI-Adapt Explainerの発行履歴</a>を見ると、以前はPersonalization Semantics 1.0と謳っていたものがWAI-Adaptと名前を変えており、そのために気づかなかったわけか…。</p> <p>WAI-Adaptは、WAI-<a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a>の<code>aria-*</code>ような<code>adapt-*</code>属性を導入しようという意図が透けて見える<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>けれども、少なくともシンボルでそのような<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DE%A1%BC%A5%AF%A5%A2%A5%C3%A5%D7">マークアップ</a>が容易にできるのかのハードルがありそう。<code>&lt;ruby&gt;</code>を個別に打ち込んでいくようなもの…と捉えるとかなり手間がかかることが想像できる。</p> <p>さまざまな困難が伴うだろうけれども、<a href="https://www.w3.org/WAI/GL/task-forces/coga/">Coga TF</a>を通して明らかになっている課題を前に進めようという姿勢は賞賛に値する。</p> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> 「補助代替コミュニケーション」が当てられることもある<a href="#fnref:1" rev="footnote">&#8617;</a></li> <li id="fn:2"> 実際、<a href="https://www.w3.org/TR/2023/DNOTE-adapt-20230103/#modules">WAI-Adapt ExplainerのModules</a>からたどれるモジュールを見ていくとそう捉えることができる<a href="#fnref:2" rev="footnote">&#8617;</a></li> </ol> </div> momdo 国交省ハザードマップ検討会のWebアクセシビリティの認識が詰んでいる hatenablog://entry/4207112889943936998 2022-12-10T20:24:22+09:00 2022-12-10T20:24:22+09:00 ツッコミが追いつかないというのは、こういうことを指すの…? ハザードマップのユニバーサルデザインに関する検討会 - 国土交通省水管理・国土保全局 障害等に対応する一人ひとりのニーズに応じた水害リスク情報提供のあり方を検討する有識者会議を開催します! ~ハザードマップのユニバーサルデザインに関する検討会(第1回)の開催~ - 国土交通省 ハザードマップは、主に地図上に水害リスクに関する情報を示すものですが、視覚等に障害を有する場合は紙面等の情報を取得することが困難であること、また、自身のリスクが把握しづらく、避難行動に役立ちにくいという意見もあることから、一人ひとりの環境やニーズに合ったリスク情… <p>ツッコミが追いつかないというのは、こういうことを指すの…?</p> <p><a href="https://www.mlit.go.jp/river/shinngikai_blog/universal_design/index.html">ハザードマップのユニバーサルデザインに関する検討会 - 国土交通省水管理・国土保全局</a></p> <p><a href="https://www.mlit.go.jp/report/press/mizukokudo04_hh_000170.html">障害等に対応する一人ひとりのニーズに応じた水害リスク情報提供のあり方を検討する有識者会議を開催します! ~ハザードマップのユニバーサルデザインに関する検討会(第1回)の開催~ - 国土交通省</a></p> <blockquote><p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>は、主に地図上に水害リスクに関する情報を示すものですが、視覚等に障害を有する場合は紙面等の情報を取得することが困難であること、また、自身のリスクが把握しづらく、避難行動に役立ちにくいという意見もあることから、一人ひとりの環境やニーズに合ったリスク情報提供のあり方を整理するため、「<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E6%A5%CB%A5%D0%A1%BC%A5%B5%A5%EB%A5%C7%A5%B6%A5%A4%A5%F3">ユニバーサルデザイン</a>に関する検討会」を設置し、令和3年12月23日(木)に第1回検討会を開催します。</p></blockquote> <p>という趣旨らしいです。これまで検討会は4回開催されており、直近では先月の11月末に開催されたとあります。パラパラと資料を見ていくかぎりでは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E6%A5%CB%A5%D0%A1%BC%A5%B5%A5%EB%A5%C7%A5%B6%A5%A4%A5%F3">ユニバーサルデザイン</a>としてかなり多方面にわたって話をしているように見えるものの、どうにも雲行きが怪しいな。と。</p> <p>第4回で示された<a href="%E3%80%90%E8%B3%87%E6%96%994%E3%80%91_%E6%9C%AC%E6%A4%9C%E8%A8%8E%E4%BC%9A%E5%A0%B1%E5%91%8A%E3%81%AE%E9%AA%A8%E5%AD%90%E6%A1%88%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6">【資料4】_本検討会報告の骨子案について</a>なんかを見ていきますと、</p> <blockquote><p>第1章 「わかる・伝わる」<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>のあり方について<br/> ・<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>は、障害のある方達にも等しく提供されることを基本。<br/> ・印刷物や ICT を活用した情報提供は、全ての障害のある人達がアクセスできること<br/> が必要。</p></blockquote> <p>単なる紙版ですと、天地がひっくり返っても<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者の一部の人にとっては、まったくアクセスできないわけですが…。もちろん<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C5%C0%BB%FA">点字</a>版があれば、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C5%C0%BB%FA">点字</a>が読める人には伝わるでしょうけれども、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C5%C0%BB%FA">点字</a>で伝えられる情報は、視覚的に地図を見て得られる情報に比べると、限定的になってしまう問題はついて回るわけで。</p> <p>地図というメディア自体が情報としてもの凄く圧縮されているわけですよね。仮に、単に現在地から目的地までを<a class="keyword" href="http://d.hatena.ne.jp/keyword/Google%A5%DE%A5%C3%A5%D7">Googleマップ</a>に検索させて、経路案内を全部読み上げさせたとすると、それだけでもう膨大な情報になるわけで。</p> <p>地図情報から、何を読み取ればよいのか、障害にかかわらず読み取ることそのものが難しいと思うわけですけれども、この検討会は果たしてどこまで咀嚼できているのかが微妙と。</p> <p>そもそもとして<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>で伝えるべき情報を選定しきれていないと思っており、肝心要のマップから読み取る情報を決めなければ、いくらガワを<a class="keyword" href="http://d.hatena.ne.jp/keyword/Web%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">Webアクセシビリティ</a>の規格に沿った作りにしたところで、スクリーンリーダーのユーザーにはもちろん一般のユーザーにも伝わらないでしょうね…というのが根本的なところの感想です。</p> <p>まあ、そのガワとなる<a class="keyword" href="http://d.hatena.ne.jp/keyword/Web%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">Webアクセシビリティ</a>の認識も怪しいのですが。</p> <blockquote><p>〇WEB <a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について<br/> ・<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について。<br/> ・あらゆる主体が水防災を理解できる場や水害を疑似体験・体感できる事例を紹介。<br/> 【東京都盲人福祉協会の事例】<br/> 【<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B9%AD%C5%E7%B8%A9">広島県</a>立広島中央特別支援学校の事例】<br/> ・<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>の情報は、命に関わる内容であり、ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応は重 要。<br/> ・障害の種類や年齢、個々人の属性に合わせて情報をカスタマイズできることが重要。<br/> ・あらゆる主体がウェブサイトの情報をより理解できるよう工夫している事例を紹介。<br/> 【公益財団法人<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B9%AD%C5%E7%BB%D4">広島市</a>障害者福祉協会ホームページ】<br/> 【<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B5%FE%C5%D4%BB%D4">京都市</a>ホームページ】<br/> 【<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B9%BE%B8%CD%C0%EE%B6%E8">江戸川区</a>ホームページ「区役所へのアクセス」の事例】<br/> 【<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B5%FE%C5%D4%C2%E7%B3%D8">京都大学</a> 学生総合支援機構 障害学生支援部門ホームページ】</p></blockquote> <p>「あらゆる主体が水防災を理解できる場や水害を疑似体験・体感できる事例を紹介。」というのは、第4回の<a href="https://www.mlit.go.jp/river/shinngikai_blog/universal_design/pdf/dai4kai/shiryou2-1.pdf">【資料2-1】_WEBアクセシビリティへの対応について</a>にあるスライド8にあります。読む限りではまるでウェブと関係ない。ウェブという話を抜きにしても、スライドを見るだけでは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>と結びつくのかどうかも怪しい。「誰でも」疑似体験できることを強調したいのでしょうか? というか、災害は年齢や障害の有無というような人間の属性に関係なく平等に襲ってくるわけで、災害の事象自体は直接<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>関係なくないですか。</p> <p>まあ、他にもこの第4回の資料でしたり、第3回の<a href="https://www.mlit.go.jp/river/shinngikai_blog/universal_design/pdf/dai3kai/shiryou5.pdf">【資料5】Webアクセシビリティへの対応について</a>あたりをまとめたのが骨子案でしょうけど、スライド3には次のような文言があります。</p> <blockquote><p><a class="keyword" href="http://d.hatena.ne.jp/keyword/WEB%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">WEBアクセシビリティ</a>の品質を確保する際の拠り所として、JIS X 8341-3があり大きく4 つに区分されている。</p> <p>1. 『知覚可能』 :ユーザーが自分の感覚の1つ以上を使用して何らかの方法でそれを知覚できなければならない<br/> (例えば)<br/> • 音声読み上げを行った際に正しく認知できるような配慮 など<br/> (「リンク先はこちら」では、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%EB%B3%D0%BE%E3%B3%B2">視覚障害</a>者には伝わらない)</p> <p>2. 『操作可能』 :容易に操作できなければならない<br/> (例えば)<br/> • 障害者は、マウスを使用できないことも多いため、キーボードだけでも操作ができるような対応 など</p> <p>3. 『理解可能』 :情報内容や操作画面などが容易に理解可能でなければならない (例えば)<br/> • 情報内容が容易に理解できるようにやさしい日本語による対応 など</p> <p>4. 『堅ろう(堅牢)』 :技術の進歩に応じてコンテンツにアクセスできなければならない<br/> (例えば)<br/> • パソコンや<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>など様々なデ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%A4%A5%B9">バイス</a>でレイアウトが崩れないような対応 など</p></blockquote> <p>まずもって、1.『知覚可能』に例示された「リンク先はこちら」でおなじみ?の<a href="https://waic.jp/docs/WCAG21/Understanding/link-purpose-in-context.html">リンクの目的 (コンテキスト内)</a>は達成基準2.4.4なので、ここにカテゴライズされるのがおかしい。</p> <p>3. 『理解可能』で例示されたやさしい日本語は、<a href="https://waic.jp/docs/WCAG21/Understanding/readable.html">ガイドライン 3.1</a>にぶら下がっている達成基準を当てはめていると主張するものだと思いますけれども、WCAGとしてそういう意図ではない、というように筆者は認識しています。(しかし、それはそれとして、防災や災害対応で「やさしい日本語」が日本語<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CD%A5%A4%A5%C6%A5%A3%A5%F4">ネイティヴ</a>ではない主に外国の方にとって有用であることは疑いようはなく、これを否定するものではないということは明言しておきます。)</p> <p>4. 『堅ろう(堅牢)』で例示される、「パソコンや<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>など様々なデ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D0%A5%A4%A5%B9">バイス</a>でレイアウトが崩れないような対応」は、達成基準 1.4.10<a href="https://waic.jp/docs/WCAG21/Understanding/reflow.html">リフロー</a>などが当てはまると思いますので、これはこれでおかしなことになっている。</p> <p>結局のところ、2. 『操作可能』しか正しい例示ができておらず、WCAGの理解が根本的におかしいので、まったく信用できませんね。もっとも、委員の方々は主に防災の専門家であって、ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の専門家ではないですから、致し方ない面はあるとはいえ、これではね…。</p> <p>さて、『本検討会報告の骨子案』に戻って。</p> <blockquote><p>〇標準化の流れについて<br/> ・ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の品質確保のための<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>は、多種多様。<br/> ・2016 年 3 月には、WCAG 2.0、ISO/IEC 40500:2012、JIS X 8341-3:2016 の 3 つが全 て技術的に同じ内容となる。(<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> の勧告、国際規格の ISO、国内規格の JIS が完全に統一)<br/> ・参考となる基準や<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>。<br/> 【ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>方針策定<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>】<br/> 【JIS X 8341-3:2016 対応発注<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>】<br/> 【JIS X 8341-3:2016 試験実施<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>】</p></blockquote> <p><a href="https://www.soumu.go.jp/main_sosiki/joho_tsusin/b_free/guideline.html">みんなの公共サイト運用ガイドライン</a>の文字列がないことに怒っていいと思うんですよ。</p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%CF%A5%B6%A1%BC%A5%C9%A5%DE%A5%C3%A5%D7">ハザードマップ</a>の性質上、国や<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>が提供するものだと思っているのですけど、ここでみんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に触れていないというのはどういうことなのでしょうか。WCAGやJISの話、どこぞの<a href="https://waic.jp/docs/jis2016/accessibility-plan-guidelines/202112/">ウェブアクセシビリティ方針策定ガイドライン</a>やらの話があって、なぜみんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に触れていないのか、「運用」とタイトルに入ってないからいけないのか?</p> <p>もっとも、第4回の検討会が行われたのが今年11月末なので、12月になって公開されたデジタル庁の<a href="https://www.digital.go.jp/resources/introduction-to-web-accessibility-guidebook/">ウェブアクセシビリティ導入ガイドブック</a>が間に合わなかったのは致し方ところではあります。今からガイドブックを参照してもらうなりして、しっかりとした<a class="keyword" href="http://d.hatena.ne.jp/keyword/Web%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">Webアクセシビリティ</a>の知識を織り込んだ上で、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E6%A5%CB%A5%D0%A1%BC%A5%B5%A5%EB%A5%C7%A5%B6%A5%A4%A5%F3">ユニバーサルデザイン</a>の観点(?)での報告書にしてもらうのを心より願っています。</p> <hr /> <p>しかし、ICTの利活用に関わる場にもかかわらず、デジタル庁がオブザーバーに入っていないのはそういうものなんですかね?(委員名簿を見てもらえばわかります)</p> <p>現に誤ったWCAGの理解のもとで<a class="keyword" href="http://d.hatena.ne.jp/keyword/Web%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">Webアクセシビリティ</a>という言葉だけが一人歩きする大変困ったことが起きているわけで、このままですと今後も同様の事態が起きることになることは容易に予想され、本質的にアクセシブルではない悲しいWebサイトが量産されていく未来が視えます。</p> <p>こういう悲しいことが起きないようにするための、各省庁を横断するような情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の司令塔がデジタル庁だと思っているのですが、残念ながら機能しておらず、システム作りが急務といえるでしょう…。</p> momdo ブログネタ帳の掃除:アクセシビリティ関連で記事にできなかったものたち hatenablog://entry/4207112889942013060 2022-12-03T20:00:39+09:00 2022-12-03T20:00:39+09:00 年の瀬も近づいてきましたし、大掃除的な。 Google Keepにネタを書き留めてたけど、自分でもよくわかんなかったりしてるものもあるので、ここで吐き出してしまおう。 わかる範囲でコメントをしている。一種のソーシャルブックマークとしてお楽しみください(?) WCAG2ICT Guidance on Applying WCAG 2.2 to Non-Web Information and Communications Technologies (WCAG2ICT) W3C Editor's Draft 28 November 2022 https://w3c.github.io/wcag2ict… <p>年の瀬も近づいてきましたし、大掃除的な。<br/> <a class="keyword" href="http://d.hatena.ne.jp/keyword/Google">Google</a> Keepにネタを書き留めてたけど、自分でもよくわかんなかったりしてるものもあるので、ここで吐き出してしまおう。<br/> わかる範囲でコメントをしている。一種の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%BD%A1%BC%A5%B7%A5%E3%A5%EB%A5%D6%A5%C3%A5%AF%A5%DE%A1%BC%A5%AF">ソーシャルブックマーク</a>としてお楽しみください(?)</p> <h2 id="WCAG2ICT">WCAG2ICT</h2> <p>Guidance on Applying WCAG 2.2 to Non-Web Information and Communications Technologies (WCAG2ICT)<br/> <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Editor's Draft 28 November 2022<br/> <a href="https://w3c.github.io/wcag2ict/#resize-text">https://w3c.github.io/wcag2ict/#resize-text</a></p> <p>モバイル端末で200%ズームの云々を業務時間中に書きためたんだと思う…(?)</p> <h2 id="見出しレベルの話">見出しレベルの話</h2> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/Twitter">Twitter</a>で盛り上がってたアレ。</p> <p>HTML のアウトライン<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%EB%A5%B4%A5%EA%A5%BA%A5%E0">アルゴリズム</a>が見出しレベルをベースとしたものに刷新されそう<br/> <a href="https://blog.w0s.jp/671">https://blog.w0s.jp/671</a><br/> で大体まとまっているので別に書くことないか…で止まった記憶が。</p> <h2 id="Nu-Html-Checkerのエラーメッセージを考える">Nu Html Checkerのエラーメッセージを考える</h2> <p>このブログで上流というか発注側みたいな話ですとか、概念的な話ばかりしているので、たまには(?)現場目線の話でもしようか…とか思ってたらしい。<br/> いろいろあって書く前に手が止まった。</p> <h2 id="国連の勧告ってなんぞ">国連の勧告ってなんぞ</h2> <ul> <li><a href="https://www.shugiin.go.jp/internet/itdb_shitsumon.nsf/html/shitsumon/b200156.htm">https://www.shugiin.go.jp/internet/itdb_shitsumon.nsf/html/shitsumon/b200156.htm</a></li> <li><a href="https://www8.cao.go.jp/shougai/suishin/tyosa/r01kokusai/index.html">https://www8.cao.go.jp/shougai/suishin/tyosa/r01kokusai/index.html</a></li> </ul> <p>国連の勧告の位置付けよくわかんないよね…で調べかけてて、やっぱりよくわからないとなって。</p> <h2 id="ARIA-AT-CGの話"><a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a>-AT CGの話</h2> <p><a href="https://www.w3.org/2022/09/15-aria-minutes">https://www.w3.org/2022/09/15-aria-minutes</a></p> <p>TPAC 2022のminutesで話があったもの。</p> <p><a href="https://github.com/w3c/aria-at">https://github.com/w3c/aria-at</a></p> <blockquote><p>This repo contains a test suite and harness for assessing assistive technology (AT) support of <a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a>. These tests are designed to be modular and embeddable in higher-level applications. A web app for managing test cycles and reporting test results (<a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a>-AT-App) is also being developed and is planned to be available on w3.org in June 2020.</p></blockquote> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/Google">Google</a>訳</p> <p>この<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%EA%A5%DD%A5%B8%A5%C8%A5%EA">リポジトリ</a>には、<a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a> の支援技術 (AT) サポートを評価するためのテスト スイートとハーネスが含まれています。 これらのテストはモジュール化され、上位レベルのアプリケーションに組み込み可能になるように設計されています。 テスト サイクルを管理し、テスト結果を報告するための Web アプリ (<a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a>-AT-App) も開発中であり、2020 年 6 月に w3.org で利用できるようになる予定です。</p> <p>面白いと思うんですけどね。ただまあCGってところがアレですかね的な。</p> <h2 id="英語の辞典からみるアクセシビリティ">英語の辞典からみる<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a></h2> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/access">access</a> + ableと分解するのが素直な考え方かと思うけれども、語源辞書を引くと違う見方ができる…というのを書きたかったらしい。</p> <ul> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/access">access</a> | etymonline <ul> <li><a href="https://www.etymonline.com/word/access">https://www.etymonline.com/word/access</a></li> </ul> </li> <li>accessible adjective - OxfordLearnersDictionaries.com <ul> <li><a href="https://www.oxfordlearnersdictionaries.com/definition/english/accessible?q=accessible">https://www.oxfordlearnersdictionaries.com/definition/english/accessible?q=accessible</a></li> </ul> </li> <li>accessible | etymonline <ul> <li><a href="https://www.etymonline.com/word/accessible?ref=etymonline_crossreference">https://www.etymonline.com/word/accessible?ref=etymonline_crossreference</a></li> </ul> </li> <li>-ity | etymonline <ul> <li><a href="https://www.etymonline.com/word/-ity?ref=etymonline_crossreference">https://www.etymonline.com/word/-ity?ref=etymonline_crossreference</a></li> </ul> </li> </ul> <h2 id="障害者基本計画とは何か">障害者基本計画とは何か?</h2> <p>障害者差別解消法との関係、とだけある。まあ、条文を引っ張ってくればそれで終わるとかそんなことを考えていたに違いない。</p> <h2 id="Feature-Policyがカオス">Feature-Policyがカオス</h2> <p>これに至ってはタイトルだけのメモである。そもそも仕様的にはPermissions Policyに変わっているわけで、何を思ってたのか。<br/> というか<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>関係ないのでは。</p> <h2 id="アクセシビリティギャップ解析"><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>ギャップ解析</h2> <p>スクリーンリーダーで読み上げさせてみる(聴覚<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%EC%A5%F3%A5%C0%A5%EA%A5%F3%A5%B0">レンダリング</a>)</p> <p>なんだこれ(なんだこれ?)</p> <h2 id="31コントラスト比をもっと">3:1<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト比をもっと</h2> <p><a href="https://www.kanzaki.com/memo/2005/11/27-1">ちょっとしたメモ - 輝度比による文字色と背景色のコントラスト評価</a>とだけある。 ISO 9241-303:2011の複写請求で詰んでたのを思い出した。<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B9%F1%B2%F1%BF%DE%BD%F1%B4%DB">国会図書館</a>関西館が来い。</p> <h2 id="キャプチャとアクセシビリティ">キャプチャと<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a></h2> <p>Inaccessibility of <a class="keyword" href="http://d.hatena.ne.jp/keyword/CAPTCHA">CAPTCHA</a> Alternatives to Visual Turing Tests on the Web W3C Group Draft Note 16 December 2021 <a href="https://www.w3.org/TR/2021/DNOTE-turingtest-20211216/">https://www.w3.org/TR/2021/DNOTE-turingtest-20211216/</a></p> <p>自分が以前に読んでいたバージョンから更新されたのをいいたかったんだろうな。</p> <h2 id="無題">(無題)</h2> <ul> <li><a href="https://wicg.github.io/aom/notification-api.html">Accessibility (ARIA) Notification API | aom</a> <ul> <li><a href="https://www.w3.org/2022/04/14-aria-minutes">https://www.w3.org/2022/04/14-aria-minutes</a></li> </ul> </li> <li><a href="https://github.com/w3c/aria/issues/1746">Consider adding a 'decorative image' role · Issue #1746 · w3c/aria</a></li> <li><a href="https://w3c.github.io/mathml-docs/gap-analysis/#intent">MathML Accessibility Gap Analysis | mathml-docs</a></li> <li><a href="https://www.w3.org/2022/03/03-aria-minutes#t12">ARIA WG – 03 March 2022</a></li> </ul> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/ARIA">ARIA</a> WGのminutesを漁って何かを書きたかったんだろうなあ…。</p> <p>「&lt;img alt=""&gt;のtitle属性の扱い」という書きかけのメモがあったけれども、不正確なのでここには書かないでおこう。</p> <h2 id="ロービジョンのコントラスト感度特性">ロービジョンの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%C8%A5%E9">コントラ</a>スト感度特性</h2> <p><a href="https://www.jstage.jst.go.jp/article/jergo/45spl/0/45spl_0_368/_article/-char/ja/">https://www.jstage.jst.go.jp/article/jergo/45spl/0/45spl_0_368/_article/-char/ja/</a></p> <p>このURLをメモしておきたかったんでしょう…それ以上の意味はなさそう。</p> <h2 id="対応方針">対応方針</h2> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%C3%C8%F1%BC%D4%C4%A3">消費者庁</a>所管事業分野における障害を理由とする差別の解消の推進に関する対応指針</p> <p>なぜ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BE%C3%C8%F1%BC%D4%C4%A3">消費者庁</a>なのか。</p> <h2 id="PDF奴">PDF奴</h2> <p>神戸市ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>方針 <a href="https://www.city.kobe.lg.jp/a57337/homepage/web_accessibility/policy/index.html">https://www.city.kobe.lg.jp/a57337/homepage/web_accessibility/policy/index.html</a></p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C0%AF%CE%E1">政令</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%D8%C4%EA%BB%D4">指定市</a>ですら、PDFが方針の対象外になっていることを嘆いている的な。</p> <ul> <li>PDFのタグ付け解析方法(<a class="keyword" href="http://d.hatena.ne.jp/keyword/Acrobat">Acrobat</a>を使わなくてもできるのか?)</li> <li>デジタル庁</li> <li>みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a></li> </ul> <p>をキーワードにして何かを書きたかった模様。</p> <h2 id="input-type-password-whawghtml">input type password whawg/html</h2> <p><code>&lt;input type=password&gt;</code> should provide UI to show/hide its <a class="keyword" href="http://d.hatena.ne.jp/keyword/value">value</a> · Issue #7293 · <a class="keyword" href="http://d.hatena.ne.jp/keyword/whatwg">whatwg</a>/html<br/> <a href="https://github.com/whatwg/html/issues/7293">https://github.com/whatwg/html/issues/7293</a></p> <p>よくあるパスワードを出したり隠したりするやつが<a class="keyword" href="http://d.hatena.ne.jp/keyword/whatwg">whatwg</a>/htmlにissue立ってます的な。</p> <h2 id="合理的配慮の悪い事例集">合理的配慮の悪い事例集?</h2> <ul> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/Web%C9%B8%BD%E0">Web標準</a>に従わない要件があるのでは</li> <li>そもそもそういう事例はどこから導出されたのか?</li> </ul> <p>(?)</p> <h2 id="color-contrast"><code>color-contrast()</code></h2> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/CSS">CSS</a> Color Module Level 5 (<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Working Draft, 28 April 2022)<br/> 3. Selecting the <a class="keyword" href="http://d.hatena.ne.jp/keyword/most">most</a> contrasting color: the color-contrast() function<br/> <a href="https://www.w3.org/TR/2022/WD-css-color-5-20220428/#colorcontrast">https://www.w3.org/TR/2022/WD-css-color-5-20220428/#colorcontrast</a></p> <p>いま仕様を見に行ったら、<br/> <a href="https://www.w3.org/TR/2022/WD-css-color-5-20220628/#changes-20220428">https://www.w3.org/TR/2022/WD-css-color-5-20220628/#changes-20220428</a>では</p> <blockquote><p>Moved the color-contrast() function to level 6</p></blockquote> <p>とあり、まあコンセプトってことですわね…。</p> <h2 id="無題-1">(無題)</h2> <p>Challenges with Accessibility Guidelines Conformance and Testing, and Approaches for Mitigating Them<br/> <a href="https://www.w3.org/TR/2020/WD-accessibility-conformance-challenges-20200619/">https://www.w3.org/TR/2020/WD-accessibility-conformance-challenges-20200619/</a></p> <p>訳:<br/> このドキュメントでは、WCAG 2.0および2.1<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>のページベースの適合性検証が、特定のWebサイトおよびWebアプリケーションにどのように適用するのが難しいかについて説明します。このドキュメントでは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>の将来のバージョンがこれらの課題にどのように対処するかについてのア<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A4%A5%C7%A5%A2">イデア</a>についても説明します。このドキュメントは、主に大規模で非常に複雑な動的サイトへの課題に焦点を当てています。WAIの他の取り組みでは、さまざまなタイプのサイトの適合性のさまざまな側面を検討しています。</p> <p>まあ、なんか読んでたな的な。</p> <p>Making Content Usable for People with Cognitive and Learning Disabilities<br/> <a href="https://www.w3.org/TR/coga-usable/">https://www.w3.org/TR/coga-usable/</a></p> <p>これもそんなのあったな、と。</p> <h2 id="情報アクセシビリティの推進">情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の推進</h2> <p><a href="https://kidachi.kazuhi.to/blog/archives/040529.html">https://kidachi.kazuhi.to/blog/archives/040529.html</a></p> <p>URLだけあった。何かを書きたかったのでしょう。</p> momdo 2022年秋アニメ主題歌 ミュージックビデオにみるアクセシビリティ hatenablog://entry/4207112889936216448 2022-11-13T18:08:42+09:00 2022-11-15T09:36:42+09:00 秋アニメ1話をいまだに全部見れていませんとかいう前口上はさておき。 大西亜玖璃 / はじまるウェルカム(TVアニメ「新米錬金術師の店舗経営」オープニングテーマ) - YouTube(レーベル:Nippon Columbia Co., Ltd. 1)を見たところ、YouTubeのオープンキャプションついとるやんけ、となったので、2022秋アニメまとめ一覧|10月放送開始 新作アニメ・再放送アニメ情報 | アニメイトタイムズにある主題歌を雑に見て2、アクセシビリティ観点3で目に付いたものを貼ってみるなど。 短評:ごく標準的な(?)YouTubeによるクローズドキャプションが提供。 ALI - NE… <p>秋アニメ1話をいまだに全部見れていませんとかいう前口上はさておき。</p> <p><a href="https://www.youtube.com/watch?v=Z_MVex_3sp0">大西亜玖璃 / はじまるウェルカム(TVアニメ「新米錬金術師の店舗経営」オープニングテーマ) - YouTube</a>(レーベル:Nippon Columbia Co., Ltd. <sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup>)を見たところ、<a class="keyword" href="http://d.hatena.ne.jp/keyword/YouTube">YouTube</a>のオープンキャプションついとるやんけ、となったので、<a href="https://www.animatetimes.com/tag/details.php?id=5947">2022秋アニメまとめ一覧|10月放送開始 新作アニメ・再放送アニメ情報 | アニメイトタイムズ</a>にある主題歌を雑に見て<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>観点<sup id="fnref:3"><a href="#fn:3" rel="footnote">3</a></sup>で目に付いたものを貼ってみるなど。</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/Z_MVex_3sp0" title="YouTube video player: はじまるウェルカム(TVアニメ「新米錬金術師の店舗経営」オープニングテーマ)" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:ごく標準的な(?)<a class="keyword" href="http://d.hatena.ne.jp/keyword/YouTube">YouTube</a>による<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AF%A5%ED%A1%BC%A5%BA%A5%C9%A5%AD%A5%E3%A5%D7%A5%B7%A5%E7%A5%F3">クローズドキャプション</a>が提供。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=37o2bFuHIUk">ALI - NEVER SAY GOODBYE feat. Mummy-D</a>(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B4%A1%BC%A5%EB%A5%C7%A5%F3%A5%AB%A5%E0%A5%A4">ゴールデンカムイ</a>第四期OP、レーベル:<a class="keyword" href="http://d.hatena.ne.jp/keyword/Sony%20Music%20Labels">Sony Music Labels</a> Inc.)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/37o2bFuHIUk" title="YouTube video player: ALI - NEVER SAY GOODBYE feat. Mummy-D" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AF%A5%ED%A1%BC%A5%BA%A5%C9%A5%AD%A5%E3%A5%D7%A5%B7%A5%E7%A5%F3">クローズドキャプション</a>として日英、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%C9%A5%CD%A5%B7%A5%A2%B8%EC">インドネシア語</a>、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DA%A5%A4%A5%F3%B8%EC">スペイン語</a>の4カ国語が提供。しかし、英語パートの歌詞がなぜか日本語訳になってしまっているのは…。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=AQnht4bWmxw">【MV】GARNiDELiA「幻愛遊戯」</a>(うちの師匠はしっぽがないOP、レーベル:<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DD%A5%CB%A1%BC%A5%AD%A5%E3%A5%CB%A5%AA%A5%F3">ポニーキャニオン</a>)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/AQnht4bWmxw" title="YouTube video player: 【MV】GARNiDELiA「幻愛遊戯」" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AF%A5%ED%A1%BC%A5%BA%A5%C9%A5%AD%A5%E3%A5%D7%A5%B7%A5%E7%A5%F3">クローズドキャプション</a>として日英、中国語(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B4%CA%C2%CE%BB%FA">簡体字</a>・<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C8%CB%C2%CE%BB%FA">繁体字</a>)、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A4%A5%F3%A5%C9%A5%CD%A5%B7%A5%A2%B8%EC">インドネシア語</a>、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DA%A5%A4%A5%F3%B8%EC">スペイン語</a>、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%BF%A5%A4%B8%EC">タイ語</a>、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%D9%A5%C8%A5%CA%A5%E0%B8%EC">ベトナム語</a>のなんと8カ国語が提供。日本語キャプションにはローマ字も添えられており、日本語ノンネイティブに嬉しいだろう。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=bSibPLEYTY8">鹿乃「いちごいちえ Celebration」【OFFICIAL】「宇崎ちゃんは遊びたい!ω」OP</a>(レーベル:<a href="https://www.teichiku.co.jp/artist/kano/">インペリアルレコード / テイチクエンタテインメント</a>)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/bSibPLEYTY8" title="YouTube video player: 鹿乃「いちごいちえ Celebration」【OFFICIAL】「宇崎ちゃんは遊びたい!ω」OP" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:オープンキャプションとして埋め込みされている。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=6xTeVoW61FM">鈴木このみ「Love? Reason why!!」MV full(TVアニメ「恋愛フロップス」OPテーマ)</a>(レーベル:<a class="keyword" href="http://d.hatena.ne.jp/keyword/KADOKAWA">KADOKAWA</a><sup id="fnref:4"><a href="#fn:4" rel="footnote">4</a></sup>)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/6xTeVoW61FM" title="YouTube video player: 鈴木このみ「Love? Reason why!!」MV full(TVアニメ「恋愛フロップス」OPテーマ)" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:書き起こしはもちろん、自動字幕起こしも無効化されており、厳しいですね…。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=fwzRR6Bsro4">【373】[feat. 美波, SAKURAmoti] アイウエ / MAISONdes</a>(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A4%A6%A4%EB%C0%B1%A4%E4%A4%C4%A4%E9">うる星やつら</a>(2022) OP、レーベル:<a class="keyword" href="http://d.hatena.ne.jp/keyword/Sony%20Music%20Labels">Sony Music Labels</a> Inc.)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/fwzRR6Bsro4" title="YouTube video player: 【373】[feat. 美波, SAKURAmoti] アイウエ / MAISONdes" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:動画に映像表現として歌詞が出てくるこの手のもの、果たして<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>の観点からキャプションと見なしてよいのか?というのは整理する必要がありそう。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=EHTu420gT2s">蒼井翔太 /「PSYCHO:LOGY」Official Audio</a>(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%DD%A5%D7%A5%C6%A5%D4%A5%D4%A5%C3%A5%AF">ポプテピピック</a> <a class="keyword" href="http://d.hatena.ne.jp/keyword/TV%A5%A2%A5%CB%A5%E1%A1%BC%A5%B7%A5%E7%A5%F3">TVアニメーション</a>作品第二シリーズOP、レーベル:KING RECORD CO., LTD)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/EHTu420gT2s" title="YouTube video player: 蒼井翔太 /「PSYCHO:LOGY」Official Audio" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:キャプションはなく、歌詞の書き起こしテキストのみ存在。</figcaption></figure></p> <p><a href="https://www.youtube.com/watch?v=3eytpBOkOFA">YOASOBI「祝福」Official Music Video (『機動戦士ガンダム 水星の魔女』オープニングテーマ) - YouTube</a>(レーベル:The Orchard Music <sup id="fnref:5"><a href="#fn:5" rel="footnote">5</a></sup>)</p> <p><figure><iframe width="560" height="315" src="https://www.youtube.com/embed/3eytpBOkOFA" title="YouTube video player: YOASOBI「祝福」Official Music Video (『機動戦士ガンダム 水星の魔女』オープニングテーマ) " allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><figcaption>短評:オープンキャプションとして埋め込みされている。また、歌詞の書き起こしテキストもありとアニメ本編同様にスキがなかった? ただし、1:27あたりからの間奏パートは<a href="https://www.youtube.com/watch?v=C7p1RIksKp8">英語バージョン</a>にはキャプションがあって、日本語バージョンにはキャプションがないのが惜しいか(映像表現としては存在する)</figcaption></figure></p> <p>とまあ、駆け足で眺めてみました。<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C3%F8%BA%EE%B8%A2">著作権</a>の問題もあったりするでしょうが、キャプションや書き起こしがあれば、日本語ネイティブはもちろん、ネイティブでない海外の方にも当然歌詞が伝わるわけで、継続的に頑張ってもらうと嬉しいですね、という締めくくりにしたいと思います。</p> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> <p>この記事内のレーベル表記は、基本的に<a class="keyword" href="http://d.hatena.ne.jp/keyword/YouTube">YouTube</a>にあるライセンス表記によります。<a class="keyword" href="http://d.hatena.ne.jp/keyword/YouTube">YouTube</a>になければ適当にぐぐったものを貼ってます。<a href="#fnref:1" rev="footnote">&#8617;</a></p></li> <li id="fn:2"> <p>途中で力尽きて一番下まで見たわけじゃないんだ。なので、おもしろ(?)なページはほかにもあるかもしれない。<a href="#fnref:2" rev="footnote">&#8617;</a></p></li> <li id="fn:3"> <p>映像・音声の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の達成基準に関する情報は、<a href="https://www.w3.org/WAI/media/av/planning/">Planning Audio and Video Media | Web Accessibility Initiative (WAI) | W3C</a>がもの凄く役に立つでしょう。<a href="#fnref:3" rev="footnote">&#8617;</a></p></li> <li id="fn:4"> <p><a href="https://ja.wikipedia.org/wiki/%E3%83%A1%E3%83%87%E3%82%A3%E3%82%A2%E3%83%95%E3%82%A1%E3%82%AF%E3%83%88%E3%83%AA%E3%83%BC#%E9%9F%B3%E6%A5%BD%E3%83%AC%E3%83%BC%E3%83%99%E3%83%AB">旧メディアファクトリー</a><a href="#fnref:4" rev="footnote">&#8617;</a></p></li> <li id="fn:5"> <p><a href="https://en.wikipedia.org/wiki/Sony_Music">Sony Music Entertainment</a>傘下。<a class="keyword" href="http://d.hatena.ne.jp/keyword/SME">SME</a> Japanではない。<a href="#fnref:5" rev="footnote">&#8617;</a></p></li> </ol> </div> momdo (メモ)障害者基本計画(第5次)本文案とかのらくがき hatenablog://entry/4207112889925870288 2022-10-09T16:08:18+09:00 2022-10-09T16:08:18+09:00 あるいは、JIS X 8341シリーズと情報アクセシビリティ自己評価様式 障害者基本計画(第5次)本文案 第71回 障害者政策委員会 議事次第 令和4年10月5日(水) 障害者基本計画(第5次) 本文案 ※ 第65 回、67 回、68 回障害者政策委員会から修正のあった箇所については、ins、del要素で表す1 主な箇所の抜粋 Ⅲ 各分野における障害者施策の基本的な方向 3.情報アクセシビリティの向上及び意思疎通支援の充実 【基本的考え方】 障害者情報アクセシビリティ・コミュニケーション施策推進法に基づき、障害者による情報の取得及び利用並びに意思疎通に係る施策を充実させ、障害者が必要な情報に円… <p>あるいは、JIS X 8341シリーズと情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式</p> <h2 id="障害者基本計画第5次本文案">障害者基本計画(第5次)本文案</h2> <p><a href="https://www8.cao.go.jp/shougai/suishin/seisaku_iinkai/k_71/index.html">第71回 障害者政策委員会 議事次第</a> 令和4年10月5日(水)</p> <p><a href="https://www8.cao.go.jp/shougai/suishin/seisaku_iinkai/k_71/pdf/s1.pdf">障害者基本計画(第5次) 本文案</a><br /> ※ 第65 回、67 回、68 回障害者政策委員会から修正のあった箇所については、<code>ins</code>、<code>del</code>要素で表す<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup></p> <p>主な箇所の抜粋</p> <blockquote><p>Ⅲ 各分野における障害者施策の基本的な方向<br /> 3.情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上及び意思疎通支援の充実</p> <p>【基本的考え方】<br /> <ins>障害者情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>・コミュニケーション施策推進法に基づき、障害者による情報の取得及び利用並びに意思疎通に係る施策を充実させ、</ins>障害者が必要な情報に円滑にアクセスすることができるよう、障害者に配慮した情報通信機器・サービス等の企画、開発及び提供の促進や、障害者が利用しやすい放送・出版の普及等の様々な取組を通じて情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上を<ins>一層</ins>推進する。あわせて、障害者が円滑に意思表示やコミュニケーションを行うことができるよう、意思疎通支援を担う人材の育成・確保やサービスの円滑な利用の促進、支援機器の開発・提供等の取組を通じて意思疎通支援の充実を図る。</p></blockquote> <p><br></p> <blockquote><p>(1) 情報通信における情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上<br /> ○ 研究開発やニーズ、ICTの発展等を踏まえつつ、情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の確保及び向上を促すよう、適切な標準化<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>を進めるとともに、必要に応じて国際規格提案を行う。また、各府省における情報通信機器等<sup id="fnref:3"><a href="#fn:3" rel="footnote">3</a></sup>の調達は、情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の観点に配慮し、国際規格、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%FC%CB%DC%BB%BA%B6%C8">日本産業</a>規格への準拠・配慮に関する関係法令に基づいて実施する。特に、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A3%D7%A3%D4%A3%CF">WTO</a>政府調達協定の適用を受ける調達等<sup id="fnref:4"><a href="#fn:4" rel="footnote">4</a></sup>を行うに当たっては、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A3%D7%A3%D4%A3%CF">WTO</a>政府調達協定等<sup id="fnref:5"><a href="#fn:5" rel="footnote">5</a></sup>の定めるところにより、適当な場合には、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>に関する国際規格が存在するときは当該国際規格<sup id="fnref:6"><a href="#fn:6" rel="footnote">6</a></sup>に基づいて技術仕様を定める。[3-(1)-2]</p></blockquote> <p><br></p> <blockquote><p><ins>○ 企業等が自社で開発するデジタル機器・サービスが情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>基準(JIS X 8341 シリーズ等)に適合しているかどうかを自己評価するチェックシート(通称:「日本版 VPAT」)等の普及展開を促進する。また、引き続き、デジタル・ガバメント推進標準<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>に則り、政府情報システムに係る調達において「日本版 VPAT」の書式を用いて、障害の種類・程度を考慮した確認を求める。</ins>[3-(1)-3]</p></blockquote> <p><br></p> <blockquote><p>(4) 行政情報の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上<br /> ○ 各府省において、障害者を含む全ての人の利用しやすさに配慮した行政情報の電子的提供の充実に取り組むとともに、ウェブサイト等で情報提供を行うに当たっては、キーボードのみで操作可能な仕様の採用、動画への字幕や音声解説の付与など、<ins>最新のウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>規格を踏まえ、</ins><del>「みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」に即した</del>必要な対応を行う。また、<ins>「みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a><sup id="fnref:7"><a href="#fn:7" rel="footnote">7</a></sup>」について必要な見直しを行うこと等により、公的機関等の</ins><del><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>等の公的機関における</del>ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等に向けた取組を促進する。[3-(4)-2]</p></blockquote> <h2 id="JIS-X-8341シリーズ">JIS X 8341シリーズ</h2> <p><img src="https://www8.cao.go.jp/shougai/whitepaper/h24hakusho/zenbun/zuhyo/img/zuhyo1-94.gif" alt="アクセシビリティに関する規格体系 ①基本規格(ガイド71) すべての製品・サービスに関わる基本となるもの ②分野別共通規格(セクターガイド) 分野内で共通とするもの〈考え方や個別機能〉 ③個別規格(製品規格・ガイドライン)" /></p> <p>令和4年版<a href="https://www8.cao.go.jp/shougai/whitepaper/index-w.html">障害者白書</a>の<a href="https://www8.cao.go.jp/shougai/whitepaper/r04hakusho/zenbun/pdf/s5-2.pdf#page=2">図表5-11 アクセシビリティに関する規格体系</a>にも(現在の規格に沿った)類似の図が載っている</p> <p><a href="https://webdesk.jsa.or.jp/books/W11M0070/index">JSA 規格検索結果 JIS規格 X8341</a></p> <ul> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+Z+8071%3A2017">JIS Z 8071:2017</a> <ul> <li><a href="https://www.iso.org/standard/57385.html">ISO/IEC Guide 71:2014</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) <ul> <li>ISO/<a class="keyword" href="http://d.hatena.ne.jp/keyword/TMBG">TMBG</a> Technical Management Board - groups</li> </ul> </li> <li>規格における<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>配慮のための指針</li> <li>Guide for addressing accessibility in standards</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-1%3A2010">JIS X 8341-1:2010</a> <ul> <li><a href="https://www.iso.org/standard/40727.html">ISO 9241-20:2008</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) revised by <a href="https://www.iso.org/standard/80709.html">ISO 9241-20:2021</a> <ul> <li>ISO/TC 159/SC 4 Ergonomics of human-system interaction</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第1部:共通指針</li> <li>(ISO 9241-20:2008) Ergonomics of human-system interaction — Part 20: Accessibility guidelines for information/communication technology (ICT) equipment and services</li> <li>(ISO 9241-20:2021) Ergonomics of human-system interaction — Part 20: An ergonomic approach to accessibility within the ISO 9241 series</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-2%3A2014">JIS X 8341-2:2014</a> <ul> <li><a href="https://www.iso.org/standard/45159.html">ISO/IEC 29136:2012</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) <ul> <li>ISO/IEC JTC 1/SC 35 User interfaces</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第2部:パーソナルコンピュータ</li> <li>Information technology — User interfaces — Accessibility of personal computer hardware</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-3%3A2016">JIS X 8341-3:2016</a> <ul> <li><a href="https://www.iso.org/standard/58625.html">ISO/IEC 40500:2012 (IDT)</a> / <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> <a href="https://www.w3.org/TR/2008/REC-WCAG20-20081211/">WCAG 2.0</a> <ul> <li>2023年以降に<a href="https://www.w3.org/TR/2022/CR-WCAG22-20220906/">WCAG 2.2</a>に改訂???</li> <li>ISO/IEC JTC 1 Information technology</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第3部:ウェブコンテンツ</li> <li>Information technology — <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Web Content Accessibility Guidelines (WCAG) 2.0</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-4%3A2018">JIS X 8341-4:2018</a> <ul> <li>対応国際規格:なし <ul> <li>「この規格は,2007 年に発行された <a href="https://www.itu.int/rec/T-REC-F.790-200701-I/en">ITU-T F.790</a>を参考に作成しているが,技術的内容を変更して作成した<a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%FC%CB%DC%B9%A9%B6%C8%B5%AC%B3%CA">日本工業規格</a>である。」</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第4部:電気通信機器 <ul> <li>Telecommunications accessibility guidelines for older persons and persons with disabilities</li> </ul> </li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-5%3A2022">JIS X 8341-5:2022</a> <ul> <li><a href="https://www.iso.org/standard/77594.html">ISO/IEC 10779:2020</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) <ul> <li>ISO/IEC JTC 1/SC 28 Office equipment</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第5部:<a class="keyword" href="http://d.hatena.ne.jp/keyword/%BB%F6%CC%B3%B5%A1">事務機</a>器</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-6%3A2013">JIS X 8341-6:2013</a> <ul> <li><a href="https://www.iso.org/standard/39080.html">ISO 9241-171:2008</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) <ul> <li>ISO/TC 159/SC 4 Ergonomics of human-system interaction</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第6部:対話ソフトウェア</li> <li>Information technology — Office equipment — Accessibility guidelines for older persons and persons with disabilities</li> </ul> </li> <li><a href="https://webdesk.jsa.or.jp/books/W11M0090/index/?bunsyo_id=JIS+X+8341-7%3A2011">JIS X 8341-7:2011</a> <ul> <li><a href="https://www.iso.org/standard/41556.html">ISO/IEC 24786:2009</a> (<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>) <ul> <li>ISO/IEC JTC 1/SC 35 User interfaces</li> </ul> </li> <li>高齢者・障害者等配慮設計指針―情報通信における機器,ソフトウェア及びサービス―第7部:<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>設定</li> <li>Information technology — User interfaces — Accessible <a class="keyword" href="http://d.hatena.ne.jp/keyword/user%20interface">user interface</a> for accessibility settings</li> </ul> </li> </ul> <p><a href="https://doi.org/10.5100/jje.58.S1B1-04">アクセシビリティに関する人間工学関連規格の動向 -9241-20の改定に伴うアクセシビリティ関連規格の課題と今後についての検討-</a> <a class="keyword" href="http://d.hatena.ne.jp/keyword/J-STAGE">J-STAGE</a>公開日: 2022/09/01</p> <blockquote><p>JIS X 8341-1:2010をISO 9241-20:2021に一致(<a class="keyword" href="http://d.hatena.ne.jp/keyword/IDT">IDT</a>)させて改定することは、関連する規格に対する影響が大きいことが予想されるため、ISO 9241-1:2021は内容が一致するJIS規格を新たに作成し、現行のJIS X 8341-1:2010は、内容を変更せず、対応国際規格無しのJISとして改定する方針がたてられた。</p></blockquote> <p>ええっ…一部なりとも内容が重複するJISを並立させるということ(?)</p> <h2 id="VPAT">VPAT</h2> <p><a href="https://en.wikipedia.org/wiki/Voluntary_Product_Accessibility_Template">Voluntary Product Accessibility Template - Wikipedia</a></p> <blockquote><p>The template is a registered service mark of the Information Technology Industry Council (ITI).</p></blockquote> <p>例:<a href="https://www.google.com/accessibility/customers-partners/">お客様およびパートナー様向け – Google ユーザー補助機能</a></p> <p>自主的製品<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a> テンプレート(VPAT)</p> <blockquote><p>企業、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%B6%B5%B0%E9%B5%A1%B4%D8">教育機関</a>、政府機関がユーザー補助の標準に準拠しやすくなるように、<a class="keyword" href="http://d.hatena.ne.jp/keyword/Google">Google</a> では、障がいのあるユーザー向けに <a class="keyword" href="http://d.hatena.ne.jp/keyword/Google">Google</a> のプロダクトで現在行っている取り組みについて透明性のある情報を提供しています。以下の自主的製品<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a> テンプレート(VPAT)をご覧ください。新たな VPAT ドキュメントの追加に伴い、引き続きこのサイトを更新していく予定です。</p></blockquote> <h3 id="情報アクセシビリティ自己評価様式">情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式</h3> <p><a href="https://www.soumu.go.jp/main_sosiki/joho_tsusin/b_free/b_free02.html">ICT機器・サービスのアクセシビリティ推進 - 総務省|情報バリアフリー環境の整備|情報アクセシビリティの確保</a></p> <p><a href="https://www.soumu.go.jp/main_content/000744304.pdf">【作成要領】情報アクセシビリティ自己評価様式(日本版VPAT)の作成に向けて</a></p> <blockquote><p>3.作成手順<br /> (2)「様式作成時の技術基準」の選択・作成<br /> 用いる技術基準を選択します。技術基準は以下の3パターンがあります。<br /> なお、基本としては、パターン②及び③については既に<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%E1%A5%EA">アメリ</a>カおよびヨーロッパに参入している、または参入を検討しており、これら規格への対応を整理している、または整理する予定であるICT機器・サービスにおいてのみ利用とし、それら以外はパターン①を技術基準として用いてください。</p></blockquote> <ul> <li>パターンA 技術基準としてJISx8341シリーズを利用</li> <li>パターンB 技術基準として米国<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%EA%A5%CF%A5%D3%A5%EA%A5%C6%A1%BC%A5%B7%A5%E7%A5%F3">リハビリテーション</a>法508条を利用</li> <li>パターンC 技術基準としてEN規格(EN 301 549)を利用</li> </ul> <p>パターン①、②、③が見当たりませんが、おそらくパターンA、B、Cのことでしょう…。</p> <p>「x」と小文字で表記されているのは気になりますが<sup id="fnref:8"><a href="#fn:8" rel="footnote">8</a></sup>それはさておき、JIS X 8341-3:2016を選択して、Section 508やEN 301 549と整合性の取れる情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式を作成することができるのでしょうか…(?)</p> <h3 id="情報アクセシビリティ自己評価様式の普及展開に関する調査研究令和3年度">情報<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>自己評価様式の普及展開に関する調査研究(令和3年度)</h3> <p><a href="https://www.soumu.go.jp/main_content/000811278.pdf">令和3年度 情報アクセシビリティ基準適合に関する自己評価の 普及展開に関する請負 -報告書(概要版)-</a></p> <blockquote><p>技術基準(JISx8341シリーズ)の問題点について また、JISx8341シリーズの改訂が欧米規格の更新に間に合っていないこと、JIS規格は作成されて10年以上経過しており技術水準が当時から進歩している。</p></blockquote> <p>🤔🤔🤔</p> <h2 id="障害者基本計画第5次本文案の再掲と雑感">障害者基本計画(第5次)本文案の再掲と雑感</h2> <blockquote><p>(4) 行政情報の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上<br /> ○ 各府省において、障害者を含む全ての人の利用しやすさに配慮した行政情報の電子的提供の充実に取り組むとともに、ウェブサイト等で情報提供を行うに当たっては、キーボードのみで操作可能な仕様の採用、動画への字幕や音声解説の付与など、<ins>最新のウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>規格を踏まえ、</ins><del>「みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」に即した</del>必要な対応を行う。また、<ins>「みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>[^29]」について必要な見直しを行うこと等により、公的機関等の</ins><del><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C3%CF%CA%FD%B8%F8%B6%A6%C3%C4%C2%CE">地方公共団体</a>等の公的機関における</del>ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の向上等に向けた取組を促進する。[3-(4)-2]</p></blockquote> <ul> <li>「キーボードのみで操作可能な仕様の採用、動画への字幕や音声解説の付与など」と書いているわりには、これらのウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>対応が特段に進んでいるとは思えない <ul> <li>そもそも、なぜこの3つの具体的な達成基準を意識した文言が取り上げらているのかが謎</li> </ul> </li> <li>「最新のウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>規格を踏まえ」という文言が入ったのも謎 <ul> <li>WCAG 2.2がISO化するだろうことを見込んでいる? <ul> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>対応という文脈で、WCAG 2.0の後続仕様であるWCAG 2.1の話が出てきたりするが、別にWCAG 2.1あるいは2.2になったからといって技術的に<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B9%A5%DE%A1%BC%A5%C8%A5%D5%A5%A9%A5%F3">スマートフォン</a>対応が進むわけではない</li> </ul> </li> <li>ここでいう「規格」はISO/IECの国際規格だとしたら、そう書く必要性を感じない</li> <li>"<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%C7%A5%D5%A5%A1%A5%AF%A5%C8%A5%B9%A5%BF%A5%F3%A5%C0%A1%BC%A5%C9">デファクトスタンダード</a>"である<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a>"技術文書"を参照するのであれば、まだわかるが</li> </ul> </li> <li>『「みんなの公共サイト運用<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>」について必要な見直しを行うこと等』という文言が入ったのは評価したい <ul> <li>「等」とあり、民間向けの<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%AC%A5%A4%A5%C9%A5%E9%A5%A4%A5%F3">ガイドライン</a>策定も視野に入るかもしれない</li> </ul> </li> </ul> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> <p>原文では《二重山形かっこ書き》で前後を挟んでいるもの。<a href="#fnref:1" rev="footnote">&#8617;</a></p></li> <li id="fn:2"> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%FC%CB%DC%BB%BA%B6%C8">日本産業</a>規格等を想定。<a href="#fnref:2" rev="footnote">&#8617;</a></p></li> <li id="fn:3"> <p>ウェブコンテンツ(掲載情報)に関するサービスやシステムを含む。<a href="#fnref:3" rev="footnote">&#8617;</a></p></li> <li id="fn:4"> <p>政府調達に関する議定書(以下「議定書」という。)の適用を受ける調達若しくは政府調達に関する協定を改正する議定書(以下「改正議定書」という。)の適用を受ける調達又は「政府調達手続に関する運用指針等について」(<a class="keyword" href="http://d.hatena.ne.jp/keyword/%CA%BF%C0%AE26%C7%AF">平成26年</a>3月31日関係省庁申合せ。以下「運用指針等」という。)の適用を受ける調達をいう。<a href="#fnref:4" rev="footnote">&#8617;</a></p></li> <li id="fn:5"> <p>議定書若しくは改正議定書又は運用指針等をいう。<a href="#fnref:5" rev="footnote">&#8617;</a></p></li> <li id="fn:6"> <p>JISZ8071「規格における<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>配慮のための指針」など、国際規格に整合する国内の指針等を含む。<a href="#fnref:6" rev="footnote">&#8617;</a></p></li> <li id="fn:7"> <p>ウェブ<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>(誰もがウェブサイト等で提供される情報や機能を支障なく利用できること)の維持・向上に向けた公的機関の取組を支援することを目的とした手順書。<a href="#fnref:7" rev="footnote">&#8617;</a></p></li> <li id="fn:8"> <p>固有名詞を間違えるの、よくないと思うんですよ。<a href="#fnref:8" rev="footnote">&#8617;</a></p></li> </ol> </div> momdo (メモ)W3Cアクセシビリティ成熟度モデルの話 hatenablog://entry/4207112889917062502 2022-09-11T11:54:53+09:00 2022-09-11T11:54:53+09:00 界隈的にはWCAG 2.2 CRが話題になってると思いますけども、WCAG 2.2 CRと同じ日に、ドラフトノートとしてW3C Accessibility Maturity Model(W3Cアクセシビリティ成熟度モデル)という文書が発行されています。 これは何なのか?というのは、この文書のAbstractには次のようにあります。 The W3C Accessibility Maturity Model is a guide for organizations to evaluate and improve their business processes to produce digital… <p>界隈的には<a href="https://www.w3.org/TR/2022/CR-WCAG22-20220906/">WCAG 2.2 CR</a>が話題になってると思いますけども、WCAG 2.2 CRと同じ日に、ドラフトノートとして<a href="https://www.w3.org/TR/2022/DNOTE-maturity-model-20220906/">W3C Accessibility Maturity Model</a>(<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>成熟度モデル)という文書が発行されています。</p> <p>これは何なのか?というのは、この文書のAbstractには次のようにあります。</p> <blockquote><p>The <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Accessibility Maturity Model is a guide for organizations to evaluate and <a class="keyword" href="http://d.hatena.ne.jp/keyword/improve">improve</a> their business processes to produce digital products that are accessible to people with disabilities. Use of the <a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a> Accessibility Maturity Model will provide organizations informative guidance (guidance that is not normative and does not set requirements) on improving accessibility policies, processes, and outcomes.</p> <p>This document is designed to work for any size of organization, from small to large corporations or government agencies. Additionally, this is intended to be independent of the requirements set forth in relevant technical accessibility standards, such as the Web Content Accessibility Guidelines (WCAG).</p></blockquote> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/Google">Google</a>訳(一部修正)ですとこういう感じ:</p> <p><a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>成熟度モデルは、組織がビジネス プロセスを評価および改善して、障害を持つ人々がアクセスできるデジタル製品を作成するためのガイドです。<a class="keyword" href="http://d.hatena.ne.jp/keyword/W3C">W3C</a><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>成熟度モデルを使用することで、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>ポリシー、プロセス、および成果を改善するための有益なガイダンス(規範的ではなく、要件を設定しないガイダンス)を組織に提供します。</p> <p>この文書は、小規模から大規模な企業や政府機関まで、あらゆる規模の組織で機能するように設計されています。さらに、これは、Web Content Accessibility Guidelines (WCAG)など、関連する技術的な<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>標準で規定されている要件から独立していることを意図しています。</p> <p>このように、WCAGとは別物の文書である、と謳っています。なお、この文書の出自ではないですが、<a href="https://www.w3.org/TR/2022/DNOTE-maturity-model-20220906/">1.3 Existing Research and Standards</a>では既存の規格として、<a href="https://www.iso.org/standard/70913.html">ISO/IEC 30071-1:2019</a>を挙げています<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup><sup>,</sup><sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>。</p> <p>ちなみに、<a href="https://www.w3.org/blog/2022/09/w3c-accessibility-maturity-model/">W3C Accessibility Maturity Model | W3C Blog</a>では、成熟度モデルが必要な理由について記述されています。</p> <p>いろいろと書かれていますが、個人的に気になったところを取り上げますと、</p> <ul> <li>Accessibility Conformance Reports / Voluntary Product Accessibility Template (ACR/VPAT)は、ある時点で凍結された製品(product)の単一バージョンのスナップショットを調べます。ACR/VPATは、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>が繰り返されるかどうかを評価しないため、製品リリースタイムラインの後半でその製品の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>について保証はありません。</li> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>成熟度<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E2%A5%C7%A5%EA%A5%F3%A5%B0">モデリング</a>は、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>適合性テストとは大きく異なります。 <ul> <li>適合性テストは、特定の時点における特定の製品の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>適合レベルに関する情報を提供します。適合性テストの結果は、製品の特定のバージョン(または製品の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8">コンポーネント</a>)の全体像を提供します。</li> <li>成熟度<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E2%A5%C7%A5%EA%A5%F3%A5%B0">モデリング</a>は、長期にわたってアクセシブルな製品を生産する組織の能力に関する情報を提供します。成熟度<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%E2%A5%C7%A5%EA%A5%F3%A5%B0">モデリング</a>評価の結果は、組織の<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>のイニシアチブの全体像―組織が<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>をうまく行っている場所と、障壁を取り除くために改善できる場所―を提供します。</li> </ul> </li> </ul> <p>成熟度モデルの着目点としては、製品(product)をアクセシブルにするだけでは十分ではなく、製品の体験全体をアクセシブルにする必要がある、というところにあります。このようにWCAGを位置付けることで、見えてくるものもあるなと感じているところです。</p> <div class="footnotes"> <hr/> <ol> <li id="fn:1"> <p>いつだったか<a href="https://twitter.com/yomochan/">@yomochan</a>が、たしか<a href="https://www.hassellinclusion.com/iso-30071-1/">Hassell Inclusionのこのページ</a>を通してISO/IEC 30071-1:2019を紹介していた気もします。<a href="#fnref:1" rev="footnote">&#8617;</a></p></li> <li id="fn:2"> <p>というかこのISO、ISO/IEC JTC 1/SC 35ということに気づきました。どうしよう(どうしよう、とは)。<a href="#fnref:2" rev="footnote">&#8617;</a></p></li> </ol> </div> momdo (メモ)障害者権利条約 1回目対日国連審査の資料まとめ hatenablog://entry/4207112889916808166 2022-09-10T13:35:17+09:00 2022-09-10T13:35:17+09:00 2022/09/09のニュース: 国連、障害児の分離教育中止要請 精神科強制入院、廃止も | 共同通信 https://nordot.app/940949528598986752 そもそもこのニュースの国連審査って何: 障害者権利条約 日本 初の国連審査 NHK解説委員室 https://www.nhk.or.jp/kaisetsu-blog/300/472465.html 障害者にかかわる条約、選択議定書、国連委員会の概略: 障害者 | 国連広報センター https://www.unic.or.jp/activities/economic_social_development/social_… <ul> <li>2022/09/09のニュース:<br /> 国連、障害児の分離教育中止要請 精神科強制入院、廃止も | <a class="keyword" href="http://d.hatena.ne.jp/keyword/%B6%A6%C6%B1%C4%CC%BF%AE">共同通信</a><br /> <a href="https://nordot.app/940949528598986752">https://nordot.app/940949528598986752</a></li> <li>そもそもこのニュースの国連審査って何:<br /> 障害者権利条約 日本 初の国連審査 <a class="keyword" href="http://d.hatena.ne.jp/keyword/NHK">NHK</a>解説委員室<br /> <a href="https://www.nhk.or.jp/kaisetsu-blog/300/472465.html">https://www.nhk.or.jp/kaisetsu-blog/300/472465.html</a></li> <li>障害者にかかわる条約、選択議定書、国連委員会の概略:<br /> 障害者 | 国連広報センター<br /> <a href="https://www.unic.or.jp/activities/economic_social_development/social_development/integration/disabled/">https://www.unic.or.jp/activities/economic_social_development/social_development/integration/disabled/</a></li> <li>条約の外務省訳、と今回の審査にあたっての第1回政府報告、国連委員会からの事前質問と政府回答:<br /> 障害者の権利に関する条約(略称:障害者権利条約)|外務省<br /> <a href="https://www.mofa.go.jp/mofaj/gaiko/jinken/index_shogaisha.html">https://www.mofa.go.jp/mofaj/gaiko/jinken/index_shogaisha.html</a></li> <li>日本障害フォーラム(JDF)によるパラレルレポート:<br /> 障害者権利条約関連資料 - 関連資料|日本障害フォーラム(JDF)<br /> <a href="https://www.normanet.ne.jp/~jdf/data.html#page_top2">https://www.normanet.ne.jp/~jdf/data.html#page_top2</a></li> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%C6%FC%CA%DB%CF%A2">日弁連</a>によるパラレルレポート:<br /> 日本弁護士連合会:障害者の権利条約 報告書審査<br /> <a href="https://www.nichibenren.or.jp/activity/international/library/human_rights/shogaisha_report.html">https://www.nichibenren.or.jp/activity/international/library/human_rights/shogaisha_report.html</a></li> <li><a class="keyword" href="http://d.hatena.ne.jp/keyword/%B6%A6%C6%B1%C4%CC%BF%AE">共同通信</a>のニュース元ネタの国連プレスリリース:<br /> UN disability rights committee publishes findings on Bangladesh, China, Indonesia, Japan, Korea, Lao, <a class="keyword" href="http://d.hatena.ne.jp/keyword/New%20Zealand">New Zealand</a>, Singapore and Ukraine | OHCHR<br /> <a href="https://www.ohchr.org/en/press-releases/2022/09/un-disability-rights-committee-publishes-findings-bangladesh-china-indonesia">https://www.ohchr.org/en/press-releases/2022/09/un-disability-rights-committee-publishes-findings-bangladesh-china-indonesia</a></li> <li>今回の国連審査に関する全部の文書:<br /> CRPD - Convention on the Rights of Persons with Disabilities 27 Session (15 Aug 2022 - 09 Sep 2022)<br /> <a href="https://tbinternet.ohchr.org/_layouts/15/treatybodyexternal/SessionDetails1.aspx?SessionID=2545&Lang=en">https://tbinternet.ohchr.org/_layouts/15/treatybodyexternal/SessionDetails1.aspx?SessionID=2545&Lang=en</a></li> <li>第1回日本政府報告への最終見解(プレスリリースの元ネタ)<br /> CRPD/C/JPN/CO/1 Concluding observations on the initial report of Japan<br /> <a href="https://tbinternet.ohchr.org/_layouts/15/treatybodyexternal/Download.aspx?symbolno=CRPD%2fC%2fJPN%2fCO%2f1&Lang=en">https://tbinternet.ohchr.org/_layouts/15/treatybodyexternal/Download.aspx?symbolno=CRPD%2fC%2fJPN%2fCO%2f1&Lang=en</a></li> </ul> <p>おまけ:とても雑な<a class="keyword" href="http://d.hatena.ne.jp/keyword/Twitter">Twitter</a>ツリーの最初のツイート(途中ツリー構築でミスってる)</p> <p><blockquote data-conversation="none" class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">これかな?<br>みてる:UN disability rights committee publishes findings on Bangladesh, China, Indonesia, Japan, Korea, Lao, <a class="keyword" href="http://d.hatena.ne.jp/keyword/New%20Zealand">New Zealand</a>, Singapore and Ukraine | OHCHR<a href="https://t.co/V4fzlQ316h">https://t.co/V4fzlQ316h</a></p>&mdash; もんど (@momdo_) <a href="https://twitter.com/momdo_/status/1568277502958903296?ref_src=twsrc%5Etfw">2022年9月9日</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> </p> momdo (メモ)JIS X 25010:2013でみる品質モデルとアクセシビリティの関係 hatenablog://entry/4207112889914912069 2022-09-04T19:19:19+09:00 2022-09-04T20:23:12+09:00 ちょっとした機会があって、JIS X 25010:2013という規格が存在することを知った。 JIS X 25010:2013の概略は、 ソフトウェアにも「JISマーク」が付く時代の到来――あなたの知らない「品質モデル」の基礎知識:変わる「ソフトウェア品質」再考(2)(1/2 ページ) - @IT 「つながる世界のソフトウェア品質ガイド」の発行 ~経営者が知っておくべきソフトウェアの品質・評価と国際規格「SQuaRE」~:IPA 独立行政法人 情報処理推進機構 あたりにだいたいのことが載っている。 その中では、SQuaRE品質モデルというものがあり、ソフトウェア・システムの製品が持つ品質(製品… <p>ちょっとした機会があって、JIS X 25010:2013という規格が存在することを知った。</p> <p>JIS X 25010:2013の概略は、</p> <ul> <li><a href="https://atmarkit.itmedia.co.jp/ait/articles/1911/13/news010.html">ソフトウェアにも「JISマーク」が付く時代の到来――あなたの知らない「品質モデル」の基礎知識:変わる「ソフトウェア品質」再考(2)(1/2 ページ) - @IT</a></li> <li><a href="https://www.ipa.go.jp/sec/reports/20150609.html">「つながる世界のソフトウェア品質ガイド」の発行 ~経営者が知っておくべきソフトウェアの品質・評価と国際規格「SQuaRE」~:IPA 独立行政法人 情報処理推進機構</a></li> </ul> <p>あたりにだいたいのことが載っている。</p> <p>その中では、SQuaRE品質モデルというものがあり、ソフトウェア・システムの製品が持つ品質(製品品質モデル)を8つの主特性に分類している。その主特性の1つに<a href="https://www.ipa.go.jp/files/000055008.pdf#page=164">使用性(Usability)</a>があり、主特性である使用性を構成する副特性として<a href="https://www.ipa.go.jp/files/000055008.pdf#page=172">アクセシビリティ(Accessibility)</a>が位置付けられている。 AccessibilityがUsabilityを構成しているような格好になっている、と捉えることができるだろう。</p> <p>…それはそれとして、<a class="keyword" href="http://d.hatena.ne.jp/keyword/%A5%A2%A5%AF%A5%BB%A5%B7%A5%D3%A5%EA%A5%C6%A5%A3">アクセシビリティ</a>の参考文献としてJIS X 8341シリーズ(ISO 9241シリーズ)と書かれるのは癪ではあり。JIS X 8143-3:2016はISO/IEC 40500:2012なんだけどなぁ…という気持ちが。</p> <p>ところで、<a href="https://speakerdeck.com/washizaki/squareguan-lian-falsebiao-zhun-hua-falsequan-ti-dong-xiang-25010-25019gai-yao-ip-shan-jun-bo">SQuaRE関連の標準化の全体動向+25010, 25019概要(込山俊博)</a>という2022年3月のスライドを見つけた。コンビーナのスライド資料なので信頼できるだろう。</p> <p>スライドによれば、国際対応規格である<a href="https://www.iso.org/standard/35733.html">ISO/IEC 25010:2011</a>は現在、改訂予定のCDが作成されている。そこでは製品品質モデルが改訂され、UsabilityがInteractive Capabilityに、AccessibilityをがUser Assistanceにそれぞれ変更されるようだ(<a href="https://speakerdeck.com/washizaki/squareguan-lian-falsebiao-zhun-hua-falsequan-ti-dong-xiang-25010-25019gai-yao-ip-shan-jun-bo?slide=19">スライド19</a>)。</p> <p>なので、将来のISO/IEC 25010、JIS X 25010はAccessibilityという言葉が出現しなくなると思われる。</p> <p>さておき、JIS X 8341シリーズが<a class="keyword" href="http://d.hatena.ne.jp/keyword/IPA">IPA</a>の資料の中でこういう形で参照されるならば、もう少しどうにかすべきだろう。</p> momdo