京都府ウェブアクセシビリティガイドライン
令和 4 年 7 月 1 日策定

１ 目的
このガイドラインは、経済産業大臣が制定する「高齢者・障害者等配慮指針(以下「JIS規格」という。)」の主旨を踏まえ、ホームページを通じて提供される情報に対して利用者や利用環境の違いによって生じる制約を極力排除し、もってウェブコンテンツのアクセシビリティを確保・向上させることを目的とする。

ウェブのアクセシビリティとはアクセシビリティとは「近づきやすさ」といった意味があり、ウェブにおけるアクセシビリティとは、様々な利用者（障害者や高齢者）や異なる利用環境（ＯＳやブラウザ）に拘わらず、そのウェブサイトから情報が得られる（＝「使える」）ことを意味する。
また、このガイドラインでは、画面からの内容把握のしやすさや操作性のよさ等、ウェブの「使いやすさ（ユーザビリティ）」への配慮についても、その目的や内容は「使えること（アクセシビリティ）」と共通する部分が多いため、特に両者を区別せずに「アクセシビリティガイドライン」として規定を行っている。

２ ガイドラインの適用対象(1)対象となるウェブサイト
京都府ホームページ(以下「府ＨＰ」という。)(2)対象となる時期
府ＨＰ上のコンテンツの新規作成、更新時
ただし、上記に該当しない時期でも、コンテンツの作成者は当ガイドラインに適合しない事項を認めた場合、適宜その不適合箇所を是正していくことが望ましい。

(3)対象となる作成者
府ＨＰ上に掲載するコンテンツを作成する者
なお、「コンテンツを作成する者(以下『作成者』という)」とは、府職員に限らず、府から作成を受注した業者も含め、府ＨＰ上のコンテンツ作成に関わる全ての者をいう。

３ 情報発信について
作成者は府ＨＰから情報発信を行う場合、当ガイドラインに充分配慮したデータを作成の上、「インターネットによる情報発信運用要領」(平成16年５月１日施行)の規定により情報発信を行わなければならない。
また、当ガイドラインに規定がない事項については、JIS規格「情報通信における機器・ソフトウェア及びサービス－ 第３部:ウェブコンテンツJIS X 8341-3 」(以下「WebJIS」という。)等の規定を参照し、アクセシビリティの確保に努めなければならない。

４ ＨＰデータの作成方法について(1)担当職員が作成する場合ＨＰ作成ソフトの使用など、効率的にデータを作成できる手法を採用し、担当者変更によりデータ管理が困難になるような不具合を生じないよう注意すること。
留意事項① Microsoft word及びPowerPointを使用（HTML方式の保存）したＨＰデータ作成は行わないこと。
（参考）上記作成方法を用いた場合、下記のような問題点が生じる。
・ 利用者の使用するブラウザによっては表示が異なってしまう場合がある。
・ 画面表示が崩れた結果、リンクボタンが押せないといった不具合が生じる。
・ 視覚障害者が使用する音声化ソフトで正確に読み上げができない。
・ 文書構造が複雑になるため、後々のデータ管理が煩雑になる恐れがある。

(2) 業者委託の場合
・ 業者発注までに、仕様実現のために特殊な機能を使用するかどうかを確認するとともに、その仕様について、必ず広報課あてに事前協議を行うこと。
・ 委託業務の校正作業と並行して、広報課による確認を受けること。

５ データ作成上の技術的な注意事項
府ＨＰから情報を発信しようとする作成者は、ウェブが全ての人にとって重要な情報源として利用されていること充分認識し、４により作成されたデータが以下の事項に適合するよう努めなければならない。

5.1 適切なファイル名、ディレクトリ名の命名(a) ファイル名やディレクトリ名は英半角小文字と半角数字のみを使用すること。
<問題点>
ファイル名を全角や平仮名等で指定すると、ファイルが転送できない、ウェブ上で正しいページ表示ができない、ファイルの削除ができなくなる、といった不具合が生じることがある。（半角英字についてもデータ管理上、小文字に統一しておいた方がよい。）(b) ファイル名やディレクトリ名はできるだけ短くすること。
<問題点>
長いファイル名を設定するとＵＲＬが長くなり、利用者にとって扱いにくい上、入力ミスを招くことがある。
<参考>
ただ短いだけではなく、その内容を表すようなファイル名等を付けることが望ましい。

5.2 適切なページタイトルの設定
・各ページにはそのページの内容を表す「固有の」ページタイトルを付けること。
<問題点>
・ 視覚障害者の中には、音声化ソフトを利用して画面を「読み上げる」ことで情報を得ている。音声化ソフトはページタイトルを最初に読み上げるため、適切なタイトルが付けられていない場合、そのページに目的の情報があるかどうか判断できない場合がある。
・ 「お気に入り」や「閲覧ページの履歴」にはページタイトルが記録されるため、適切なタイトル設定がされていないと、利用者が後から情報を検索する時に欲する情報が何処にあったのか特定できない場合がある。
<実装例><title>△△</title>…△△の中に適切なタイトルをつける○ <title>きょうと府民だより</title>… 大まかな内容が把握できる。
× <title>ページ１</title>… そのページの内容が推測できない。

また、同じページタイトルが続くと、必要とする情報の所在がわからなくなるため、「固有」のページタイトルをつける必要がある。
（良い例）

（悪い例）

<title>きょうと府民だより１月号</title><title>府民だより</title>：：<title>きょうと府民だより○月号</title><title>府民だより</title>

5.3 論理構造にしたがった記述(a) 強調したい部分は太字(b)タグや斜体(i)タグではなく、強調(em)や(strong) タグを使用すること。
(b) 見出しを表す場合はフォントのサイズではなく、見出し(h)タグを使用すること。
<問題点>
音声化ソフトの読み上げは論理構造の情報をベースにしているため、「見た目」は同じでも適切な要素で記述していない場合は作成者の意図が充分に伝わらない場合がある。
<参考>
音声化ソフトには、声の抑揚等で強調箇所や見出し箇所を区別して読み上げる設定がある。

5.4 適切なファイルの提供（ファイルサイズ・ＰＤＦファイル）(a) 写真や絵を多用した「重たい」データの作成は避けること。
(b) 大きなファイルを使用する場合は、テキストや小さいサイズの画像（サムネイル）からリンクを貼って対応すること。
(c) サムネイル設定や各種ファイル（ＰＤＦ等）のダウンロードを提供する場合は、ファイル形式、データ量及びプラグインの方法などについて明記すること。
<問題点>
ファイルサイズが大きいページは、利用環境によってはダウンロードに時間がかかり、情報へのアクセスに支障をきたす場合がある。
<参考>
サイズが大きいデータには、ファイル形式やファイルサイズ等、利用者がそのファイルを開くか否かを判断できる情報を提供する必要がある。
(d) ＰＤＦファイルにはテキストによる同等の情報提供を行うことが望ましい。
<問題点>
ＰＤＦファイルには音声化ソフトが充分に対応していないため、視覚障害者が情報を得られない場合がある。

5.5 リンクや画像表示の設定
・リンク等の指定は「絶対パス（リンク先としてＵＲＬを直接指定する）」ではなく「相対パス(現在のページとリンク先の位置関係)」を使用して行うこと。
<問題点>
絶対パスでリンク指定をした場合、リンク先のファイル名変更等によって、リンク切れを引き起こし、利用者が必要とする情報が得られないことがある。
<実装例>○ <a href="../koho">府民だより</a>…府民だより(リンク元)の１階層上の広報ファイル(リンク先)を指定する。
× <a href="http://www.pref.kyoto.jp/koho/>…データ作成時にリンク切れのチェックが出来ない、リンク先のＵＲＬの変更や移動に伴いデータを修正しなくてはならない。

5.6 問い合わせ先の明記
・各ページには担当課・連絡先を明記する。連絡方法はメールだけではなく、電話番号やＦＡＸ番号を明記する。
<問題点>
・ 利用者がページに掲載されている情報に対して問い合わせを行いたいときに、そのページの管理をどの部局が行っているかわからない。
・ 利用者の問い合わせ方法をメールに限定してしまうと、キーボード入力が困難な人（高齢者や肢体障害者）が充分な情報を得る妨げとなる恐れがある。

5.7 画像等に対する情報提供(a) 画像には、その説明を alt 属性（代替テキスト）として付与するか、画像の近くにテキストで説明を表示すること。
(b) 画像に伝えたい情報がない場合でも、空の alt 属性を必ず付与すること。
<問題点>
・ 特に全盲の視覚障害者にとって、代替テキストやテキストによる補足説明がない画像からは全く情報を得ることができない。
・ 利用者の中には、テキストブラウザやブラウザの画面表示機能をＯＦＦにして使用している場合があり、情報が画像のみによって提供されている場合、情報を得ることができない恐れがある。
<実装例>
・ <img src="ファイル名" alt="画像に関する情報">→ 画像に関する簡潔な説明を代替テキストとして付与すること。
例えば、<img alt="写真１">とすると、「写真１」と読み上げられるため、画像についての情報が利用者に伝わらない。
・ 画像に対する長めの解説が必要な場合は、テキストによる情報提供を行う。
・ 特に伝えるべき情報のない画像には、<alt="">として、あえて画像に情報を付与していないことがわかるようにすること。
→✉メール … この「✉」の画像に"メール"というalt属性を付与した場合、"メールメール"と同じ情報を２度読み上げてしまう。
＊ 伝えるべき情報の有無を問わず、画像に対しては必ずalt属性を付与すること。
(c) リンクを貼る画像（アイコン）にはリンク先の大まかな内容が予測できる alt 属性を付与すること(d) リンクを貼る文字についても、リンク先の内容がわかるような表現にすること。
<問題点>
・ アイコンに alt 属性が付与されていないと、音声化ソフトはリンク先のＵＲＬを読みあげるため、そこにどのような情報があるのかわからない。
・ 視覚障害者等の中には、Tab キーによりページ内のリンクのみを辿って情報を検索する場合があるため、リンクを貼った文字自体に情報がない場合、ジャンプした先にどのような情報があるのかわからない。
<実装例>○ <a href="URL 等">△△△の解説へ</a> … リンク先の概要が把握できる。
× <a href="URL等">ここをクリック</a> … リンク先の内容がわからない。

5.8 文字表記に関する配慮(a) ウェブ上の文章は、できるだけわかりやすい表現を心がけ、場合によっては解説や注釈をつけるといった配慮を行うこと。
<問題点>
外来語や省略語、専門用語を多用すると、利用者（特に子供、高齢者など）がその内容を理解できない場合がある。
(b) 文字サイズはやむを得ない場合を除き、フォントサイズ（絶対値）ではなく、相対値で指定すること。
<問題点>
ページ内のフォントサイズを固定すると、ブラウザの機能を使用した文字サイズの変更ができなくなるため、高齢者や弱視の方にとって読みづらい場合がある。
<実装例>○ <font size="-1"> … ブラウザの機能によりサイズ変更可（±3まで対応）
× <font size="10pt"> … 利用者によるサイズ変更ができない。
＊ 見出しとなる部分にはフォントサイズではなく、<h>タグ（h1からh6まで）による論理づけを行うこと。（ガイドライン5.3(b)参照）(c) 見栄えを整えるために、単語の間にスペースを入れたり、省略語を使用しないこと。
<問題点>
・ 行幅を整えるために文字間にスペースを入れたり、単語を省略した場合、音声化ソフトで正確に読み上げられない場合がある。
<実装例>○ 「募集期間」「未定」… 「ぼしゅうきかん」「みてい」と読み上げ
× 「募集期間」「未定」… 「ぼつどいきあいだ」「ひつじさだめ」と読み上げ○ 火曜日（金曜） … 「かようび」「きんよう」と読み上げ
× （火）（金） … 「ひ」「かね」と読み上げ(d) 半角カタカナや特殊記号等の機種依存文字や外字は使用しないこと。
<問題点>
半角カタカナや特殊記号等の機種依存文字や外字は利用環境によって文字化けを引き起こし、正確な情報が伝わらないことがある。
<参考>
機種依存文字… 特定の機種や環境（ＯＳ）でのみ表示されるため、データ作成にあたっては使用すべきではない文字（例） ①②③／℡ FAX／㈱㈲／㍉㌔／㎡ ㏄／ⅠⅡⅢ／ など

5.9 色による情報伝達(a) 色による情報提供を行う場合は、テキストによる情報を併記すること。
<問題点>
色のみで情報が提供されている場合、音声から情報を得ている視覚障害者は、情報を得ることができない。
(b) 文字色と背景色には十分なコントラストをとる。背景に画像を使用する場合には文字の周辺を単色にするなど、必要な対策を講じること。
(c) 文字色と背景色に充分なコントラストを取るためには、やむを得ない事情がある場合を除き、背景には写真や画像を設定しないことが望ましい。
<問題点>
・ ウェブ画面の色使いによっては、色覚障害者は色の判別ができずに正しい情報を得られない場合がある。
・ 文字色と背景色に十分なコントラストが確保されていない場合、視覚や色覚の障害の有無に関わらず、見づらいページとなっていることが多い。

5.10 操作・入力に関する留意事項(a) ページ間及びページ内の移動がスムーズできるよう、適切なリンクを設定すること。
<問題点>・ 縦にスクロールするページで、ページトップに各項目へのナビゲーションをつけていなかったり、ページ末尾に「ページトップへ戻る」といったリンクがない場合、ページ内の効率的な移動の妨げになる。
・ 「メニューページに戻る」といったリンクがない場合、リンク先からリンク元のページに戻れない場合があるため、ページ間の移動に支障をきたすことがある。
<参考>
リンクを貼る文言や位置をできるだけ統一するなど、利用者の立場に立った適切なリンク設定を行うこと。
(b) ウェブ画面上の操作はタブキー、エンターキー、矢印キーを使って操作ができるようにし、マウスの使用を前提としないこと。
<問題点>
視覚や肢体に障害がある方は、マウスの操作が困難な場合があり、結果としてそのページから情報を得られない恐れがある。
(c) フォームの提供にあたっては、入力内容を明確にし、利用者が操作しやすいように配慮すること。
<問題点>
フォーム入力を行う際に複数の入力パターンが考えられたり、何を入力したらよいか不明確な場合、利用者に余計な負担を強いる恐れがある。
<実装例>
・ 利用者に対してボックス内への入力方法（例：ひらがな、カタカナの別など）を明示したり、記入例を掲載することで、確実に入力ができるようにする。

なお、入力方法は「フリガナ」といった視覚に頼った情報提供ではなく、視覚障害者等の利用を想定し、「フリガナ（カタカナ）」といった配慮を行うこと。
・ 操作性向上のために、ボックス内にチェックを入れる場合は、LABEL属性を付与し、項目をクリックすればチェックが入るように関連づける。
<label>属性を付けることで、テキストの「参加する」をクリックしてもチェックを入れることが出来る。
<label>属性がない場合、チェックを入れるためには小さなボックス内をクリックしなければならない。
<参考>
フォームへの入力作業が困難な人のために、メールによる受付といった代替手段を提供しておくことが望ましい。

5.11 動的なコンテンツ(a) 行政による情報発信は利用者に内容が伝わることを最優先として考え、見栄えをよくすることを目的とした動的なオブジェクトの使用は控えること。
(b) やむを得ない事情により使用する場合は、変化の速度設定に充分留意すること。
<問題点>
・ 高齢者や障害のある人の中には、変化や移動を伴う画像やテキストを正しく認識できない場合がある。
・ 音声化ソフトの読み上げが終了する前に画面が切り替わってしまい、全ての情報を得ることができない場合がある。
・ 早い周期の画面点滅は、光感受性発作（光源性てんかん）を誘発する恐れがある。

5.12 読み上げに配慮した画面レイアウト・フレームによる画面分割は行わないこと。
<問題点>
・ 視覚障害者やロボット検索エンジンを使用してページを閲覧している利用者のページ間の移動を妨げる恐れがある。
・ 音声化ソフトを使用している場合、画面全体の構成の把握が難しく、必要な情報を得るまでに多大な労力を要する恐れがある。
・ サイズが大きくなるため、表示に時間がかかったり、ブラウザによっては正常に機能しない場合がある。

5.13 音による情報提供
・音声のみによる情報提供は避け、テキスト情報と併用して提供すること。
<問題点>
・ 音声による情報が自動再生されている場合、聴覚に障害のある方や音声を消してページを閲覧している利用者には、情報提供がされていること自体が認識できない。
・ 警告や合図等が音のみで利用者に知らされている場合も、その情報が伝わらない恐れがある。

5.14 動画コンテンツによる情報提供(a) 動画コンテンツのみによる情報提供は行わないこと(b) 動画コンテンツを提供する場合は、動画コンテンツと同等の内容をテキストで併記する、もしくはテキスト主体の別ページを作成しそのページへのリンクを併記すること(c) 動画コンテンツには可能なかぎり字幕をつけること。なお、情報取得のために映像を把握する必要がある場合は、音声ガイドを付けること<問題点>
・ 動画コンテンツは豊富な情報を発信することのできるものであるが、聴覚や視覚に障害のある方は音声部分や映像部分から情報を取得できない可能性がある。

６ チェックシート
作成者は、データが「５ 技術的な注意事項」に適合しているかを別添チェックシートにより確認し、当該チェックシートをデータと併せて広報課あて提出すること。

７ その他
ガイドラインに規定されていない事項でも、ブラウザソフト固有の機能、プラグインソフ
ト、Javascript、スタイルシート等を使用するページについては、利用者側の環境によって、ページを完全な形で閲覧できない可能性があるため、その必要性を十分検討し、適切な対策を講じること。