0最近はwordpressにばかり翻弄されてあまりCSSについて調べたりする時間が前より減っていたのですが、最近サイト高速化などに専念してたら久々にCSSにも触れることになったので。サイト高速化、軽量化の視点からCSSの書き方についてまとめてみました。@importはサイト高速化には不利wordpressサイトだとstyle.cssに書き込むことの多い@import。これ、サイト高速化にはよろしくないようです。Insightsだと修正対象扱いになります。CSSは1枚に集約した方がページ速度には有利だそうですが1枚のファイル容量が膨大になってもねえ。いう基準なのがよく分かりました。class、id名のみでなるべくシンプルに指定するCSSって右から左に読み込むらしいんですよ。いう指定だとまずcss内全てのh2を読みにいく→h2を内包する親プロパティのsectionを全て巡回、という二段構えなので、その分読み込みに時間がかかるらしい。class="midashi"></h2>cssでは.midashiのみの指定で済むので読み込み時間も軽減になるという。的な書き方も読み込み時間がかかるようですよ。シンプルに.midashiとか#midashiのみで完結できると読み込み速度には良いらしいですね。うーん、個人的にはクラス名とかid名を書かずに子孫セレクタのみのコーディングが好きなのでこれは結構衝撃でした、、子孫セレクタだとhtml上はすっきりしてもcss上は重くなるなんて!CSS3は子孫セレクタの宝庫なのにそれがアダになるなんてねえ。(今回「●●ねえ」の語尾が多いな。それだけ動揺?しとりますw)ベンダープレフィクスはいらない?この見出しは語弊がありますが、各ブラウザのバージョンアップや、XP終了などの喜ばしい(笑)状況につきベンダープレフィクスが不要なプロパティが増えてきました。以下のサイトに現状と解説がまとめられています。W3Gこちらを見ていると、FireFox3.6とIE9を切れば大体のプロパティはベンダープレフィクスなしでもいけそうですが(笑)、やはりまだ根強いので個人的には以下のように書こうかと考えています。url(/wordpress/wp-content/themes/hoge/js/PIE.htc);}グラデーションはまだしばらく現状のままが無難かな。PIE」でIEでも複数背景画像を表示させる。PIE」でIEでも複数背景画像を表示させる。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。中の人カイカデザインキャッチコピーを『今依頼できるデザイナー・平日フリーランス』(パクリ疑惑)にしたいフリーランスデザイナー。当ブログではまっとうな制作者がつまづきそうもない部分でつまづいている実体験を、もともと持ち合わせてない恥もプライドもかなぐり捨ててさらしております。