CSSで使いやすいページ作り (ユーザビリティー・アクセシビリティー)

ホームページの利用者にはさまざまな状態（年齢・身体的ハンディ等）の方がいます。
多くの方の使いやすさを考えて、当社では次の方法でホームページを作成しています。

■レイアウト・文字装飾をCSS（スタイルシート）で行います。
■レイアウトをテーブル（table）組みに依存せず、テーブルは本来の表組みに使うことを基本にします。

CSSとは？　その利点はどこにある？

CSSとは

「ページのレイアウトや文字装飾」を指定する書式

のことです。

CSSは、HTMLファイルに書くことも、別ファイルに書くこともできます。

CSSを別ファイルにすると、「レイアウト・文字修飾」がHTMLから切り離され、HTMLファイルには「文章の中味＋構造」がシンプルに残るのです。

このことが、いろいろな利点を生みます。
たとえば

• 表示に余計な時間がかからない
• 内容が論理的な構造となり、音声プラウザを使用した場合に順序よく内容が読み上げられる
• 検索エンジンにタイトルやキーワードを適切に拾い上げられる

などです。

テーブル組みレイアウトは注意が必要

テーブル（table）タグでレイアウトする方法は重宝ではあるのですが、本来、テーブルは「表」を表示するためのものです。むやみにレイアウトに使ってしまうのは問題があります。

一つは、テーブルは全体を読み込んでから表示を始めるために、複雑に組まれたテーブルは表示に時間がかかることです。

もう一つは、テーブルで見た目を整えたために、音声ブラウザでおかしな順序に読み上げられる場合があること。

テーブルのセル内容は通常左から右へ読まれますので、縦方向に関連づけられている場合は「無関係な方向に続けて読まれる」ことになります。目で見る人には問題ない表示であっても、音声で認識する人にとっては大変わかりづらいものです。

テーブルでレイアウトを組むのはなるべく控え、表組みとしてテーブルを作る場合にも「順序」に気をつけて作る必要があります。

CSSはSEO（検索対策）の効果もある

CSSによってシンプルに作られたページは、検索エンジンにも内容がしっかり認識され、それだけ検索に拾われやすくなります。

ブログは検索の上位に上がりやすいですが、それはブログがCSSによるシンプルな書式になっているからです。