横浜市社会福祉協議会ウェブサイト作成ガイドライン

本ガイドラインは、横浜市社会福祉協議会ウェブサイト（https://www.yokohamashakyo.jp/）を対象とします。
提供する情報やサービスを高齢者や障害者を含めた誰もが支障なく利用できるよう、ウェブアクセシビリティに十分配慮したウェブサイトを作成・運用する上でここに記された内容を遵守しながらホームページ（ウェブコンテンツ）の制作を行います。

非テキスト（画像・音声・動画・PDF等）の取扱い

画像には代替テキスト（alt属性）を入力します。また、単に付けるだけではなく、それを音声で読み上げたとき内容がきちんと理解できるように分かりやすい言葉で記述します。
音声や映像などマルチメディア情報の場合は、その内容を表現する文字情報もあわせて提供するようにします。
PDF、ワード、エクセルなど特定のアプリケーションだけに依存したファイル形式を用いるときは、何のファイルである旨とファイルサイズを明記するようにします。

見出しには見出し要素を用いる

見出しは、見出し要素（見出し1、見出し2、見出し3、見出し4、見出し5、見出し6）を用いて表現し、見出しだけで内容が理解できるようにページを作成します。

• 見出しを拾い読みするだけで、ページ全体の内容を把握しやすくなります。
• 一度に画面全体をとらえることが難しいロービジョン（弱視者）にとっても内容を捉えやすくなります。
• 見出しが正しく記されていることによって、見出しレベルなど文書の構造に応じた音声読み上げが行われたり、要素ごとに表示を変えやすくなるため快適な閲覧につながります。

箇条書きにはリスト要素を用いる

箇条書きを表現するリスト要素には、番号ありリスト要素と番号なしリスト要素があります。箇条書きが正しく記されていることによって、箇条書きの種類や項目数など文書の構造に応じた音声読み上げが行われたり、要素ごとに表示を変えやすくなったりするため快適な閲覧につながります。

前景色と背景色のコントラスト比は、4.5：1以上

高齢者や障害者を含めた誰もが必要な情報にアクセスできるよう基準が設けられています。十分なコントラストを確保します。

リンクはリンク先の内容を予測できる意味のある文字列にする

リンクテキストだけでリンク先が予測できるよう、リンク先のページタイトルや見出し等の文字列をリンクテキストとし、長すぎる場合には要約を記載します。
音声ブラウザなどには、リンクテキストだけを抽出して読み上げる機能があり、その機能を用いた際に「こちら」「詳細」などの曖昧なリンクはリンク先の区別がつきません。「こちら」「詳細」などのテキストを用いる場合には、前後の文脈からリンク先の内容が予測できるよう配慮します。
外部ホームページ（www.yokohamashakyo.jp以外のドメイン）へのリンクは、利用者がリンクを選択する前に、外部ホームページへ移動することを予測できるように「ホームページ名」「団体名」「外部サイト」などを記載します。
尚、リンクは同一のウィンドウ内で遷移するように設定します。新しいウィンドウを開かせることはしません。

単語の途中にスペースや改行を挿入しない

音声ブラウザなどで読み上げると文字が離れていたり改行されていると、一つの単語や文節と認識されず一文字ずつ読み上げられ意味が通じなくなる為、文書の体裁を整えるために単語内や文章の途中にスペースや強制改行をしません。
また、検索エンジンや翻訳サービスなどにおいても、単語の途中にスペースや改行があることで、コンテンツが正しく解釈されない要因となってしまうため注意が必要になります。