リセットCSSについて

実務でリセットCSSを使うときは、html5doctorとnormalize.cssかどちらにしようか考えているのですが、
現場ではこちらが良いと思いますか？

またhtml5doctorの場合下記のような変更を加えているサイトのソースを使わせてもらうのが良いかと思うのですが、情報が古いのも有りどれが良いかご存知なかたがいましたら教えてください。

http://www.html5.jp/html5doctor/html-5-reset-sty …
こちらのサイトもhtml5doctorで有名のようですね。
どちらのソースを使わせてもらおうか迷いますが、こちらは若干更新日が古そうですね。
http://www.html5-memo.com/first-html5/html5-002/のほうがよさそうなのですかね？

No.1 ベストアンサー 回答者： taloo 回答日時： 2014/09/03 04:43

reset.css

全て0にしてから設定したい数値を指定する

normalize.css
デフォルト値を設定してから0にしたいものに0を指定する

という違いだけなので、使いやすい方を使ってください。

新しいファイルは新しいHTMLタグが追加されていますので、できるだけ新しい方が良いです。

この回答へのお礼

reset.cssは分かるのですが、normalize.cssはブラウザの設定で表記してから、リセットしたいところだけ、
自分で指定してリセットするということですね。

必要なクセはあえて自分で残すということですね。

お礼日時：2014/09/03 13:58

No.3 回答者： ORUKA1951 回答日時： 2014/09/03 19:34

＞必要なクセはあえて自分で残すということですね。

　の意味が分かりません。
　ウェブ標準(HTML4.01strict+URL入りのDOCTYPE)だと、ブラウザ間の誤差--癖はほとんどないはずです。
　大事な事はユーザーインターフェースで、ユーザーが常用しているブラウザのもつデフォルトのスタイルシートは大きく変更しないほうが良いのです。リンクの色や下線とか、リストや引用ブロックの字下げとか・・。
　凝ったデザインが必要な場面は、トップページやナビゲーション部分だと思います。それ以外の記事の部分は、極力デフォルトのスタイルを活用することになると思います。それをいちいち再設定するのは労力の無駄じゃないかと。
　私的には、欧文と日本語の表記の差、具体的には、p{text-indent:1em;margin:0;line-height:1.7em;}とか・・一般的には固定スタイルシート(persistent style sheet)に書く程度のものとか。

　具体的にリセットCSSにしろ、normalize.cssにしろ、ほとんどの項目は、改めて設定しなければならないものが大部分を占めています。

　とにかくシンプルに分かりやすくしないとメンテナンス困る。


　

この回答へのお礼

ありがと

お礼日時：2014/09/03 20:10

No.2 回答者： ORUKA1951 回答日時： 2014/09/03 10:55

質問の趣旨と変わりますが、html5doctorはHTML5の勉強のためによく利用するのですが、リセットCSSは利用しません。

　リセットCSSの問題点
1) カスケーディングの仕組み上、本来デフォルトであるブラウザのもつスタイルシートをすべて無効にしてしまう。
　・カスケード処理の順序( http://momdo.s35.xrea.com/web-html-test/spec/CSS … )
　・HTML 4のためのデフォルトスタイルシート( http://momdo.s35.xrea.com/web-html-test/spec/CSS … )
　そのために、すべての要素に対するスタイルシートを再指定しなければならなくなる。
　それは、結果として
　・対応していない指定があるとデフォルトのスタイルさえ適用されない
　・スタイルシートが膨大で煩雑なものになりメンテナンスが難しくなる。
　・メディアごとのスタイルはどうするか？？
　　　handheldやspeech(aural)

　そのHTMLに登場するであろう要素に対してスタイルを指定すれば、リセットして再指定するよりはるかに簡単で分かりやすい。
　例えば、順不同リスト(UL)は本文中(section)などではデフォルトでよいが、ナビゲーション(nav)内ではblockやinline-blockにしたければ、
nav ul,nav ul li{list-style:none;margin:0;padding:0;position:relative;}
header nav ul li{width:20%;display:inline-block;}
section nav ul li{width:100%;}
ですむものを
リセットCSSを読み込ませたあとで
nav ul,nav ul li{position:relative;}
header nav ul li{width:20%;display:inline-block;}
section nav ul li{width:100%;}
section ol{margin:1em;padding:0 1em;}
section ol li{list-style:disc outside;margin:0.5em 0 0 2em;}
とかするよりよっぽど楽ですよ。
　
＞どちらのソースを使わせてもらおうか迷いますが、
　つかうなら、html5docterでしょうが、そもそもリセットCSSは使わないほうが楽ですよ。
　実際に使用して、携帯電話(handheld)、印刷(print)して泣く事になる。

この回答への補足

reset.cssは分かるのですが、normalize.cssはブラウザの設定で表記してから、リセットしたいところだけ、
自分で指定してリセットするということですね。

必要なクセはあえて自分で残すということですね。

補足日時：2014/09/03 13:58

この回答へのお礼

html5docterの方が良いのですね。
normalize.cssはどんなデメリットがあると思ったのでしょうか？

お礼日時：2014/09/03 13:47