HTML(XHTML)とアクセシビリティのカスタムチャンス for livedoor Blog

... あなたはカスタムチャンス!に来ましたね

正しいHTMLとWebアクセシビリティ

こんにちは。カスタムチャンスのコーラ父(livedoor ID:cola_papa)と申します。このブログは livedoor Blog(ライブドア ブログ)を対象にした「正しいHTMLとWebアクセシビリティの向上」に関する簡単な覚書です。(見直しが必要な記事もあります。ご容赦下さい。)

  1. 概要
  2. 正しいHTMLのための覚書
  3. Webアクセシビリティ向上のための覚書
  4. カスタマイズ関連の記事
  5. 精選リンク集

XHTML 1.0仕様に準拠する為の記述が多く含まれていますが、ライブドアブログのリニューアル後はHTML 4.01仕様に準拠する方がよさそうです。XHTML 1.0とHTML 4.01は記述の仕方に若干の違いはあるものの「文法遵守と論理マークアップ」という方向に変更はありません。(2005年6月22日)


Table of Contents

1. 概要

  1. カスタムチャンスについて
  2. カスタムチャンスで取組むカスタマイズ
  3. 簡単な予備知識と用語の説明

2. 正しいHTMLのための覚書

  1. XHTML 1.0(strict)仕様に準拠する
  2. BODY要素の内容(1) - 階層化:DIV要素と見出し要素
    1. はじめに
    2. DIV要素によるグループ化論理的な階層化 / トップページ / 個別記事
    3. 見出し要素による階層区分適切な使用 / トップページなど / 個別記事 / 見出し要素とSEO
  3. BODY要素の内容(2) - A要素:終点アンカーの修正
    1. 開始タグと終了タグの間は空でいいのか?
    2. name属性からid属性へ
    3. 修正例
    4. 終点アンカーまとめ
  4. BODY要素の内容(3) - 投稿記事における論理的マークアップ
    1. 論理的マークアップのススメ
    2. 投稿記事で使用する要素
    3. 非推奨の要素
    4. 新しい投稿フォームを使わない方法
  5. BODY要素の内容(4) - 其の他の細かな修正
  6. HEAD要素の内容とHTML要素
  7. 文書型宣言とブラウザの表示モード
    1. 文書型宣言とXML宣言
    2. ブラウザの表示モード(DOCTYPEスイッチ)
    3. 文書型宣言まとめ

3. Webアクセシビリティ向上のための覚書

  1. Webアクセシビリティとガイドライン
    1. Webアクセシビリティとは
    2. 何ができるか...
    3. ガイドラインの概要
    4. より具体的なガイドライン
  2. アクセシビリティ向上のためにできること
    1. はじめに
    2. 基本構造とアクセシビリティ
    3. 画像の活用とアクセシビリティ
    4. リンクとアクセシビリティ
    5. テーブルとアクセシビリティ
    6. フォームとアクセシビリティ
    7. JavaScriptとアクセシビリティ
    8. スタイルシートとアクセシビリティ
    9. その他
    10. 参考:アクセシビリティ支援ツール、ブラウザなど
  3. アクセシビリティ実践例 鋭意制作中!
    1. リンクリストの代替テキスト“NOSCRIPT要素”
    2. 読みやすいフォントサイズ
    3. アクセシブルなサイト内検索
  4. W3C ウェブコンテンツ・アクセシビリティ・ガイドライン 1.0:チェックリスト

4. カスタマイズ関連の記事

とてもためになるサイト:
タグ・リスト:
Another HTML-lint
アクセシビリティ・チェック・ツール:

サイト内検索