『わたブログ』 PointHeart’s magazines

映画・書籍・ゲーム・都市伝説などホラーなエンタメを中心に紹介している雑誌ブログサイト

重いはてなブログを軽くし高速化する「11の方法」

 

 

f:id:PointHeart:20220403170633j:plain

ブログの表示スピードの重要度は、アクセス増や直帰率、Googleの検索結果に与える影響が少なく無い。

WordPressならいざ知らず、ある程度のブログ設計をはてなブログに依存しているはてなユーザーでは、表示速度をあげるために出来る事は限られてくる。

専門知識が豊富なユーザーなら、ブログテーマを表示スピードに最適化されたテーマを作る、またCSSをいじって最適化する…なんて事も出来そうだが、素人にはとても無理。

今回は素人でも出来る、はてなブログを極力軽くし、表示スピード上げるためにできる事を11の方法をご紹介。

 

 

ブログ表示速度の重要性

f:id:PointHeart:20220403171018j:plain

まずはブログの表示スピードを上げる事がいかに重要かの確認を。

WEBサイトの表示速度って重要なの? WEBページの表示速度は、ユーザビリティを向上させるために重要な要素の1つです。 Googleが行った調査では、WEBページの読み込みに3秒以上かかるページからは53%の人がページを見る前に他のWEBサイトに移ってしまうという分析結果を紹介しています。
引用元:https://www.zenken.co.jp/blog/editor/44643

さらに2012年には、Googleが「ページの表示速度は検索結果のランキング要因の一つである」と公表しており、ユーザーの利便性を追求するGoogleにとって、サイトの表示スピードの重要性は年々上がっている事が考えられている。

この様に、ブログを表示させるスピードはアクセスを増やしていく上で重要なファクターである事がわかる。

自分のブログ表示速度を知るには

PageSpeed Insights

こちらで自身のブログスピードをスコアで評価(0〜100)され、この点数により「緑→オレンジ→赤」の順で表示スピードの適正具合が一目でわかる様になっている。

※計測するサーバーが海外にある関係上、日本のスピードスコアは低くなる傾向にあります。スコア評価はあくまでも、改善された目安として見た方がよいです。

 

はてなブログを軽くする11の方法

画像を圧縮する

ブログ記事で画像を使用する際に、撮影またはフリー素材でダウンロードした画像をそのまま使うのではなく、リサイズや圧縮して容量を小さくする。

ブログに表示される画像のサイズには制限があり、3000×2000の画像を上げても意味はない。自分のブログサイズに適したサイズに変更してしまう。

ネット上でよく見かけるサイズ容量50KB〜200KBを目安として、画像を貼り付ける。

拡張子はJPEGに

PDFやPNGなどの画像種類が存在しているが、ネットのアップに優れたJPEGに変更する。

JPEGは、フルカラー画像を多少の劣化を伴いながら高圧縮できるのが特徴。ブログの画像において一般的に広く用いられる。

JPEGの発展型「JPEG2000」に変換できれば、なお画像サイズの圧縮も可能。こちらはJPEGに比べて画質の劣化を抑えながら、より圧縮率を上げる事もできる。

はてなスターを非表示

はてなブログの独自機能「はてなスター」。ブログ運営者同士のコミュニケーションで、いわゆる「足跡」や「いいね」機能に近い「記事、読みました」というアピール機能だが、これの表示を非表示にしてしまう。

はてなブログ管理者メニュー→サイドメニュー「デザイン」→「カスタマイズ」→「記事」→「はてなスター」のチェックを外す。

ブックマークを非表示

はてなスター同様にブックマーク機能も非表示にしてしまう。ただし、こちらは俗にはてなブックマーク砲「はてブ砲」と言われるアクセス急増の可能性を生む拡散機能も有しているため、自分の現状のアクセスを見て非表示にするかは要検討。

ソーシャルボタンを非表示

TwitterやFacebookのソーシャルボタンを非表示にする。

TwitterやFacebookからのアクセスが多くなく、あってもそこまで重要ではないなら非表示にしてしまう。

はてなブログ管理者メニュー→サイドメニュー「デザイン」→「カスタマイズ」→「記事」→「ソーシャルパーツ」の不要なコンテンツのチェックを外す。

はてなブックマークのコメント欄を無効に

はてなブックマークで表示されるコメントを無効にしてしまう。こちらもブックマークコメントの表示には別の読み込みがあり時間が掛かっているので、不要であれば非表示に。

はてなブックマークは残し、コメント欄のみ非表示もあり。

はてなブログ管理者メニュー→サイドメニュー「デザイン」→「カスタマイズ」→「記事」→「はてなブックマークコメント」のチェックを外す。

 

記事コメントを無効に

ブログの表示に不要な物は非表示にしてしまう。

記事へのコメントを承認制にし、承認しない限り非表示の設定に変更。はてなブックマークのコメントのみ残す事もあり。

はてなブログ管理者メニュー→サイドメニュー→設定→基本設定→コメント不許可またはコメント承認後まで非表示設定

不要な広告を非表示に

〈script〉から始まるjavascriptの記述や読み込みは、ページ表示を遅くしてこれらを実行しようとしてしまう。広告を貼り付けると、これらの実行処理によりブログ表示が遅くなってしまうため、クリック率が低く不要な広告は削除してしまう。

リンクカードの使用を控える

はてなブログではデフォルト機能でリンクカードを作成できるが、見栄えもよく簡単にできるがゆえに多用しやすい。だが、実際にブログを表示させる際には、このリンクカードがブログ表示の重くなる原因だったりしてしまう。

そのため、リンクカードを多用するのではなく「タイトル」リンクを極力使用し、ここぞというアピールポイントでリンクカードを使用する様にしていく。

使っていないCSSを削除する

ついつい色々な機能を追加していってしまうブログのデザインCSS。実際にブログが表示される際には、これらのCSSやHTMLを読み込む事で自分の思い描いたデザインの記事が表示されている。使っていないCSSがあれば、この読み込む時間そのものが表示スピードの足枷になっているため削除してしまう。

※CSSをいじると、予期せぬトラブルが発生する場合があります。必ずバックアップを取り、不要なCSSを削除した後は必ず、自分のブログで不具合がないかチェックしてください。

ブログトップページの記事表示数を減らす

ブログのトップページには、MAX15まで過去の記事を表示する事ができる。当然、表示数が多ければ多いほどブログの表示されるスピードは遅延していく。自身のトップページのデザインを見て、減らしても外観を損なわない程度に表示数を減らしてしまう。

はてなブログ管理者メニュー→サイドメニュー→設定→詳細設定→トップページの記事数で調整。

 

終わりに

サイトの表示速度をスコア化するサイト「PageSpeed Insights」は他社のブログの速度も測れる。これによると、にほんブログ村、エキサイトブログランキングなど、上位を位置しているブロガーの表示速度は「PageSpeed Insights」測定で90スコアを超えている事も珍しくない事がわかる。

きちんとしたSEO対策の一つとして、サイト表示の軽量化も重要な指標になるのだろう。

なのだが、上位者の中にも表示速度のスコアが良くないところも意外に多かったりする。表示速度を気にする事は大事だが、それを気にして自分の思い描くブログデザインを崩すま所まではいじらなくても良さそうだ。