WEB制作を行う上で、誰もがブラウザによる表示の違いに四苦八苦する。
忌わしのIE6もMicrosoftのサポート終了によりシェアが落ちてきた。ひとつのブラウザ（かつひとつのバージョン）がシェアを専有し続けることは今後そうはないだろうが、IE6があまりにも市場に居座り続けていた時代は本当に苦労したものだ。
HTML5+CSS3が浸透してきた今が、そうした悩みもあまり大きく感じる事もない穴場の時期かもしれない。
各主要ブラウザがHTML5+CSS3に対応し始め、WEB制作がしやすい環境になってきてはいるが、ブラウザによるHTML+CSSの解釈の違いは間違いなくある。CSSハックや条件分岐で特定の環境下にCSSを適用しブラウザ間の差異を巧みに埋める達人たちもいるが、私は「Reset CSS」をおすすめする。
Reset CSSとは？
ブラウザはデフォルトでそれぞれスタイルを持っており、例えば多くのブラウザではゴシック体のフォントを採用しているが、明朝体のフォントをデフォルトで採用しているブラウザも存在する。その他にもマージンや余白、罫線の微妙な違いなどマークアップをしていると気付かされる違いが多くある。
Reset CSSとは、そういったブラウザのデフォルトスタイルを初期化をするためのCSSだ。
ユニバーサルセレクタ
一昔前は私もユニバーサルセレクタ、すなわち全称セレクタで手軽にそういったスタイルをリセットしていた。
* { margin:0; padding:0; }
上記の様な手法だ。
アスタリスクはHTMLの全ての要素を意味しており、先頭にこれを記述することで全ての要素をリセットできる。（下手すりゃborderも0！）思い起こせば随分長い間使っていた気がする。
しかし、デメリットもある。まずブラウザのレンダリングが遅くなる。意図しないスタイルもリセットされ逆に工数がかかってしまう場合もある。特にフォーム関連の要素はデザインし直すのに苦労する。
では、全ての要素に個々にリセットをかけるCSSを準備しなければならないことになるのか？実はそうではなく、一般に公開されている、ルールさえ守れば商用利用可能なReset CSSを使うことで誰でも簡単に実装することができる。
世界の代表的なReset CSS
Yahoo! User Interface Library
Yahoo! User Interface Libraryの提供するReset CSS。私の手持ちのReset CSSもYUIのCSSを参考に作成したものだ。
Eric Meyer’s Reset
Eric Meyer氏によるReset CSS。一般に配布されているWordPressのテーマを見ると、私はこの手法を一番よく見かける気がする。
導入は計画的に
実際WEB制作で毎回Reset CSSを実装するかというとそうではなく、大体制作期間により決める。リセットをかけてそこからオリジナルデザインを構築することを考えると、適用することができない時もある。（早くデモサイトをリリースしなければならない時とか）
しかしいつでも使えるよう独自のCSSを備えてはいる。HTML5に対応したReset CSSも今後登場することだろうが、またそれを参考に独自に構築していくことは、おそらく私にとって楽しい作業だろう。
