ウェブアクセシビリティという語が、ここ著しく普及し、制作会社の案内や、技術書も増えてきました。
高度なウェブアクセシビリティでなければならないという風潮が、社会への実装を遅らせている気もします。
このページでは、とりあえずこれくらいを満たせば、「アクセシビリティをいい加減にしてはいないよ」というような、基本にあたるところを表にしてみました。
右へならえで、高度なアクセシビリティを実装しなければならないと考えられて、実装が遅れたんでは、なんにもなりません。
この表でポイントを把握していただければ幸いです。
コード表については、サンプルhtmlファイルをダウンロード（画像とかなしのサンプルzip圧縮ファイル）し、自由に使ってください
（各ブロックをコピーし、ご自身のレイアウトの区切り内に貼り付け流し込みでも使えます）。
| htmlコードの役割 | 補足説明 | コード |
|---|---|---|
| 文書タイプ宣言 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> | |
| htmlの開始と言語分岐 | <html lang="ja"> | |
| ヘッド部開始 | <head> | |
| 文字コード指定 | 使用コード Shift_JIS の場合 |
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> |
| タイトル | <title>アクセシビリティコード説明</title> | |
| ヘッド部おわり | </head> | |
| ページ開始 | <body> | |
| 構造ブロック開始 | <div> | |
| スキップナビゲーション | honbun へ移動する場合 |
<a href="#honbun">本分へのジャンプ</a> |
| 改行 | <br> | |
| 画像だけ挿入１ | ようこそ と読み上げる場合 |
<img src="image-folder/title.gif" alt="ようこそ"> |
| 画像だけ挿入２ | 太い枠線をつけます | <img src="image-folder/sky.gif" alt="青空の画像" border="4"> ( 0だと枠線無し) |
| 構造ブロックおわり | </div> | |
| 構造ブロック開始 | <div> | |
| スキップナビゲーションの 移動先 |
honbun というアンカー ページ内移動先 |
<a name="honbun" id="honbun">本文</a> |
| 見出し１ | 主になる見出し | <h1>大見出し</h1> |
| 見出し２ | 副題になる見出し | <h2>中見出し</h2> |
| 本文のブロック | <p>ここは本文です<br>改行次の本文です</p> | |
| 構造ブロックおわり | </div> | |
| 構造ブロック開始 | <div> | |
| リンク１ | 本文と区別しやすいよう [ で、囲んでいます。 push1.gif画像にindex1.htm １ページへのリンクがあります |
[ <a href="index1.htm"><img src="image-folder/push1.gif" alt="1ページへ"></a> |
| リンク２ | 前のリンクとの区切りの スペース | スペース があり、 push.gif画像にindex.htm トップへのリンクがあります。 （区切りはわかる様に任意） |
| <a href="index.htm"><img src="image-folder/push.gif" alt="トップへ"></a> ] |
| 構造ブロックおわり | </div> | |
| ページおわり | </body> | |
| htmlのおわり | </html> |