画像を読み込む順番を指定したいです

質問

私はイラストレーターで、自分のサイトに作品を載せるため、画像数がたくさんあります。たとえば画像が50枚あるとしたら、１枚目から画像を読み込むようにするにはどうすればよいのでしょうか？

今の問題は、作品のページを読み込むのにすごく時間がかかってしまいます。15秒くらいかかって、やっとすべてのアイコン画像と、作品の画像が読み込めます。これは、画像を50枚一気に読み込んでいるから遅いのですよね？そうではなく１枚目から順々に読み込んでいって、最後の50枚目は、他の画像を見ている間に読み込めれば時間がかからないと思うのですが、そのような設定はどうすればいいでしょうか。
それとも、その他に、読み込みを遅くしている原因は何か考えられますか？
DreamweaverとCSSに基本的な知識はありますが、すごく詳しいわけでもありません。宜しくお願いします。

回答No.4

nori_007

以下の回答します。

>＞２、画像データが大きい場合、解像度が不要に高くないか。
>どのくらいの解像度がいいのでしょうか？

モニターの解像度は、72dpi もしくは 96dpi が一般的です。これ以上の解像度にしても、見た目の違いは有りません。ただし印刷した場合印字品質は余り良く有りません。印刷を考えた場合、解像度はプリンタの能力に依存します。

ちなみに、No3 さんの回答は少し勘違いされていると思います。

>＞３、全ての画像を１ページで表示させてないか。
>これは、例えばサムネールをクリックしたときに、別のウインドで画像を表示するほうがいいという事でしょうか？

考え方次第です。画像が50点あるなら、１ページに10点掲載して5ページ作るというこも考えられます。
その際に、サムネール画像はサイズを小さくした、サムネール専用の画像を用意することが望ましい。html でオリジナル画像のサイズを小さくして表示させる事は余り望ましくない。

ちなみに、No3 さんの回答は半分正解、半分は自分の回答を参考にしてみてください。。

>＞４、サムネールの画像と、詳細画像は分けているか。
>これはどういう意味でしょうか？

オリジナルの画像サイズが判らないのですが、オリジナルの画像とは別に、サムネール用の小さい画像を用意すると言う事です。
オリジナルとは別に、画像解像度72dpiで、サイズは300px x 200px 等のサムネール専用画像を作るという事です。

サムネール画像をクリックしたら、オリジナル画像を開くように、オリジナル画像にリンクさせます。

最後に、要は今まで以上に手間がかかるとご理解ください。

回答No.3

HIRSYU

＞＞２、画像データが大きい場合、解像度が不要に高くないか。
＞どのくらいの解像度がいいのでしょうか？
表示サイズと同じ。
imgタグを使用しているなら、imgタグに指定したheightとwidthの値と同じ。

＞＞３、全ての画像を１ページで表示させてないか。
＞これは、例えばサムネールをクリックしたときに、別のウインドで画＞像を表示するほうがいいという事でしょうか？
Yes

＞＞４、サムネールの画像と、詳細画像は分けているか。
＞これはどういう意味でしょうか？
サムネイルは256ｘ192サイズの画像を使い、別窓などで開いた画像は1024ｘ768サイズの画像を使う。

ブラウザが表示する画像は、目に見えてる表示サイズではなく、実際にそのサイトのサーバーにある画像サイズ分をダウンロードして表示しています。
（見た目が小さくても、画像のファイルサイズが大きいとダウンロードに時間がかかり、表示も時間がかかる）
ですので、サムネイル一覧では、ファイルサイズの小さくなる画像を利用するのが一般的です。

回答No.2

tenderfeel

レイアウトにTable使ってませんか？

tableは全てデータを読み込んでから表示するので、
上から順番に表示という動作はしません。
そのためデータが重ければ重いほど表示までのレスポンスが遅くなります。
場合によってはクラッシュすることもあります。

もしテーブルレイアウトであれば細かくテーブルを分けたり、
テーブルレイアウト自体やめてDivやリストでの記述にするだけでも
ずいぶん変わってくると思います。

補足

>もしテーブルレイアウトであれば細かくテーブルを分けたり、

例えば、1～25枚の画像を1のテーブル、その下に26～50枚の画像のテーブルを作ると、先に１のテーブルが読み込まれるという事でしょうか？

回答No.1

nori_007

画像データは順番に読み込まれ、読み込まれた順に表示されています。
でも、希望通りにならないと言う事で有れば、下記の項目をご確認ください。

１、画像データが大きくないか？
２、画像データが大きい場合、解像度が不要に高くないか。
３、全ての画像を１ページで表示させてないか。
４、サムネールの画像と、詳細画像は分けているか。

等々をご検討ください。

補足

＞２、画像データが大きい場合、解像度が不要に高くないか。
どのくらいの解像度がいいのでしょうか？

＞３、全ての画像を１ページで表示させてないか。
これは、例えばサムネールをクリックしたときに、別のウインドで画像を表示するほうがいいという事でしょうか？

＞４、サムネールの画像と、詳細画像は分けているか。
これはどういう意味でしょうか？