福の神

趣味のホームページ制作
PHPでの手作りホームページ-XOOPSやMovableType等のCMSを使ってのサイトの作り方-

 
Web fuku-kami.net
 スペースの関係で「ホームページ」を「HP」と略している個所があります。
  トップページ -> アクセスアップの技術 -> 全部無料で作る -> 画像の扱いを見直す
アクセスアップをめざす <<− 画像の扱いを見直す −>> アクセスアップの下準備
マロンの顔 画像の扱いを見直す
2006年12月15日
 
このカテゴリーでは、「全部無料でつくる行列のできるホームページ」という書籍を題材にしています。

2回目の今回は、「画像の扱い方を見直す」です。

最近は、回線速度が上がっているので、割と問題にならなくなりつつあります。
ですが、やはり容量の大きい画像数があまりにもたくさんあると、快適さはなくなってきます。

本では、サイズを600ピクセル以内で納めるという考え方で、[300×200][200×130]ぐらいを目安にすると良いとしています。


速度的な事以外に、ディスプレイの表示領域の問題があります。
画像サイズがあまりにも大きいと、文字の部分のスペースが少なくなってしまいます。

逆に、大きなディスプレイを使用している人は、画像サイズが小さいと画像が見難くなってしまうという事も発生します。
記事中の画像は、小さめにして、画像をクリックすると大きなサイズが表示されるとか、工夫が必要ですが、かといって面倒ですよね。(^^;

その辺りが悩ましいところでもあるのですが・・・(^^;


バグラフォックスアクセス解析のツールで確認すると、「1024 x 768」が一番多いようですが、最近では、「1280 x 1024」も徐々に増えてきています。
私が、使用しているのは、「1280 x 1024」なので、[300×200]でも悪くないですが、「1024 x 768」だと、どうなのでしょう?

左の画像は、「爆釣!ハンドメイドルアー」で使用の画像ですが、[227×149]となっています。
どのように見えるでしょうか?

本当は、「1024 x 768」のディスプレイでも確認して、記事を作ると良いのでしょうが、まあ、趣味のホームページ制作なのでそこまでは、行っていません。

因みに、仕事では、デザイン(見た目)は関係ありませんので、作業性を考慮して、やはり「1280 x 1024」を使用しています。


速度的な事で、画像を考慮すると<img>タグに、width・height属性を記述すると良いとされています。
それは、width・height属性の記述があるとブラウザーは、その部分の領域を先に確保して、次のデータの表示に取り掛かれるからです。

width・height属性の記述がないと、ブラウザーはどれだけの領域を使うか分かりません。
したがって、画像が全て表示されるまでは、次の処理に取り掛かれないので、どうしても時間がかかってしまう事になります。

もし可能なら、なるべく画像のサイズは、記述するようにすると良いと思います。

※※前半部にある画像の推薦サイズは、本からの内容ですが、
※※それ以外は、本からの内容ではありません。
※※というか、タイトルは題材にしましたが内容は、ほとんどオリジナルです。

アクセスアップをめざす <<− 画像の扱いを見直す −>> アクセスアップの下準備
 

「素人がプロを超えるSEOプログラム」
8200万件サイトの中で1位と2位を独占した上位表示ノウハウ
 
このページの先頭へ