HTMLについて質問です。

imgタグでサイズを指定するメリットはなんですか?

画像が無かったときにサイズを保持した枠が表示されたとしても、そこにどんなメリットがあるのかわかりません。
無いならわざわざ枠を表示させなくても良いと思います。

HTMLの仕様だからという理由以外で教えてください。

回答の条件
  • 1人2回まで
  • 登録:2008/12/16 11:21:13
  • 終了:2008/12/17 14:36:58

ベストアンサー

id:pahoo No.4

pahoo回答回数5960ベストアンサー獲得回数6332008/12/16 14:03:21

ポイント25pt

画像が無かったときにサイズを保持した枠が表示されたとしても

width, height 属性で指定された分だけ余白となるので、レイアウトを保持できます。

また、ブラウザで「画像を表示しない」と設定している人(例:モバイルでアクセスしている場合)もいるので、この場合にも有効です。


ではブロードバンドが普及して、PCの性能も上がっている現在ではどうなのでしょうか

1ページが非常に長く、多数の画像と文章が混在している写真ブログの場合、ブロードバンドでPCの性能が高くなったとしても、レンダリングに時間がかかります。


個人的には、最初に述べたように、モバイルでアクセスしてくるユーザーが増えているため、width, height 属性は指定すべきだと考えています。

id:Rustic

ありがとうございます。

たしかにモバイルサイトの場合画像サイズを指定してないとロード中にがたがたすることがありますね。

また、非常に長いブログについてはたしかに表示に時間がかかってますね。

私の意見のですが、モバイルサイトについてはロード中のがたがたはさほど気にならないように思えます。

2008/12/16 14:30:33

その他の回答(4件)

id:masahikokimoto No.1

masahikokimoto回答回数241ベストアンサー獲得回数102008/12/16 11:31:31

ポイント25pt

メリットというか、画像のリサイズをブラウザ側でやってくれます。

だから、例えば外部の画像をインラインで参照する時に小さくしたい場合などは便利です。

あと、レイアウトエンジンに画像読み込み前に大きさを知らせられるので、体感ですが若干レンダリング

が速いような気がします。

id:Rustic

ありがとうございます。

画像の本来のサイズ以外で表示させることがないのですが、もしそういった必要性があれば有効ですね。

画像表示に関してはこのような記事もありました。

http://designblog.ecstudio.jp/guideline/img-width-height.html

2008/12/16 11:35:03
id:goodvn No.2

goodvn回答回数228ベストアンサー獲得回数182008/12/16 11:49:48

ポイント25pt

最近は,PC もネットの速度も速いのであまり気にならないかもしれませんが,遅い PC や遅い回線を使っていると,画像の読み込みに時間が掛かる場合があります

画像を読み込むまでサイズが分からないと,ブラウザはレンダリングができません.一旦仮のサイズでレンダリングするのですが,画像のサイズが判明すると,再度レイアウトを修正し,レンダリングをやり直します

ただでさえ遅いのに,何度もレンダリングしてては,さらに遅くなってしまいます

テーブルや CSS などでレイアウトが決められていなくて,画像サイズが指定されていない,かつ遅いサーバにアクセスすると,必要性を実感できるかもしれません(良い例は見つかりませんでした)

id:Rustic

ありがとうございます。

ISDN時代ではとても大切なことなのかもしれませんね。

ではブロードバンドが普及して、PCの性能も上がっている現在ではどうなのでしょうか。

2008/12/16 11:55:11
id:hijk05 No.3

hijk05回答回数1307ベストアンサー獲得回数232008/12/16 13:17:28

ポイント2pt

>画像が無かったときにサイズを保持した枠が表示されたとしても、

>そこにどんなメリットがあるのかわかりません。

>無いならわざわざ枠を表示させなくても良いと思います。

画像がなかったときにレイアウトが崩れないようにするため。

id:Rustic

ありがとうございます

2008/12/16 13:46:48
id:pahoo No.4

pahoo回答回数5960ベストアンサー獲得回数6332008/12/16 14:03:21ここでベストアンサー

ポイント25pt

画像が無かったときにサイズを保持した枠が表示されたとしても

width, height 属性で指定された分だけ余白となるので、レイアウトを保持できます。

また、ブラウザで「画像を表示しない」と設定している人(例:モバイルでアクセスしている場合)もいるので、この場合にも有効です。


ではブロードバンドが普及して、PCの性能も上がっている現在ではどうなのでしょうか

1ページが非常に長く、多数の画像と文章が混在している写真ブログの場合、ブロードバンドでPCの性能が高くなったとしても、レンダリングに時間がかかります。


個人的には、最初に述べたように、モバイルでアクセスしてくるユーザーが増えているため、width, height 属性は指定すべきだと考えています。

id:Rustic

ありがとうございます。

たしかにモバイルサイトの場合画像サイズを指定してないとロード中にがたがたすることがありますね。

また、非常に長いブログについてはたしかに表示に時間がかかってますね。

私の意見のですが、モバイルサイトについてはロード中のがたがたはさほど気にならないように思えます。

2008/12/16 14:30:33
id:b-wind No.5

b-wind回答回数3344ベストアンサー獲得回数4402008/12/16 14:06:41

ポイント25pt

ではブロードバンドが普及して、PCの性能も上がっている現在ではどうなのでしょうか。

回線が高速化したおかげで余計にブラウザのレンダリングのコストが浮き彫りになりつつある。

簡素なページではたいした差はないけれど、Ajax 等を多用した環境ではHTML自体が動的に変わっていくので、

余計なレンダリングは少ないに越したことはない。


まぁある程度の数の画像がなければ体感は出来ないでしょうけどね。

id:Rustic

ありがとうございます。

AJAXは今回の質問と関係ありませんが、ロード時間については確かに気になりますね。

画像についてはやはり一定の数がある場合にレンダリングの問題が出てきそうですね

2008/12/16 14:32:38
  • id:infograve
    「HTMLの仕様だから」という答えなんでこちらに。

    W3CのHTML勧告に書いてありますが、
    imgエレメントにwidth、height属性を指定されている場合、ブラウザはその値を元に画面レイアウトを作成できるため、
    レイアウトと読み込みを同時進行させることができ、画面表示完了までの時間が短縮できます。
  • id:iketerummo
    時間短縮や表示完了までにレイアウトが崩れることがあたのですが、最近のブラウザでは大丈夫なのかな?当方のIE6環境では未だ現象が出ています。

    メリットと言えるかどうかわかりませんが、画像を縮小サイズで指定表示しておきクリックなどで元サイズを表示する場合、読み込み済みなので表示が速いです。他にも代替案はいっぱいありますけどね(汗)
  • id:Rustic
    >infograve 様
    書き込みありがとうございます。
    大量に画像がある場合はサイズ指定は有効な手段ということですかね・・・?<すみません想像です。

    >iketerummo 様
    書き込みありがとうございます。
    見出しやボタンに画像を使っていると確かにレイアウトが崩れることがありますね。
    そういった画像にはサイズ指定は重要かもしれませんね。
  • id:kn1967
    回線が太くなったとはいっても、それだけを見ているとダメでしょう。

    例えば、商品サムネイルが50点も100点も表示するような
    ショッピングサイトなどを思い浮かべてみてください。

    サイズ指定無しのものを
    現在でも多く使われている2~3年前のパソコンで見たり
    最新高性能パソコンでも回線が渋滞するような時間帯に見たりすると
    何度も書き直しが行われてイライラしたりもしますよ。
    (そもそも、そういう造りのページは
    はっきり言ってウザイから次からは見なくなるけどね)


  • id:goodvn
    今でも,街中で公衆無線LANを使う,PHS でダイヤルアップする,などアクセス回線が ISDN より遅い事はよくありますし,サーバ側や途中のネットワークが遅ければ,アクセス回線が光ファイバであっても意味がありません

    携帯電話などは,まだ端末などがそれほど速いわけではないので,顕著に現れるでしょう(読み込み中ブラウザから反応がなくなり,ぱらぱらとレイアウトが変わっていくサイトを見たことありませんか?)
  • id:Rustic
    >kn1967様
    書き込みありがとうございます。
    >現在でも多く使われている2~3年前のパソコンで見たり
    ブラウジングで使われているのはやはりこのあたりのPCなんでしょうね。
    そう考えるとサイズ設定は重要なのかもしれませんね。

    >goodvn様
    ありがとうございます。
    モバイル端末などは考えていませんでした。たしかにケータイサイトではよく見かけます。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません