京都市 ホームページ制作 会社 / アクセシビリティ・ユーザビリティ配慮
メルマガバックナンバー2007年8号
表示スタイルはスタイルシートを用いる【5.2構造及び表示スタイルb）】
【2007.8.28】毎月第2・4火曜日発行
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
障害者や高齢者をはじめ、誰もがアクセス可能なホームページについて
考えるwebアクセシビリティは、検索エンジン（SEO）対策に最も効果的です。
顧客拡大、売上増のための「アクセシビリティとSEOの融合」やホームページ
作成について出来るだけ簡単に解説いたします。
http://plus.revonet.co.jp
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
こんばんは、レボネット株式会社の坂井です。
このメルマガでは、ウェブアクセシビリティ技術向上のため、
誰でも支障なくウェブコンテンツを閲覧できるようにするため、
ウェブ技術向上の指針となるJIS規格を中心にお伝えしております。
本日は、ウェブコンテンツの文字や背景色などの表示を
どのようにするか、についてお伝えします。
前号はお盆期間のため、お休みさせていただきました。
今日もはりきって参りましょう。
---------------------------------------------------------------------
■表示スタイルはスタイルシートを用いる【5.2構造及び表示スタイルb）】
ホームページを制作する際、現在では、スタイルシートを使って
デザインすることは一般的になってきております。
一般的には、HTMLとCSSの組み合わせであったり、XHTMLとCSSの組み合わせで
あることが多いと思います。
文書構造を記述するものがHTMLであり、
デザイン部分を外部制御するものがCSSです。
簡単に言いますと、テキストなどの文章の内容はHTMLで記述し、
文字の大きさや色、背景の色などはCSSでデザインするということです。
一昔前までは、ブラウザのサポートなどにより、本来、文書構造を
規定するはずのHTMLに、文字を大きくしたり色を変えたりするデザイン構造も
記述して、ホームページを表現してきました。
文法的に正しくないサイトが乱立し、音声ブラウザや
スクリーンリーダー利用者、ブラウザの違いなど閲覧状況が
異なる場合に、様々な弊害が出てくるようになってきました。
そのような弊害も考慮して、ウェブサイトの質も問われるように
なってきております。
以上のような流れも理解し、JIS規格には以下のように
表現されております。
ウェブコンテンツの表示スタイルは、文書の構造と分離して、サイズ、
色、背景色などをスタイルシートを用いて記述することが望ましい。
ただし、利用者がスタイルシートを使用できない場合、
意図的に使用しないときであっても、
ウェブコンテンツの閲覧及び理解に支障が生じてはならない。
補足
JISでは、以上のように表現されており、文書構造となるHTMLと分離して、
文字のサイズや色、背景色などのデザインはスタイルシートである
CSSで表現することが望ましいとされています。
スタイルシートでの表現が望ましいとされていますが、
ブラウザが古くてスタイルシートが使用できない場合、
スタイルシートをはずすなど意図的に使用しない場合でも、
内容の閲覧と理解ができるようにしなければならないのです。
簡単に言うと以下のようになります。
デザインはHTMLではなく、スタイルシートであるCSSで表現する。
↓
スタイルシートを使っても、文章内容は閲覧でき、理解できるように
配慮して利用しなければならない。
以上を満たすには、CSSを使ったデザインに取り組み、様々なブラウザの違いや
バージョンの違いについて知るなど、試行錯誤が必要になります。
今回お話した取り組みの第一歩として、まずは、
表示スタイルはHTMLに直接記述しないで、CSSでデザインしましょう。
次回は、【5.2構造及び表示スタイルc）】をお伝えします。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
【編集後記 SEO対策との関連について】
---------------------------------------------------------------------
デザイン的な表現をHTMLに記述した場合、ブラウザ・バージョンの違いや
目の見えない音声ブラウザ利用者などに支障が生じ、適切に情報を
閲覧できない場合があるということでした。
検索エンジン対策の観点からですと、文法的に正しくない記述が多くなるので、
検索エンジンがキーワードを読みにくくなるという弊害があります。
本来のHTMLの役割である文書構造を適切に記述して、検索エンジンにも読みやすい
無駄なタグのないすっきりとした構造にすると、検索エンジン上位表示にも
効果を発揮します。
また、デザイン部分と明確にファイルを分けることができ、
管理がしやすい、デザインの変更がしやすい、
ページの表示スピードが速くストレスを与えないページが実現するなど、
検索エンジン対策以外にもスタイルシートを用いることは
たくさんのメリットがあります。
まだ、ホームページにCSSを導入されていない方は、
これからデザインはCSSで取り組んでくださいね。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
「誰でもわかる！SEO効果の高いアクセシビリティ対策」
───────────────────────────────────
□ 発行元 ..... "アクセシビリティ・ユーザビリティを考慮した
京都のホームページ制作会社"
レボネット株式会社 http://plus.revonet.co.jp
ビジネスパートナー募集 http://www.revonet.co.jp/bp
スタッフブログ http://blog.livedoor.jp/revonet_sakai
京都府京都市下京区朱雀正会町24番地
TEL:075-344-3348 FAX:075-344-3343
□ E-mail ..... sakai@revonet.co.jp
このメールマガジンの転送は自由です。よろしければ転送してください。
----------------------------------------------------------------------
□ 発行周期 ..... 毎月第2・4火曜日
□ バックナンバー.. http://plus.revonet.co.jp/backnumber.html
■ メルマガ配信登録・アドレス変更・配信停止はこちらからお願いいたします。
まぐまぐ .... http://plus.revonet.co.jp/magazine.html
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━