オーセンティック【authentic】な home pageの作り方もしくは該当するガイドライン

「home page 作り方」をGoogleで検索してみます。

初めてhomepageを立ち上げる初心者向け情報、無料サーバ、怪しいSEO対策、低価格らしいweb作成受託会社等、現状特段役に立たないsiteがhitします。

さらに「home page 作り方 注意」をGoogleで検索してみます。

怪しいSEO対策、低価格らしいweb作成請負業者、アフィリエイト用ホームページの作り方、
アクセスup法を唄う謳うさらに怪しいsite等、一層役に立たないsiteの割合が増加します。



今時、新たにHPを作ろうとと考えるのは、なにか新規事業、商売を立ち上げた中小規模未満の商売人くらいで、非営利、趣味ベースの個人サイトにblogではなくhomepageを選択する人はさぞや奇特な方でしょうから。


知りたいのは目先のノウハウではなく、homepageのhtmlの正規表現。
つまり全うなhomepageの作り方。
そう、homepageの作り方の教科書。
しかも検定済み教科書。
おそらくどこかに検定指針らしいものがあるはず。

検索keywordが悪いのでしょう。
全うなということで「指針 基準 ガイドライン」、「作り方」ではなく「作成 制作」で検索。

すると
SEO対策、web作成請負業者、アフィリエイト関係のwebが一気に検索結果から弾かれます。
おそらく彼らの語彙にguidelineという単語がないのでしょう。

ありますね。
多数の公官庁におけるhomepageの作成ガイドライン。

ガイドラインとはある程度の客観的評価を耐えうる指導指針ともいえるものです。
これらが参考になりそうです。

そこで個人的に、最も訝しく感じている環境省のガイドラインと私のHomepageでの遵守状態を比較。

（以下引用一部略 赤字は私のコメント）

環境省ウェブサイト作成ガイドライン(第3版)(抄)

目次 1. はじめに 2. 情報を見やすくするために 3. 情報を探しやすくするために 4. ホームページ内を 快適に移動できるようにするために 5. 情報の内容を理解できるようにするために 6. 情報を支障なく読みとれるようにするために 7. 入力や操作を支障なく行えるようにするために 8. 危害や苦痛を与えないために 8.1. 画面の激しい点滅は行わない 8.2. 表示内容の移動や変化について注意する 平成23年11月9日改定 大臣官房総務課環境情報室

閲覧想定プラットフォームは以下によること。

• 1.Webブラウザ
• 以下のブラウザで、概ね同じ表示がなされるよう作成する。
• Internet Explorer 9, 8, 7、Firefox 4、Safari 5
• 以下のブラウザで、情報内容が読み取れないほど表示が崩れることがないように作成する。
• Internet Explorer 6、Opera 11、Google Chrome 10
• 2.HTMLのバージョン
• 環境省ホームページは、原則として以下の技術で作成、更新を行なう。
• HTML 4.01 Strict、Transitional、XHTML 1.0 Transitional、CSS2.1
• 3.文字コード等
• 文字コードutf-8で作成する。

昔非日本語版windowsを使用していたころ、頻繁にencode指定の無い日本語HPが遭遇しました。以来自分のHPには必ずencodeは指定しています。
chromeを標準とし、合理的と思える努力の範囲内でMS IE 9でも動作確認。
それ以外のbrowserでの確認も必要だと大変な作業になりそうです。

• 1. はじめに
• 1.1. 本ガイドラインの目的
• 1.2. 本ガイドラインの適用範囲
• 1.3. ウェブアクセシビリティについて
• 1.4. 根拠となる規格
• 国、地方公共団体等の公的機関ホームページはJIS X 8341-3：2010に対応することが求められています。
• 1.5. 配慮の対象となる利用者
• 視覚障害者、色覚障害、聴覚障害者、肢体不自由者
• その他配慮すべき利用者
• 難しい漢字や複雑な文章を理解することが難しい、ホームページの利用に慣れていない、古いブラウザを使用している、ダイヤルアップ接続など通信速度が速くない環境で利用している
• 1.6. 目標とするウェブアクセシビリティ等級
• 本ガイドラインでは、JIS X 8341-3：2010の等級AAを実現することを目標に、ホームページの作成を行う。

これが画像imageにaltを要求する背景だったようですね。
JIS X 8341-3：2010を個人サイトで遵守するのは、厳しいか。

• 2. 情報を見やすくするために
• 2.1. 文字色と背景色の組合せ、コントラストに配慮する
• 2.2. 読みやすい文字サイズ、フォント、行間を指定する
• 2.3. スタイルシートを適切に使用する
• 2.4. 文字サイズは利用者が変更できるようにする
• 文字のサイズはemや%などの相対的な単位で指定する。pt(ポイント)やpx(ピクセル)などの絶対的な単位は使用しない。

2.4は、初めて聞いた話です。その他はそれなりに留意している。

• 3. 情報を探しやすくするために
• 3.1. 適切なページタイトルをつける
• 3.2. 共通のナビゲーションの仕組みを用いる
• 3.3. 現在位置を把握するための仕組みを用意する。
• 3.4. 共通のメニューを読みとばす仕組みを用意する
• 3.5. 複数の探索手段を用意する
• 3.6. 文書の見出しを適切に分ける
• 3.7. 箇条書きはHTMLで表現する
• 箇条書きは、HTMLのタグを使って「記号付きリスト」「書式付きリスト」を表現する。
• 4. ホームページ内を快適に移動できるようにするために
• 4.1. リンク箇所は、識別と選択のしやすさに配慮する
• 4.2. リンクの表現は、リンク先を予測できる内容にする
• 4.3. PDFなどHTML以外のファイルにリンクを設定する場合は、分かりやすさに配慮する
• 4.4. 環境省ホームページ内のリンクと、外部へのリンクを区別する
• 4.6. 各行に表示されるテキストが平均40字以下を維持できるようにする

平均文字数40字程度は、冗長な文章文節を使う自分の注意すべき点でしょうね。

• 5. 情報の内容を理解できるようにするために
• 5.1. 読みの難しい言葉に読み方を併記する
• 5.2. 専門用語、省略語、流行語は多用しない
• 5.3. 外国語は多用しない
• 5.4. 分かりやすい説明、表現を心がける
• 5.5. データを表すための表組みを分かりやすく作る
• 5.6. レイアウトは読み上げ順に配慮して構成する
• 5.7. フレームは原則として使用しない
• 5.8. ページの自動更新や自動的な移動は行わない

フレームは原則として使用しないそうです。最近ようやくHPをまとめかけたところですが、昨今HPでframeを使用しているところがほとんどないようです。
90年代には極々普通の表現手段でしたが、確かbookmarkしにくかった記憶があります。

• 6. 情報を支障なく読みとれるようにするために
• 6.1. 規格及び仕様に準拠する
• 環境省ホームページは、原則として以下の技術で作成、更新を行なう。
• HTML 4.01 Strict
• HTML 4.01 Transitional
• XHTML 1.0 Transitional
• 6.2. 言語コードと文字コードを指定する
• html要素のlang属性またはxml:lang属性に、使用している言語を記述する。
• 文字コードutf-8で作成する。
• 6.3. 機種依存文字は使用しない
• 丸数字やローマ数字は、原則として使用しない。
• 旧字体は、原則として使用しない。
• 6.4. 単語の間にスペースや改行を挿入しない
• 6.5. 画像に適切な代替テキストを用意する
• 6.6. 音声で情報を提供する場合は、音声で伝える情報の内容をテキストで用意する
• 6.7. 動画で情報を提供する場合は、動画で伝える情報の内容をテキストで用意する
• 6.8. Word、Excel、PowerPoint形式のファイル提供には細心の注意をはらう
• 6.9. Word、Excel、PowerPointなどで作成したHTML文書は掲載しない
• 6.10. PDFは極力使用せず、使用する場合は作成方法、提供方法に配慮する
• 6.11. Flashを使用する場合は、同等のHTMLコンテンツなどによる補完を行う
• グローバルメニューなどの主たる操作部分にはFlashを使用しない。
• 6.12. 色のみに依存した情報提供はしない
• 6.13. 形または位置のみに依存した情報提供はしない
• 6.14. Java Appletは使用しない
• 6.15. 低速回線やモバイル機器の利用者に配慮する
• 7. 入力や操作を支障なく行えるようにするために
• 7.1. キーボードだけですべての操作が行えるようにする
• 7.2. 入力フォームは分かりやすく作成する
• 7.3. フォームの入力内容を確認し、取り消しや修正が可能な仕組みを用意する
• 7.4. 閲覧や操作、入力に制限時間を設定しない
• 7.5. JavaScriptを使用する場合は、様々な利用者に配慮する

キーボードのみ、つまりマウスを用いず操作するのは困難な気がずる?

• 8. 危害や苦痛を与えないために
• 8.1. 画面の激しい点滅は行わない
• 画面の一部を激しく点滅させない。
• 1秒間に3回より多く明滅させない。
• 8.2. 表示内容の移動や変化について注意する
• 原則として表示されているテキスト、あるいはテキストを含む画像を移動させない。画像内のテキスト内容が変化する画像を作成する必要がある場合は、5秒経過したら静止させる。

（引用終わり）

当然上記のガイドラインを公官庁は遵守しているだろうと思い、
ある公的機関のHPをみてみました（衆議院）。

実は今回初めて衆議院のHPをみました。

いくらguidelineを遵守しても、これは本当に日本の立法府を代表する機関のHPなのでしょうか?
90年代風のhomepageのようです。
少々残念です。