【急募】縦長の画像を保存すると縮小されてしまう問題

質問

縦長の画像を保存すると、添付させていただいた画像のように、縮小されてしまいます。
縦長の画像をWEBで使いたいのですが、解決策を教えてください！お願いします。

回答No.6

chigaitakanoha

たびたび、No1＆No.5です。

オリジナル画像のリンクをクリックするとサムネイル画像のページヘリダイレクトされてしまうので、右クリックで「リンクのURLをコピー」してタグの方へ貼り付けてくださいね。

出来ましたか？出来ない場合はその画像アップロード先の仕様です。残念ながら。
いわゆる「直リンク禁止」なんでしょう。

基本的にウェブサイト内に画像を貼り付ける際は、HTMLファイルと同じトコロに画像ファイルもアップして指定するものです。
外部のサーバーにアップされた画像へイメージタグで直接リンクを貼って表示させるのは、直リンクと言ってあまり歓迎される行為ではありません。そっちのサーバーに負担がかかりますからね。

どのようなページを制作されてるのかわかりませんが、出来れば自分のトコロに画像ファイルもアップして貼り付けた方がいいですよ。

ただ、No.4さんのおっしゃる通り、あの巨大な画像を使うことがちょっと意味不明です。
通常ウェブページならば、画像とテキストをレイアウトしてあの画像のように表示させるものだと思います。
もしくはPDF形式とかでDL出来るようにされたほうが、見る側にも親切だと思うのですが。。。

回答No.5

chigaitakanoha

イメージタグの指定が間違ってません？

今指定されてるのは、縮小されたいわゆるサムネイル的な画像です。

オリジナルの画像はこっち。
http://i103.photobucket.com/albums/m154/yuichiro8/2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png~original

回答No.4

iapetus

No.2です。

ソースは「width="768" height="7367"」となっていますから、オリジナルの画像データは、相当大きい、というか、縦方向に画面の何ページ分ものサイズがあるんじゃないでしょうか？。
しかし、サーバ上の画像ファイルは、横106ピクセル×縦1024ピクセル しかありません。
それを、768×7367の領域に表示しているのですから、この場合、ボヤけてしまうのは当然です。

しかし、そんな風に画像を縮小した覚えはないのですよね？。
だとすれば、Webサイトのアップロード先の、画像ファイルのアップロードのルールや制限に、引っ掛かって勝手に縮小されている可能性が高いと思います。
どういうことかというと、表示領域の768×7367ピクセルはそのままに、ファイルだけがWebサーバのアップロードを受け入れるシステムに、勝手にサイズを縮小されている、ということではないかと。
これは、pngという軽い画像形式であるが故に、「相当巨大」ですし、極端に「縦に長い」です。
もし、今お使いのWebサービスが画像ファイルサイズか、縦横ピクセルのドット数の制限を超えると、勝手に縮小する、というルールがあったとして、それに引っ掛かっている可能性があると思います。

知人の利用しているWebサービスでは、画像1ファイルの最大サイズは5MByteという制限があり、これを超えるとアップロードできないというルールです。
当該のpngファイルが勝手に縮小されている状態だと仮定して、104KByteありますが、単純に逆算してオリジナルは、
　　768×7367÷(106×1024)×104KByte=5421KByte=5.421MByte
そのくらいあるのではないでしょうか。

今でこそ、インターネット回線がこれ程までに高速化された時代になって大きな画像ファイルは「重たい」データでは無くなりつつあるのでしょうけど、回線が遅かった時代では、巨大な画像をWebページに載せることは、ネチケットに（ネット・エチケット）反するとされていて、アップロードさせてくれなかったりしたものです。
また、縦に長いファイルを表示するのも、昔の貧弱なパソコンには荷が重かったと思いますから、未だに禁則とされているかもしれません。
そういった制限が無いかどうか、Webサーバの運営元の規約や禁則事項を確認してみてはどうでしょう。

蛇足ですが、疑問なのは、そもそも、この画像ファイルはどういう趣旨で作られたもので、沢山の商品がいっぺんに並んで何故にこんなにも「縦に長い」のかということです。
文字も全て画像になっているので、検索対象にもならないのですが、それはそれで構わない、ということでしょうか。
表示のためだけだとしても、商品全部を縦に長くしていっぺんに画像にしてアップロードしなければならない必然性が、私には見えません。
この画像の表示だけが目的だとしても、通常（何をもって通常か、という意見はあるでしょうけど、）は、1商品ごとに画像を切り取って、それに商品名や解説をテキストで付け加え、作り込んでやるのが普通のやり方では？という感じがします。
それなら、勝手に縮小される、ということもないと思います。

回答No.3

enunokokoro

[ Windows フォトビューアー]は、初期設定で[ウィンドウに合わせる]
ようになっています。

画像サイズに合わせるなら[ Ctrl+Alt+0 ]キーを押すか、虫眼鏡の形の
ボタン横にある（下にある右から2番目の）ボタンを押します。
（[実際のサイズ]と[ウィンドウに合わせる]の切り替えをするボタン）

補足

画像を使ってのご回答有難うございます。そこまでは理解しているのですが、最終目標であるウェブサイトにアップするときに、今の保存方法では、私がアップした画像のサイズのまま表示されてしまうようです。
下記のタグを利用しているのですが、サイズ指定をすると今度はぼやけてしまいます。
今日一日やっても解決しませんでした。お手数ですがお力を貸していただきたいです。

<img src="http://i103.photobucket.com/albums/m154/yuichiro8/2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" border="0" alt=" photo 2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" width="768" height="7367"></a>

回答No.2

iapetus

よく拝見すると、ウィンドウのタスク名が、「Windows フォトビューアー」になっているようですが。
これ、ってNo.1さが仰るように、プレビューとして単に縮小表示されているだけだと思いますが。
つまり、元のファイルには何の変更も加えられていないと思いますよ。

Paintでも何でも、ビットマップ画像の編集ソフトで開いてみるとか、そのままWindowsフォトビューアーで拡大してみれば、そのファイルが解像度変更で縮小されてるような処理が勝手にされているのではないことが判るはずです。
或いは、その作成されているというWebページに張り込んでみてみるとかでもよいです。

補足

ご回答有難うございます。フォトビューアーで保存しているため縮小表示されているだけなのは理解しているのですが、
最終目標であるウェブサイトにアップするときに、今の保存方法では、私がアップした画像のサイズのまま表示されてしまうようです。
下記のタグを利用しているのですが、サイズ指定をすると今度はぼやけてしまいます。
今日一日やっても解決しませんでした。お手数ですがお力を貸していただきたいです。よろしくお願い致します。

<img src="http://i103.photobucket.com/albums/m154/yuichiro8/2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" border="0" alt=" photo 2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" width="768" height="7367"></a>

回答No.1

chigaitakanoha

縮小？
元画像が100だとすると何％に縮小されてしまうのですか？自動的に？

ウィンドウに入りきるよう、単に縮小表示されているという事では無いんですよね？

画像を編集・保存しているアプリケーションなども記載があると解決しやすいです。

補足

ご回答有難うございます。仰る通り、入りきるように表示されているのだと思うのですが、最終目標であるウェブサイトにアップするときに、今の保存方法では、私がアップした画像のサイズのまま表示されてしまうようです。
下記のタグを利用しているのですが、サイズ指定をすると今度はぼやけてしまいます。
今日一日やっても解決しませんでした。お手数ですがお力を貸していただきたいです。よろしくお願い致します。画像編集しているのはペイントです。保存は「.png」で行い、フォトビューアーで画像を確認しております。ちなみにウィンドウズ8のVAIOを利用しております。URLを取得しているのはphotobucket.comというサイトからです。

<img src="http://i103.photobucket.com/albums/m154/yuichiro8/2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" border="0" alt=" photo 2afc4567-1112-4b8d-8f91-a3e13fbfc2d8_zpsd119e21b.png" width="768" height="7367"></a>