サイトの作り方
CSS HACKを使用しない
この記事は執筆されてから16年が経過しています。
CSS HACKとは、各ブラウザのバグや仕様(解釈の違い)を振り分け条件に利用することで、特定のブラウザのみに適応されるCSS記述を行う方法です。スターハック、アンダースコア、Hollyハック(バックスラッシュハック)などと呼ばれるものがあります。
CSS HACKはユーザの利用環境によって製作者が意図した通りに表示されない可変式のメディアであるWEBメディア特有の2001年に公開されたInternet Explorer(以下、IE)6などの古いタイプブラウザと2004年に公開された次世代型ブラウザとされるFirefox、Safariなどの新旧技術の混在から生じたものと考えられます。
CSS HACKはJavaScriptによるブラウザ振り分けを必要とせず、各ブラウザごとにCSSファイルを用意する必要がないために便利ですが、ブラウザのバグを利用していることが多くCSSの解釈に関するバグ修正によるアップデートがあった場合、その後の視覚表現を保障できるものではないためオススメできません。
CSSによるコーディング
2004年頃からWEB業界は標準化団体・W3Cが規格化を行う技術仕様に合わせたHTMLコーディングが行われつつあります。CSSは新しい技術ではなくCSS Level 1は1996年の12月に勧告されていますが、それ以前のブラウザでは視覚表現を定義するCSS規格に準拠しているものが少なく、CSSのみでは希望通りのデザインやレイアウトが再現できなかったためにテーブルタグが多用されていました。
CSS規格に準拠した次世代型ブラウザの登場により本来、表用のタグであったテーブルをレイアウトのために使用するのではなく、文書構造のためのHTML、視覚表現のためのCSSと本来の役割に戻ったとことになります。また、ソースを簡略化することで検索エンジン最適化(SEO)対策があると考えられています。
-
float問題
テーブルタグに変わりCSSでコーディングされW3Cに準拠しつつありますが、オブジェクトを回り込ませる命令であったfloatがコラム エリア表示として本来の目的とは異なる使用方法が生まれました。これはCSSにコラム表示のための命令がないために起こる問題であると考えられますが、CSS初心者にはfloatなど各ブラウザごとのCSSの仕様に慣れる必要があります。
IE7とCSS
特にIE6は一部はWEB標準に準じているものの、一部の独自のCSS命令やCSS解釈を持っておりIEで表示チェックを行いながら制作するとFirefoxで表示確認した際にレイアウトが崩れることがあります。しかし、2006年10月18日に公開されたIE7ではWEB標準に準拠するように解釈の変更がなされているためにIE6以前のブラウザとIE7ではレイアウトが崩れることがあります。このような場合は、
-
IE7より以前のIEでのみに特定のCSSファイルを読み込ませる
<!--[if lt IE 7]><link rel="stylesheet" href=hoge_ie.css" type="text/css" /><![endif]-->
-
IE7のみに特定のCSSファイルを読み込ませる
<!--[if IE7]><link rel="stylesheet" href="css/hoge_ie7.css" type="text/css" /><![endif]-->
と、することで対処できます。
最新ランキング
- ユグドラシル名前は「恐ろしき者の馬」を意味する。 世界を支えているトネリコの樹。世界樹。 ユグドラシルからは3本の太い根が出ており、ニブルヘイムに湧いているフヴェルゲルミル...
- レギンレイヴ名前は「神々を受け継ぐ者」を意味する。 ヴァルキューレの1人ではあるが、準女神として位置づけられていることからブリュンヒルドと同じような待遇を受けている可能性が...
- きねり甘い柿。熟柿。 「庭先の柿はキネリじゃけえ甘いよ」 渋柿が甘くなること。 「干した渋柿がキネッてきた」
- ゴールデン・ジュビリー・ダイヤモンド1985年、デビアス社が所有するプレミア鉱山(2003年に開鉱100周年を記念し、カリナン鉱山に名称変更)で発見された褐色をした755カラット(151g)のダイ...
- ル・レーブユリ科ユリ属のヤマユリ(山百合)、カノコユリ(鹿の子百合)などの原種を交配して、1975年に園芸品種としてアメリカで誕生した品種で、カサブランカ(Lilium...