一部、記事に誤表記と、その他の検証がもれていたので

記事を更新します。

修正部分は、赤文字表示となっています。


いつも更新を楽しみにしていてる!!、海外SEO情報ブログ のSuzukiさんの記事で気になる話題を

みつけました☆


ページの読み込み時間と検索順位の関係



YouTube付きの記事は、いつもほんまに楽しみなんです☆

それに、とっても読みやすく、キレイにまとめて書いてくれてるので

ちょっとした時間で多くの事が吸収できて、とっても感謝しています☆^0^☆


そんな、Suzukiさんの記事で

ページの読み込み時間と検索順位の関係ですが・・・

結果は、記事をみてもらうという事でw



今回は、アメーバにおける、ページの読み込みの仕組みです。

すでに、多くの方が記事にしているので、ご存知の方は多いと思いますが

アメーバのサーブレットは



1.ヘッダーを読み込む

2.左サイドバーを読み込む

3.メッセージエリアを読み込む

4.記事を読み込む

5.右サイドバーを読み込む ※左サイドバー→右サイドバー(修正しました。)

6.フッターを読み込む



の順番で構成されています。

図解に表すと!!


ゆきだるまの営業日誌とMOTラボ


以下、それぞれのパターンでの検証結果です。ここから追加記事です。


2コラム右の場合


ゆきだるまの営業日誌とMOTラボ  1.TOPヘッダーを読み込む

 2.左サイドバーを読み込み

 3.メッセージエリアを読み込む

 4.記事を読み込む

 5.フッターを読み込む


この場合、サイドバーを読み込んでから、記事になりますので、比較的重たいパーツをつけてると

ブログ全体の表示が遅くなります。

また、大脳生理学上・・・左から認識するため、記事に目がとどまる率が低くなります(たぶん)w



2コラム左の場合


ゆきだるまの営業日誌とMOTラボ  1.TOPヘッダーを読み込む

 2.右サイドバーを読み込み

 3.メッセージエリアを読み込む

 4.記事を読み込む

 5.フッターを読み込む


このタイプは、上の2コラム右と全く同じです。

サイドバーが右側にあるから、記事の方が先に読み込まれるって思ったら・・・間違いです

この場合も、比較的重たいパーツをつけると、ブログ全体の表示に影響が出ます。


3コラム中央の場合


ゆきだるまの営業日誌とMOTラボ

 1.TOPヘッダーを読み込む

 2.左サイドバーを読み込み

 3.メッセージエリアを読み込む

 4.記事を読み込む

 5.右サイドバーを読み込み

 6.フッターを読み込む


比較的、一番利用されているレイアウトだと思います。

このレイアウトの弱点は...記事エリアをカスタマイズしないと・・・とても狭いというところ

派手なサイドバーに挟まれた記事を目立たせるには一苦労ですT-T



3コラム右の場合


ゆきだるまの営業日誌とMOTラボ  1.TOPヘッダーを読み込む

 2.左サイドバーを読み込み

 3.メッセージエリアを読み込む

 4.記事を読み込む

 5.右サイドバーを読み込み

 6.フッターを読み込む


このレイアウト・・・以外です!!

2列にくっついたサイドバー・・・・2番目のサイドバーは記事の後に読み込まれます。

順番としては、3コラム中央と同じ。

でも、派手なサイドバーが左側に2つも・・・あまり見慣れないレイアウトなので、記事との境界が

わかりにくい場合があります(自論)


3コラム左の場合


ゆきだるまの営業日誌とMOTラボ  1.TOPヘッダーを読み込む

 2.左サイドバーを読み込み

 3.メッセージエリアを読み込む

 4.記事を読み込む

 5.右サイドバーを読み込み

 6.フッターを読み込む


このパターンも同じ順番としては、3コラム中央と同じ。とっても以外w

サイドバーを右側に寄せたのはいいけど、記事エリアがせまくなっちゃうのが・・・難点(自論)

同じく、あまり見かけないレイアウトです。



人の目線は・・・ほとんどが、左からまん中にかけて集中します

あたしのこのブログもそうですが・・・ヒートマップでクリック位置をみてると、びっくりですw

青い部分が、クリックされたエリアです。

基本・・・・右側に興味ありませんwwwな結果www
ゆきだるまの営業日誌とMOTラボ

ここまでが、追加記事です------


こんな感じ・・・


この事をふまえて、ブロガーさんが損をする事を上げてみると


1.ヘッダーの画像を高画質にすると、ブログ全体の表示に影響が出ます。←あたしw

2.左サイドバーにいろんなパーツを配置すると、ブログ全体の表示に影響が出ます。

3.記事数が多くなって(10記事)、画像が沢山ある記事やと

  ブログの記事表示に影響が出ます。


それと!!

アメーバのブログは

表示するまでにシステムとして、10個以上のスクリプトを読み込みます。


これは、システムなので、しゃあおへんけど...

とにかく、上と左にいろいろ置くと・・・・遅くなりますww


あたしは、サイドバーを右側に配置していますが・・・

以上のような理由のほかに


もう一つ理由があります。


それは、サイドバーは、記事よりも目立ってはいけない!!ということです!!



これは、自論ですが・・・・

サイドバーは派手です。その為にあるバーやからしゃあおへんけど

ブログパーツも、とっても目立つように出来ています!!!



でも、サイドバーを見にブログに来てもらうのではなく・・・記事をみにきてもらうので

サイドバーに吸い込まれては・・・困りますよね・・・汗


人は、眼で見た情報は、左から右に理解し、明るい色から認識します。

色の反転や物の形を利用して強調したい部分、協調したい部分それぞれ、作ることが可能です


「吸い込まれる、コンテンツ」を作るには

ブログという空間に配置と色をちょうどよく組み合わせる事ができたら、完成です。

まだまだ、あたしも、いろいろ実験して、吸い込まれるコンテンツ作りを目指したいと思います。



ゆきだるまの営業日誌とMOTラボ


最初の話と・・・・・とってもかけ離れちゃいましたが・・・

ページの読み込みが遅いのは

 左側にいろいろあるから・・・で始まって、記事を読んでほしいのに、左が目立ってどーするになって

 どう、見やすくさせるかに落ち着きましたww



さ~ってと・・・・

エステのお仕事かたづけちゃおっとww