今DREAMWEAVER4でホームページを作っています。
ホームページに貼り付ける写真の画像とかって、どれくらいの大きさ(重さ、解像度)にすればいいのですか?画像はPhotoshop5.5で加工する予定です。
あと、動画とかも普通に貼り付けれるんですか?

このQ&Aに関連する最新のQ&A

A 回答 (6件)

 最近ブロードバンドやCATVでインターネットしている人が増えているんでしょうけれど、アナログモデムで通信している人だっている筈です(ちなみに私はISDNです)から、訪問者が「この画像が見たい」という行動を起こしていないのに大容量の画像ファイルを見せるというのは、訪問者にとって歓迎されないと考えます。



 私の場合、最初のページには20%に縮小した画像を載せておき、その画像をクリックするとフルサイズの画像が表示されるようにしています(いわゆるサムネイルというやり方です)20%というと小さく感じられますが、この程度で何の画像かは大体分かるものです。縮小した画像はファイルサイズで5KB~10KB程度に収まるように圧縮率を調整します。この程度にしておけば、低速な環境でインターネットをしている訪問者にも見てもらいやすいと思います。フルサイズの画像は、訪問者が「この画像を見たい」という行動の結果表示されるものですから、多少大きくても構わないでしょう(私のとこでは50KB~100KBくらいにしてます)
    • good
    • 0
この回答へのお礼

ありがとうございます。いいアイディアですよね、参考にします。

お礼日時:2001/06/14 19:42

映画の公式ページなどでは、一枚の画像をスライスして、


画像にリンクを貼ると言う手法も増えてるように思います。
必然的に文字主体のレイアウトより、重いページになってしまいますが、
世界観などを伝えるのに効果的だなと思っています。
自分は前述の手法で、趣味のサイトを運営していますが、
indexページで120k程度です。アナログ接続の場合、約20秒位かかります。
その為、TOPページに重いindexと、テキスト主体の軽いindexのリンクを貼り、対処しています。

この辺りは、管理者と訪問者、双方の立場で考え、
折り合いを付けなければならないと思います。
画像の加工はPhotoShop5.5でされるとのコトなので、「WEB用に保存」ダイアログで下部に圧縮時の容量と、表示時間が示されますので、だいたい最大で10秒まで等、ご自身で制約をつくり、イロイロ吟味してご自分が妥協できる圧縮率をそのつど考えられるのが良いと思います。
    • good
    • 0
この回答へのお礼

PhotoShop5.5で、「Web用に保存」ってやると、いっつもフリーズしちゃうんです!!!どうしてでしょう?

お礼日時:2001/06/14 19:45

私はいまだに、アナログモデムです。

(泣)
やはり、表示に長い間待たされると「ええい、もういい!」となり、他のHPに移ってしまいますね。我慢できる時間は個人差があると思いますが。
せめて、少し待たせるので有れば、「読み込み中です…」とか、他になにか見せておくとか配慮がいると思いますね。
私もHPがありますが、ページ100kに抑えています。
私の限界?からの逆算です。
    • good
    • 0
この回答へのお礼

ありがとうございます。表示に長い間待たされるのは、わたしも嫌です!重くならないようにしたいと思います。

お礼日時:2001/06/14 19:43

画像の大きさ(サイズ)は、


ブラウザが800×600の環境で表示されている時の最適なサイズ
にしておくのがベターのようです。
(ノートパソコンとかはそれぐらいで見られているので)
というわけで、画像サイズは、そのサイズに見合うようなサイズにすると
よいでしょう。大きくて幅300くらいかなぁ。

解像度は、モニタに表示することが前提なので72dpiですね。

データ量については、なるべく軽く、が基本ですが、
意図した通りの画像にならない(汚くなる)ことがあるので
その都度調整するのが良いでしょう。

DREAMWEAVER4とのことですので、
ページデータのダウンロード時間とかを
チェックできると思います。

そのへんで、回線速度とかを調節しながら
自分なりの最適解をみつけてください。
    • good
    • 0
この回答へのお礼

ありがとうございます。重くならないように、でも汚くならないように・・・がんばります。

お礼日時:2001/06/14 19:40

写真の大きさは対象物によって違うと思います。

ページバランスの良いおおきさがありますよね。私は解像度72に設定してよく300X400ピクセル程度の写真を使います。1ページに載せる写真の枚数にもよりますが、これで3枚載せる程度におさえてます。100X100ピクセル程度の写真は解像度が40から50でも充分だと思います。一番注意することは見た目が小さいのに元画像がおおきい為ファイル容量に無駄がでることです。写真の大きさを決めてから、解像度を72に設定して、ピクセルを減らしながら画像が荒れない程度にファイル容量を小さくしていく。これで軽く仕上げて見てはいかがでしょう。がんばって。
    • good
    • 1
この回答へのお礼

ありがとうございます。がんばりまーす

お礼日時:2001/06/14 19:39

まず動画ですが、画像とまったく同じ貼り付け方です。


大きさは、当たり前ですが大きければ大きいほどメモリが重くなりますので、第三者が開いた際その画像が表示されるのが遅くなります。それにデスクトップだけでなく、画面の小さいノートを使用している人の事も考慮しないといけないでしょう。そうすればおのずと大きさは分かってくるはずです。

ちなに風景写真などでなく、普通のキャラクターや説明画像などでドーンと大きい画像があるホームページは、オシャレじゃないという私なりのイメージもあります。
    • good
    • 0
この回答へのお礼

ありがとうございます。結構個人的なページなんですが、オシャレなデザインにしたいと思ってます。

お礼日時:2001/06/14 19:38

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QWeb上での標準的な画像サイズ(容量・表示サイズ)とは

現在ASP.NETでWEBアプリケーションを作成しています。

クライアントから画像ファイルをアップロードし、アップロードされた画像は別の画面で表示されるようにしているのですが、その際、画像に対して以下の編集処理を行おうと考えています。

 1.画像のデータサイズを軽量化する
 2.画像の縦横のサイズを一定のサイズに縮小(または拡大)する。

目的は、1については、アップロード先のフォルダの容量を抑えるため、2については表示したときに一定の大きさに統一することで見た目をよくしたいため、です。
(ホームページサービスやブログなどでも、画像アップロードにて自動的に画像の表示サイズやデータサイズが自動調整されているかと思いますが、それらと同じイメージです。)


そこで質問なのですが、上記の機能を考えた場合、
Webアプリケーションの標準仕様として、

Q1.画像のデータサイズは通常どれくらいまでとすべきか(データサイズの一般的な上限は)?
→画像の圧縮率を上げる場合、画質が劣化してしまうが、どの程度までなら許容されるか?

Q.画像の縦横サイズを編集する際、どれくらいのサイズで表示するのが一般的か?(長辺短辺比は1.4くらい、とどこかで読みましたが・・・)
→できるだけ元の解像度を引き継ぎたいが、下げざるを得ない場合は、解像度の最低ラインはどれくらいとすべきか?

いろんなサイトをみてはいるのですが、見れば見るほどいろいろあって、迷ってしまいます。

画像表示に関する一般的、標準的なルールなどがあれば、ぜひお教え願います。もしくは、そのような情報が載っているサイトなどがありましたら、教えていただけるとありがたいです。

以上、よろしくお願いいたします。

現在ASP.NETでWEBアプリケーションを作成しています。

クライアントから画像ファイルをアップロードし、アップロードされた画像は別の画面で表示されるようにしているのですが、その際、画像に対して以下の編集処理を行おうと考えています。

 1.画像のデータサイズを軽量化する
 2.画像の縦横のサイズを一定のサイズに縮小(または拡大)する。

目的は、1については、アップロード先のフォルダの容量を抑えるため、2については表示したときに一定の大きさに統一することで見た目をよくしたいた...続きを読む

Aベストアンサー

どのへんに基準を合わせるかにもよります。
ナローバンドにも対応する場合、ISDNで64Kbpsですから、画像は8~16KB程度でないときついでしょうね。(複数枚一変に表示する場合はもっとサイズを落とさないといけない)
ADSL1Mに合わせれば128K~256KBくらいですかね・・・
(どちらとも理論値で1~2秒程度で表示できる)

サイズは表示するデザインと合わせればいいと思います。
最近は画面解像度が800*600以上で見ている人がほとんどなので、それ以下にしておけば問題ないでしょう。

縦横比は、元画像の同じ比で、横か縦のサイズを合わせればいいと思います。

画像表示の一般的ルールというものがないので、サイトを作るときは困ったりします。
最終的にはどこまでの人をカバーするかになると思いますが。
最近の携帯まで視野に入れると画像サイズが小さくなりますしね。

Q★ホームページに載せる写真の解像度について★

現在、ホームページを作成中です。
デジカメで撮影した写真をたくさん載せる予定なのですが、
どのくらいの解像度にすればいいのかが分かりません。
写真を並べて少し文章を付け加えて、
その写真をクリックすると拡大されるようにしたいのですが・・・
何枚も並べたページの写真は、画面では8×6CMです。
拡大した写真は、12×9CMにする予定です。

また、1ページはどのくらいの重さに抑えればいいでしょうか?

初心者なもので、簡単な質問ばかりでごめんなさい。
回答、よろしくお願いします!

Aベストアンサー

#1 です。

dpi は、Dot Per Inch の略ですね。pixsel と言う言葉は、ほぼ dot と同じ意味なので、72pixels/inchとして頂ければ良いと思います。

ホームページ作成ソフトを利用すると、大量のスタイルシートやレイヤーを生成してしまう場合が多いので、どうしてもサイズ大きくなってしまう傾向があります。
(HTMLは、)一度コツを覚えると、とても簡単なものなのですが、慣れるまではやはり難解に映るのかも知れませんね。
ページをある程度作っていけば、徐々に「ここ、どうやっているんだろう?」などと興味を持つと思います。そう言う時に、少しづつでも HTML を覚えて頂ければ良いかな。と思います。

Q【WEB制作】画像ファイルの解像度は72?96?

WEB画像を作成するとき、MacのPhotoshopで72DPIで作成していましたが、最近制作環境がWindowsに変わりました。Winの画面解像度は96DPIですが、作るものは以前のまま72DPIの設定で作成しています。
できあがったものに問題はないのですが、どうもそのへんの違いがよくわかりません。MacとWin、いったいどっちの解像度で作成するのがいいんでしょうか?
初歩的な質問ですみませんが、教えて下さい。どうぞよろしくお願いします。

Aベストアンサー

一般的にホームページ上で使用する画像の解像度は 72dpiです。仮に72dpi以上の解像度で作られていても、画面上では同じに見えますが、解像度の高い画像ファイルは容量が大きくなるので表示に時間がかかります。

モニター解像度が大きいほど、 より広いデスクトップ環境を得ることができます。ホームページなども同様で同じサイトを閲覧していても、それぞれのモニター解像度によって見え方が異なるということになります。最近のMACのモニタもWINと同じ96dpiが標準になりつつあります。

Qホームページに載せる写真のサイズについて

ホームページビルダー13を使っています。
 デジカメで撮った写真をホームページに掲載する場合、できるだけ軽くしたいと思います。
 一眼レフの高画質で撮っているため、1枚6MB あります。
 これを数キロバイト程度まで落とす方法はありますか。
 ウェブアートデザイナーで試みましたが、画質が相当ひどくなりました。
 良い方法がありましたら教えてください。

Aベストアンサー

保存形式が何かわかりませんが1枚6MBは大きすぎですね^^;
画像編集ソフトで、サイズや解像度を落とすしか方法は無いと思います。


画像データの影響を受けるのは
表示サイズに関係する
・解像度
・サイズ
が主ですが、JPEG等の圧縮形式の場合、
・使用色数
・圧縮画質(圧縮時に画質を指定できるのはJPEG等の一部のフォーマットのみ)
も影響していきます。

これらを調整していくしかありません。


まず画質をほぼ落とすことなく数KBに落とすことはまず無理です。
その位の容量で収まるものだと、サムネイル画像くらいです。

なので、一つの手としては、サムネイル画像を並べておき、
閲覧者が見たい画像をクリックすることで、
元の画像を表示させるという方法もあろうかと。




サイズを小さくする際のコツとして、中途半端な倍率にしないこと。
電子データのため、曖昧な数値というのは苦手です。これは画像サイズ等を小さくする際の丸めも一緒。
PCは2進数の機械なので
50%(2分の1)、75%(4分の3)等、分母が2の累乗になるようにすると、劣化を多少なりとも抑える事が出来ます。


他のテクニックとしては、ベクター形式で扱う画像加工を利用する方法。

ウェブアートデザイナ自体も拡大縮小はこれに類する方式なので、これで劣化が著しいというのが少々解せないのですが。

調整しようとやたらと拡大縮小を繰り返しませんでしたか?
画像データの拡大縮小は特性上、繰り返せば繰り返すほど画像劣化していきます。
なので、拡大縮小は1回で済ませてしまってください。
変更後が気に入らなければ、アンドゥを掛けてサイズを変える前に戻すようにするクセをつけたほうが良いです。

ほか、Officeが入っているのであれば、Wordで画像を拡大縮小して、それをキャプチャして保存するという荒業もあります。
(Wordなどもベクターとして画像を扱うので劣化し難い)


またHTMLタグを利用する方法が書かれていますが、これはNG。
確かにキャッシュを呼んで表示させる分には多少軽くなりますが。
通常アクセス時にはデータを丸々読み込む為、データの容量がモロに影響します。

保存形式が何かわかりませんが1枚6MBは大きすぎですね^^;
画像編集ソフトで、サイズや解像度を落とすしか方法は無いと思います。


画像データの影響を受けるのは
表示サイズに関係する
・解像度
・サイズ
が主ですが、JPEG等の圧縮形式の場合、
・使用色数
・圧縮画質(圧縮時に画質を指定できるのはJPEG等の一部のフォーマットのみ)
も影響していきます。

これらを調整していくしかありません。


まず画質をほぼ落とすことなく数KBに落とすことはまず無理です。
その位の容量で収まるものだと、サムネイル画像...続きを読む

Q1枚の画像の容量は・・・

カテゴリが違うかもしれないですが。
HP作成中です。
先日、1ページの容量は50KBほどが理想ということを知りました。
作成中のものを確認すると1ページが650KBもありました><
何とか440KBまで少なくしました。

皆さんは1枚の画像の容量はどのくらいにされているのでしょうか?
それはどのようにされているのでしょうか?
(JPEGというものに変更したりしたのですが・・・)
教えてください。よろしくお願いします。

Aベストアンサー

私はHTMLは1ページ20KB以内に抑えています。
大きな画像は使用しないので(読み込み時間を考えて)、拡張子はGIF形式で5KB以下にしています。

WEBで一番有利なのはGIFだと思います。
写真を公開するならJPEG、画質優先の写真などはPNGにしたりと、画像の内容によって拡張子を変えるのも効率がいいです。

私はデザインがよくても、読み込みが遅くては見てもらえないと考えています。

QHTMLで文字頭をそろえるには

メモ帳でHTMLを作っています。

ホームページの場合ですが、
通常だとメモ帳で文字を打ち、ブラウザで見ると左に寄せられた状態です。

いろはにほへと
123456789
ABCDEFGHIJ

これを左端に空も自分のスペースを設けて文字を打つにはどうしたらいいですか。

例えば、

****いろはにほへと
****123456789
****ABCDEFGHIJ

・・・・・・といった具合です。

Aベストアンサー

タイトルの「文字頭をそろえるには」と質問内容の「左端に・・・スペースを設けて文字を打つには」は少し話がずれています。
ここでは「左端に・・・スペースを設けて文字を打つには」について回答します。
サイト上で文字をHTMLと同じ状態で表示したいときに一番簡単なタグは「<pre>」です。
ですので、たとえば
<pre>
    いろはにほへと
    123456789
    ABCDEFGHIJ
</pre>
と書けば、左側に必要なスペースが空いて表示できます。
(ただし文字の場合だけ。)   

QPhotoshopでWeb用保存の解像度は72?

Photoshop 6 を使用しています。
Webサイト制作で使いたい写真をPhotoshopで切抜いて、「Web用に保存」する際の、途中段階で解像度は上げるべきかどうかについての質問です。
今やっている手順としては次の通りです。

(1) 自分で撮った写真をPhotoshopで開く。(解像度を確認すると72pixel/inchと表示されています。)
ピクセル寸法      幅 1600 pixel        高さ 1200 pixel
ドキュメントのサイズ  幅  56.44 cm      高さ  42.33 cm
解像度     72 pxel/inch

(2) 被写体(マグカップなど)の外周に沿って切り抜く。

(3) (1)と同じ状態の各数値のまま「別名で保存」する (Photoshop *PSD *PDD 形式で)

(4) 外周をなくす為トリミングする「イメージ」⇒「トリミング」
各データは次のように変わります。
ピクセル寸法       幅 1089 pixel       高さ 966 pixel
ドキュメントのサイズ   幅  38.42 cm       高さ 34.08 cm
解像度     72 pxel/inch

(5) つづいて、写真の大きさを実際にWebサイトのページに掲載する大きさに変えます。
  「イメージ」⇒「解像度」で「縦横比を固定」 「画像の再サンプル」にチェックを入れて
  「バイキュウービック法」(元からこれになっていた為)を選択して 、 
  ドキュメントサイズを自分で決めた大きさの幅8cmに指定します。
  8cmに変えると、各数値は次のように変わりました。
ピクセル寸法       幅  227 pixel        高さ  201 pixel
ドキュメントのサイズ   幅   8 cm           高さ   7.1 cm
解像度     72 pxel/inch

(6) (5)の状態で「Web用に保存」しました。
  形式はjpegで、きれいに見せたいので最高画質または、値の指定を100にしました。
  切抜いていますが、GIF形式ではないので透過できない為、「マット」で下地の色と同じ色を指定しました。

現在、このような流れで写真を切抜いて、Web用に保存しています。

【 質 問 】
上記(5)の段階で、「画像の再サンプル」にチェックを入れて、「解像度」の欄を350と入力すると次のようになります。
ピクセル寸法        幅 1102 pixel       高さ  978 pixel
ドキュメントのサイズ    幅 8 cm        高さ  7.1 cm
解像度     350 pxel/inch
( 350というのは、紙に印刷する際に350にしていたので72よりもきれいにする為には350かな?と思いこの値を入力しました。)

解像度は 72 pxel/inchのまま、350 pxel/inch のどちらにするのがよいでしょうか?
一般的にはこう・・・で、例外として・・・場合もある、など、教えてください。
また、これ以外に上記の流れの中で、おかしなやり方をしていたら、ご指摘ください。
よろしくお願いします。

 

Photoshop 6 を使用しています。
Webサイト制作で使いたい写真をPhotoshopで切抜いて、「Web用に保存」する際の、途中段階で解像度は上げるべきかどうかについての質問です。
今やっている手順としては次の通りです。

(1) 自分で撮った写真をPhotoshopで開く。(解像度を確認すると72pixel/inchと表示されています。)
ピクセル寸法      幅 1600 pixel        高さ 1200 pixel
ドキュメントのサイズ  幅  56.44 cm      高さ  42.33 cm
解像度    ...続きを読む

Aベストアンサー

> pixel寸法の欄にpexelの値を入力して
そうです。

> 実際の長さがわかるという理由
> 必要な写真の大きさを的確につかむ為に
初期のMacintoshではモニタ解像度も72dpiで固定されていて、72ピクセル線を書いてやるときっかり1インチ(2.54cm)になりました。
当時としてはプリンタの解像度を72dpiにすると画面上がサイズも全てそのまま印刷出来て便利。

今のモニタは解像度(dpi)はバラバラで同じ大きさで表示される事はまずありません。
同じ12インチでも800×600のもあれば、1024×768以上のもあります。
1cmとかで作ってもそれは印刷すればそのサイズにはなりますが、画面上ではそうではないです。
画面に定規を当ててみれば分かりますよ。
余程厳密に設定されたブラウザ&画像の大きさをCSS利用してcmやinchで指定でもしていない限りは、実際のサイズとは程遠い大きさになります。

ブラウザ上では原則 ピクセル寸法で表示されるから、ドキュメントサイズで指定しても意味が無いし、dpiをちょっと変えるだけで表示される大きさも大幅に違ってきます。
ですから、貴方が綺麗だろうと思っていた350dpiで、8×7.1cm(拳程度)の画像を作ると,
ブラウザ画面上では1102×978 pixelと画面いっぱいのサイズになります。
72dpiなら予想していたのに近いかもしれないけど、それでも8×7.1cmにはなりません。

ピクセル寸法で指定した方がより分かりやすいです。
Photoshop等で等倍(100%)表示した時のサイズがそのまま利用される訳ですから。


解像度が指定(固定)されている印刷関係(DTP)であれば、貴方のやり方は正しいですが、Webでは通用しません。
失礼かもしれませんが、Web作っている人は解像度(dpi)?ドキュメント寸法にcm?という人の方が多数で、貴方のようなやり方は稀でしょうね。

↓以下が参考になるかな?
解像度/同人野郎のためのWEBサイトづくり
http://rinrin.saiin.net/~aor/hms/reso

> pixel寸法の欄にpexelの値を入力して
そうです。

> 実際の長さがわかるという理由
> 必要な写真の大きさを的確につかむ為に
初期のMacintoshではモニタ解像度も72dpiで固定されていて、72ピクセル線を書いてやるときっかり1インチ(2.54cm)になりました。
当時としてはプリンタの解像度を72dpiにすると画面上がサイズも全てそのまま印刷出来て便利。

今のモニタは解像度(dpi)はバラバラで同じ大きさで表示される事はまずありません。
同じ12インチでも800×600のもあれば、1024×768以上のもあります。
1cmと...続きを読む


人気Q&Aランキング

おすすめ情報