2020年3月31日改訂
公益財団法人 横浜市スポーツ協会

背景と目的

「ウェブアクセシビリティ」とは「高齢者や障がい者等心身の機能に制約のある人を含め、ウェブサイトで提供されている情報が誰に対してもきちんと伝わり、提供されている機能やサービスを誰もが容易に利用できること」を意味します。

　ウェブサイトの作成については、さまざまな方が利用できるようにアクセシビリティに配慮した日本工業規格（JIS規格）、「JIS X 8341-3」が定められており、2016年にはWorld Wide Web Consortium（W3C）が定めた規格（ウェブコンテンツ・アクセシビリティ・ガイドライン（WCAG）2.0）がISO/IECの国際規格になったことを受けて、その一致規格となるように改正され「JIS X 8341-3:2016『高齢者・障害者等配慮設計指針－情報通信における機器、ソフトウェア及びサービス－ 第3部:ウェブコンテンツ』」（以下、JIS X 8341-3:2016）となりました。
　この規格に準じて、総務省において「みんなの公共サイト運用ガイドライン」が定められ、さまざまな方が利用する公共機関のウェブサイトについては、JIS規格に基づいたサイト作成が求められています。

　本ガイドラインでは、改正前に引き続き、すべての利用者に対して便利で役立つ市政情報を提供していくため、利用者がその内容を理解し、的確に操作できるよう配慮したページを作成することを目的とするとともに、JIS X 8341-3:2016等関連する規格等の内容を考慮して、市が管理運営するウェブコンテンツにおいて配慮すべき基準を定めております。
　なお、過去に作成したページの中に、本ガイドラインに対応していない部分もありますので、順次更新していくように努めてまいります。

配慮項目

●コンテンツ全体について

• JISに基づいた記述を行う。
• 見出し、段落、リスト等で文書の構造を規定する。
• 単一の入力装置に依存することなく、キーボードのみで操作できるようにする。

●コンテンツ内の案内（ナビゲーション）への配慮

• コンテンツやメニューの位置、表示形式等に統一性を持たせる。
• サイトのどこに位置しているか把握できる情報（パンくずリスト、案内メニュー等）を提供する。
• サイトの全体的な構成に関する情報(サイトマップや目次等)を提供する。
• いずれのページからもトップページへ戻ることができるようにリンクを設定する。
• 下階層にページがある場合、下階層ページにジャンプするメニューを表示する。
• ブロックスキップの仕組みを取り入れる。

●表現への配慮

• 情報は、色だけでなく文字等でも分かるようにする。
• 情報は、形や大きさ、方向や音だけではなく文字等でもわかるようにする。
• 点滅したり、変化・移動したりする文字や画像は原則として使用しない。やむを得ず使用する場合は、個数や大きさ、点滅・変化・移動の時間を最小限度に留めたうえ、以下のような配慮をすること。
• 利用者がそれらを一時停止、停止または非表示にすることができること。またはそれらの動きが自動的に停止する仕組みがあること。
• 激しく点滅したり急激に色が変化するものは利用者の健康を害する恐れがあるので、閃光は1秒間に2回以下とし、同じ系統の色調を用いること。
• 横スクロールが必要ないよう、表や画像の大きさについて留意する。

●ページへの配慮

• 各ページへのタイトルは簡潔な表現とし、そのページの内容を的確に把握できるタイトルを設定する。また、複数のページに同じタイトルは設定しない。
• フレームの使用を禁止する。
• 文字拡大によってレイアウトが崩れないようにする。
• 各ページのサイズをなるべく小さくし、低速回線でも早く表示できるようにする。
• 自動的にページを更新したり、別のページに移動しない。
• BGM（バックグラウンドミュージック）は使用しない。
• ページに「問い合わせ先」を表示する。

●文字・文書への配慮

• 専門用語や略語、俗語等の使用はできる限り避け、誰にでも内容が理解できるようにする。
• 特定の機種や環境でないと文字が正しく表示されない「機種依存文字」や「半角カタカナ」を使用しない。
• ロゴや書体のサンプル等を除き、文字は画像化せず、テキストで提供するように努める。
• 文字サイズの絶対値(ピクセル,ポイント等)は指定せず、ブラウザ(閲覧ソフト)による文字サイズの変更に対応できるようにする。
• 数値を表す数字は半角で入力する。
• レイアウト目的で文字列内にスペースを挿入したり、文の途中で改行しない。
• 背景色と文字色のコントラスト（明暗や色彩の対比）に留意する。
• 読みの難しい用語には、フリガナやルビを付ける。
• WordやExcel等のアプリケーションからデータをページに貼り付ける場合は、余分なタグを取り除く。
• 各コンテンツに、内容を適切に表した見出しを付ける。
• 見出しを表現するのに、文字サイズの指定や装飾等は使用しない。

●入力フォームやプルダウンメニューへの配慮

• ラベルは分かりやすい位置に配置し、フォームに明確に関連付ける。
• フォーム機能を使用している場合、フォームへの入力、内容の確認、送信といった一連の操作方法が分かりやすく表現されるようにする。
• プルダウンメニューはマウスだけではなくキーボードで操作できること。
• 誤った操作をした場合、エラーを特定し、修正方法を示す。

●ハイパーリンクへの配慮

• リンク元の文字列や画像が、リンク先の内容がわかるように表現し、容易に操作できる文字数、大きさにする。
• アイコン等でリンクが明示されている場合を除き、リンク元の文字列に下線を表示する。
• ファイルダウンロード用のリンクに、ファイルサイズやファイル形式を明記する。
• 隣接する複数のリンクがある場合、リンクの前後で改行をし、区切りを明確にする。
• 原則、リンク先を新しいウィンドウで開かないようにする。避けられない場合は、説明を付記する。
• リンク切れがないようにする。

●画像への配慮

• 表現内容や大きさが適切な画像を設定する。
• 画像には必ず代替テキスト情報を設定し、画像の情報が適切に伝わるようにする。
• リンクを設定している画像には、リンク先がわかる代替テキスト情報を設定する。
• 複雑な情報を示した画像には、内容を説明するテキストを近くに配置する。
• 画像内の文字は読みやすくする。
• イメージマップを使用する場合、各領域に代替テキスト情報を設定するとともに、画像の近くにテキスト情報を表示し、リンク先ページへの情報を提供する。

●表への配慮

• 表の内容を、音声読み上げ順（左から右、上から下）に留意する。
• 適切な表題を設定する。
• 適切な見出しを設定する。
• レイアウト目的のために、テーブルを原則使用しない。
• セルの結合は必要最低限にする。
• セルを空白にしたり、同じ値を「〃」で示したりしない。

●音声・動画への配慮

• 音声ファイルや動画ファイル、Flash（アニメーション）等を含むコンテンツの掲載は原則として禁止とする。
• やむを得ず掲載する場合は、以下のような配慮をすること。
• 音声情報にはテキストで、動画情報には音声及びテキストで、同等の情報が伝わるようにする。
• 音声情報にはキャプションを用意する。
• ページを開いたときは停止状態とし、ユーザーが再生するかどうか選択できるようにする。
• 利用方法を明示し、利用者が音量、再生、停止を制御できるようにする。
• プラグイン(追加機能)の使用は原則として利用しない。やむを得ず使用する場合はプラグインのダウンロード方法や使い方等を明示する。

●添付ファイル（PDF、Excel、Word等）への配慮

• なるべく容量の小さい添付ファイルを提供するように心がける。
• ファイルサイズとファイル形式を明記する。
• 原則、外部サイトにあるファイルや画像を表示しない。他のサイトからファイルや画像を転載が必要な場合、著作権に留意し、権利や利用規約を確認した上で利用する。
• 添付ファイルを閲覧するためのソフトウェアのダウンロードページのリンクを同一ページ内に掲載する。
• PDFファイル等で情報を提供する場合は、同じ内容のHTMLページを用意したり、HTMLページに概要情報を掲載する等の対応に努める。

●セキュリティについて

• システムの脆弱性に注意し、修正プログラム等で解消に努める。
• 個人情報等の保護に配慮する。

3. 例外事項

以下については対象範囲外とします。

• ●外国語に翻訳されたページ
  自動翻訳されたページのウェブアクセシビリティ対応は困難なため、対象範囲に含めません。
• ●外部サービスから提供されるコンテンツ
  Facebook、twitterのSNSボタンやgoogleマップを含む外部サービスから提供されるコンテンツ。但しGoogleマップで提供される地図情報については可能な限りテキストでの代替情報を提供するようにします。
• ●PDFファイル
  可能な限り達成基準に配慮して作成しますが、現状ではすべてのPDFファイルへのウェブアクセシビリティの対応は、情報量および技術的な観点から困難なため、対象範囲に含めません。
• ●動画を掲載するページ
  動画ファイルについては、可能な限りテキストでの代替情報を提供しますが、現状ではすべての動画ファイルへのウェブアクセシビリティ対応は困難なため、当該ページは対象範囲に含めません。