【イーナチュラル】の ホームページをできる営業マンにするコラム:コレが気になる!

 

HOME » コラム(メルマガ) » コレが気になる! » スタイルシートレイアウトの4つのメリット

ホームページをできる営業マンにするコラム

メルマガ[ホームページを できる営業マン にする方法]

【2001年1月の創刊以来、毎月2回発行されている「まぐまぐ殿堂入り」のメールマガジンです。】

登録解除 

スタイルシートレイアウトの4つのメリット

  このエントリーをはてなブックマークに追加 

通常、ホームページは「HTML」で作られています。
ページのレイアウトは最近まで、HTMLタグの中でも「テーブル」タグが利用さ
れているケースが多かったようです。
しかし、SEOやアクセシビリティに注目が集まり、本来テーブルタグは「表」を
作成するためのタグということもあり、標準化団体「W3C」によって、「スタイ
ルシート」によるレイアウトへの移行が推進されています。ではスタイルシー
トによるレイアウトでは一体なにが良いのでしょうか。

1)デザイン要素の共通化
たとえば、

<h1>見出し</h1>

というズバリ見出しになるテキストに対しての装飾は、スタイルシートで

h1 { デザイン要素 }

と指定しておくことで、毎回画像や色を指定する必要がなくなり、<h1>タグで
テキストを挟む事で装飾されます。各ページで同じスタイルシートファイルを
利用していれば、スタイルシート内のh1タグのデザイン要素を修正することで、
全ページの見出しのデザインが一括で変更されます。

2)HTMLが簡潔に
テーブルタグによるレイアウトでは<table>、<th>、<tr>、<td>などのタグが何
度も繰り返され、細かいデザイン制御のために何重にも入れ子になっている事
も多く、HTMLコードの一覧性に欠けていました。制作者でも把握が大変で、大
部分をオーサリングソフトに頼ることになります。
スタイルシートでは背景画像や配色、ボーダーなど多くのデザイン要素を、外
部ファイルに置いておくことが出来るのでHTMLは非常にスッキリします。

3)HTMLの修正が楽に
スタイルシートでレイアウトされたHTMLは、<h>:見出し、<p>:段落、
<ul><li>・<ol><li>:リスト、<strong>:強調、などのようにテーブルレイア
ウトでコンテンツが入る<td>に比べて、そのタグが何を示すのか、が判りやす
くなっています。
企業が自社内で更新をする場合にも、数種類のタグを覚えれば、ある程度の更
新が出来るようにすることも可能です。

4)SEOにも効果がある
SEOでは、<h1>見出し</h1>などの重み付けのあるタグ内のテキストや、コード
内でのテキストの位置など、HTMLの書き方ひとつとっても色々と影響する要素
があります。最近ブログがSEOに効果的だと言われているのは、ページを追加し
やすい事もありますが、ブログのテンプレートが多くの場合、スタイルシート
レイアウトでSEOに沿ったコードの書き方をされている。という点も大きく影響
しています。


ここまでは、良い事ばかりのようですが、移行期間である現時点では色々と問
題点も抱えています。最も問題なのはブラウザごとのスタイルシートの解釈の
違いです。特にシェアの高いインターネット・エクスプローラーでは、他のブ
ラウザよりも実装が遅く、多数のバグ、間違った表示等の問題を抱えているた
め、実際に制作を繰り返してノウハウを持っていなければ、多数のブラウザに
対応するスタイルシートを作ることが出来ません。

ホームページの用途によっては古いブラウザをサポートしなければならない事
もあり、メリットであるデザインの共通化が活かせない、もしくはスタイルシー
トが適用されている事が仇となることさえあります。また、上記のことから実
際の制作・運用ではスタイルシートの複雑化もあり、移行すれば全てが良くな
るとも言えないのが現状です。

それでも多くのホームページではスタイルシートレイアウトに移行することで
得られるメリットは決して小さくなく、これから構築やリニューアルをする際
には検討するべき項目だと思われます。

スタイルシートへの取り組みは、現在は海外で盛んになっています。
海外のサイトですがスタイルシートレイアウトのサイトを紹介するポータルが
ありますのでご紹介しておきます。

【CSS Vault】 http://cssvault.com/
【CSS Beauty】 http://www.cssbeauty.com/
【Stylegala】 http://www.stylegala.com/

2005年11月09日   このエントリーをはてなブックマークに追加 

お問い合わせ

お電話でのお問い合わせ

03-6661-2210

ホームページからのお問い合わせ

お問い合わせはこちら

営業中。お問い合わせください

 
 

メールマガジン[ホームページを できる営業マン にする方法]

【2001年1月の創刊以来、毎月2回発行されている「まぐまぐ殿堂入り」のメールマガジンです。(読者数10,000名)】

登録解除 

イーナチュラルの書籍

その営業はもう、
ホームページに
まかせなさい!

翔泳社
齋藤伸也著
1,470円(税込)

ビジネスブログの
つくり方

秀和システム
齋藤伸也・共著
1,365円(税込)

リスティング広告

Yahoo!プロモーション広告正規代理店・Googleアドワーズ認定パートナー

Yahoo!プロモーション広告正規代理店・Googleアドワーズ認定パートナーです。

ビジネスブログ制作はお任せ下さい!

ビジネスブログ

SixApart社「MovableType」のパートナー企業です。