アクセシビリティ方針
Shopippi が制作する Shopify テーマ Kyoto（バージョン 1.0.0）のアクセシビリティ方針です。
目標
Kyoto は Web Content Accessibility Guidelines（WCAG）2.2 のレベル AA を満たすことを目標に設計・制作しています。テーマに起因するアクセシビリティの問題は不具合として扱い、ほかの不具合と同じく無償で修正します。
ただし、テーマはストアを構成する要素のひとつにすぎません。ストア全体が利用しやすいかどうかは、掲載する画像・文章・動画、選んだ色、使っているアプリ、Shopify のチェックアウトにも左右されます。この方針が対象にするのは、テーマのコードと初期設定です。
Kyoto に組み込んでいる機能
以下の機能は、リリースのたびに確認しています。守られていない箇所を見つけた場合は不具合として修正します。
- キーボード：メニュー、ドロワー、ポップアップ、ギャラリー、カルーセル、絞り込み、フォームはすべてキーボードだけで操作できます。フォーカスの位置は枠線で表示します。枠線の太さと要素からの間隔は テーマ設定 > アクセシビリティとその他 で大きくできます。
- ダイアログ：カートドロワー、メニュー、クイックバイ、ポップアップは、開いている間フォーカスを内側に保ち、Esc キーで閉じます。閉じるとフォーカスは開いたときのボタンに戻ります。
- スクリーンリーダー：ページの各領域にランドマークを付け、本文へ移動するリンクを置いています。入力欄とアイコンだけのボタンにはラベルがあり、カートの内容が変わると読み上げで知らせます。
- 色：配色はカラーパレットから作られ、文字と背景のコントラストを保ちます。パレットの色を変えると、Kyoto が読みやすい方の文字色を選び、補助的な文字の色も調整します。情報を色だけで伝えることはありません。たとえばセール中の商品は、赤い価格に加えてバッジと通常価格でも示します。
- 動き：お客様の端末の「視差効果を減らす」設定に従います。フッターに、動きを止めるボタンを置くこともできます。動き続ける要素には一時停止の操作があります（動き）。
- 拡大表示：スマホでのピンチによる拡大を妨げません。狭い画面ではレイアウトが 1 列に切り替わります。
- タッチ操作：スマホのボタンとリンクは、指で押しやすい大きさにしています。
- 画像：画像には Shopify で入力した代替テキストを使います。装飾目的の画像はスクリーンリーダーに読み上げさせません。
- JavaScript が動かない環境：スクリプトが読み込めなくても、商品の閲覧とカートへの追加ができます。
ストア側でお願いしたいこと
- 商品写真とセクションの画像すべてに代替テキストを入力してください（Shopify 管理画面で画像を選び、代替テキストを追加 を選択）。
- 本文のリンクの下線 は いつも のままにしてください。
- 色を変えた場合は、コントラストを確認してください。画像の上に文字を重ねる箇所も対象です（背景を暗くする強さ で画像を暗くできます）。
- 動画には字幕を付けるか、動画セクションの 文字起こし を設定してください。
- 重要な情報を画像の中の文字だけで伝えないでください。
- キーボードだけでストアを操作してみてください。Tab キーでホーム、商品ページ、カートを順にたどると、問題に気づきやすくなります。
既知の制限
現在のバージョンで判明しているアクセシビリティの問題は、修正されるまで更新の履歴に掲載します。他社製のアプリと Shopify のチェックアウトはテーマの外にあるため、この方針の対象外です。
ご意見・ご報告
Kyoto で使いにくい箇所を見つけたら、お問い合わせフォームで種類に アクセシビリティの問題 を選んでお知らせください。ページの URL、行おうとしていた操作、お使いのブラウザと支援技術を書いていただけると助かります。日本語でのお問い合わせには日本時間で 1 営業日以内、英語でのお問い合わせには2 営業日以内に返信します。
この方針は、バージョン 1.0.0 の時点で見直しました。