私もなんだかんだでブログを始めてから10カ月が経とうとしています。この10カ月を振り返ってみると色々なことがあり、あの時はこんなことで悩んでいたな~とか、自分の理想通りに物事が運べてうれしかったことなど様々なことが脳裏に浮かびます。そんな中でふと思いました。「ブログを始めたばかりはデザインなどを弄り倒していたけど、最近は全く弄ってないな~」と。そこで数ヶ月ぶりにはてなブログの「デザインCSS」を見直してみると、無駄なところをたくさん発見!!これは盲点でした。デザインCSSを整理するだけでページの読み込みスピードが上がったりするのではないか??という期待の元、現状と私が考える対策を述べてみたいと思います。当記事はデザインCSSを整理しよう!!というような内容となっておりますが、CSSは変更をして一度保存してしまうと、サイトのレイアウトが崩れた際などに復元できません。数ヶ月ぶりに見直したデザインCSSは悲惨なものでした。おさらいも兼ねて、デザインCSS画面の確認の仕方から紹介します。自分のデザインCSSを見直してみてま~ひどい。なんと500行を超えていました!!正直、何行分書いてあったら多いとか少ないとかは分かりませんが、これは少ないに越したことはないでしょう。感覚的に500行オーバーは決して少なくはないと自己判断!!現在記録されているCSSに無駄がないかをひとつひとつ見直す作業を行ってみました。「メモを設けていないCSSの読解が出来ない!!」どういうことかと言いますと、下の画面をまずは見てみて下さい。デザインCSSのメモCSSの本文の前に/※〇〇※/で囲ったメモが残っています。このメモが残っているものに関しては、そのメモの直下にはその項目のCSSが記載されているんだなと分かりますが、中にはメモ無しでダイレクトにCSSを記載していたものも多々あり、CSSをコピペで対応してきた私にとっては大変なことです。今からCSSを弄る人達へCSSの本文だけをコピーして終わりではなく、自分が後で振り返った時に分かりやすいように何かメモを残しておくことをおススメします。これは本当に数か月前の自分に声を大にして言ってやりたいです。今となっては手遅れですが(笑)デザインCSSで不要箇所を抽出するこの作業が果てしないですね。メモを残しておけば問題なかったのですが、、「後悔先に立たず」ですので、ここで何を言っても始まりません。私のやり方ですが、抽出方法を紹介します。CSSの内容が分からないバージョン分からないものに関しては、いったん不明のCSSを削除し、実際のページで変更箇所を探して、なんのCSSであったかを特定する作業に没頭しました。すると意外と分かるもんですね!レスポンシブルに対応しているのであれば、元々のCSSで設定されている状態で自分が書いた記事(文字数やデコレーションが多い記事が良い)をスマホで開いておき、その後PCで該当のCSSを削除して保存してから先ほどスマホで開いておいた記事と同じ記事をPCで開いてみる。することでスマホの画面には元々のCSSでデザインされた記事が開いており、PCには該当のCSSが削除された状態の記事が開いているかと思います。そこで、両画面をにらめっこをすることで該当部分が分かりやすいかと思います。分からなければ別のページで試してみるのもアリですよ!メモが残っており、なんのCSSか予想出来るバージョンこれは簡単ですね。単純に「普段使用しているCSS」なのか、「削除しても現在のブログ運営に支障がないもの」なのかを振り分けるのみです。「削除しても現在のブログ運営に支障がないもの」に関してはただただ消すだけではなく、本当に削除しても問題ないのかを先ほど紹介したスマホとPCで同記事を開いて見比べる手法を使えば安全です。約250行!!1/2の削減成功!!そして、肝心のサイトの読み込みスピードの変化ですが、こちらのサイトでの測定結果をお示しします。AdSenseが大きく影響してます。広告を外せば早くなることが予想されますが、、そこは良きバランスを取ろうとは思っております。執筆時点現在、AdSenseにて手動広告と自動広告のハイブリッドについて実験中で、表示されている広告数は正直多いと思います。その多さがスピードテストの結果にモロに数字となって出てきています。無駄なCSSを削除するだけで多少ですが読み込みスピードにも影響することが分かったので良しとします!!「デザインCSSを今一度見直してみよう」まとめ私のブログではデザインCSSの無駄を省くことで大きく読み込みスピードが上がることはありませんでしたが、点数だけ見れば少し改善することが出来ました。無駄な点を削除するだけで改善しそうなので、しばらくデザインCSSを見てないな~という方は一度確認してみて下さい!!思わぬブログ改善につながるかもしれませんよ!!...それにしても読み込みスピードが致命的だ...ここをどうにかしないと。📩お問い合わせ月別アーカイブはてなブログをはじめよう!yakuzariさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。