• 締切済み

GIFをブラウザで表示すると劣化する

Webサイトを作成するにあたりGIF画像を使用したいのですが、作成したGIFをブラウザ上で表示すると劣化してしまいます。 私がPhotoshopでWebサイト用の素材を作成し、GIFで保存した物をフォルダでひとまとめにし、これをZIP形式で圧縮、Web製作会社にメールで送っています。送る前のGIFはPhotoshopやIE6等のブラウザで開いても綺麗に表示されるのですが、Web製作会社が作成したWebサイト上で表示すると、明らかに送る前の状態より劣化しているのです。 劣化の状態というのは、例えば左から右になめらかなグラデーションをかけた画像だとすると、これが4色ぐらいの荒いグラデーションになってしまうというものです。 この件についてWeb製作会社に原因の調査をお願いしましたが、本日に至るまで原因が分かっていません。アドバイスをいただければ幸いです。

  • CSS
  • 回答数4
  • ありがとう数4

みんなの回答

  • D-JAGA
  • ベストアンサー率28% (39/139)
回答No.4

再び書き込みます。 HPの使用がさっぱり分からないので、想像の範囲になります。 グラデーションをかけた画像に関して、僕の経験を書かせてもらうと、 色数を減らしたり、jpegに変換した時に帯状になりやすい。色数の方は、ブラウザで確認されているみたいなので関係はないと思いますが、jpegの方は、もしかしたら相手に再変換されてしまっているかもしれませんね。(すでに確認済みかもしれませんが) 他に、グラデーションの帯化の可能性は、ブラウザでの表示サイズでしょうか。表示されているサイズが、作成した時に表示したサイズより小さければ、ディスプレイやボードの表示能力によっては帯状に見えてしまうのではないでしょうか? あくまで推測ですし、かなり初歩的な内容なので、すでに確認済みかもしれもせんが、落とし穴という可能性も考え、書き込ませてもらいました。

kdm90000
質問者

お礼

ご回答ありがとうございます。 送ったGIFの素材をJPEGに変換してしまうというのは以前あったのですが、そうしないよう製作会社に言ったので、現在ではGIFはGIFのまま使っているようです。表示サイズも元の素材と同じですし、いくつかのパソコンから確認したのでハードの能力という線もなさそうです。 ここで回答を締め切らせていただきます。現在でも解決していませんが、そもそも製作会社側がいい加減な感じがしてなりません。なので製作会社を変えないと、こちらでどんなに的確なアドバイスをいただいても解決には至らないのかもしれないです…。

  • abril
  • ベストアンサー率69% (388/560)
回答No.3

> Web製作会社が作成したWebサイト上で表示すると、明らかに送る前の状態より劣化 「劣化」というより「TVの砂嵐状」みたいになっているわけではないでしょうか?もしも仮にそうであれば、Webサーバにアップロードする際に、画像が壊れてしまっている可能性が考えられますが。間違って画像ファイルをバイナリではなくアスキーモードでアップしたりすると、その様な状態になります。 非常に単純なミスなので、まさか、とは思うのですが…一応の可能性として考えてみました。 念の為、Web製作会社に、質問者様からの圧縮ファイルを解凍した結果のGIFファイルいくつかメールに添付して送り返してもらってはいかがでしょうか?もしそれがオリジナルと同じクオリティであったなら、劣化の原因となる様なトラブルが確実にWebサーバにアップする課程でのみ起きていると、限定する事ができるかと思います。

kdm90000
質問者

お礼

ご回答ありがとうございます。 劣化というのは、砂嵐状というよりは、例えばなめらかなグラデーションが、4本の帯状になってしまうという感じです。アップロードする際に画像が壊れるというのも単純ミスとのことですが、可能性としては十分にありそうです。 送った素材を送り返してもらう、というのも一度やってもらうとより原因が特定されそうですね。試してみようと思います。

  • GandamOO
  • ベストアンサー率37% (59/158)
回答No.2

GIF画像は、保存した後での劣化は基本的に無いはずです。 保存時に256色に減色されるでしょうが... 書かれた現象からからは、どうもパレットが合ってなさそうな気がしてしまいます。 Webページではどのように表示されているのでしょう? 他の画像とあわせているということは無いでしょうか? その際に、パレットの問題がでて、画像を張り合わせる際に、張り合わせる元の画像のパレットが使われて色がおかしくなっているということはないでしょうか? その場合、張り合わせる画像を全部、一旦フルカラーに戻して張り合わせた後にGIF化すれば、再度色が最適化されると思いますが... どうやっているのか、どのような構成でホームページを作っているのかわからないので、想像です。

kdm90000
質問者

お礼

ご回答ありがとうございます。 パレットの問題は怪しいですね。問い合わせてみます。

  • D-JAGA
  • ベストアンサー率28% (39/139)
回答No.1

送付されていデータのサイズは大丈夫でしょうか? データが大きかった場合、再圧縮されている可能性があると思います。 また、HPの作りによっては、表示速度を上げるために、サムネイルなどに使われるデータは劣化データを使用する場合もあります。 あとは、可能性として低いですが、著作権や肖像権の問題に対応するために、細部が分からないようにわざと劣化させるという可能性もあると思います。

kdm90000
質問者

お礼

ご回答ありがとうございます。 再圧縮や表示速度を上げるための劣化データの使用というのが、Web制作者の手動によるものか、あちらさんの使っているオーサリングソフトの設定によるものかが鍵のような気もします…。

関連するQ&A

  • ブラウザ上で画像が綺麗に表示されません

    サイトに公開するためのイラストをphotoshopで作成して、jpeg画像に変換後、ブラウザ上で見てみたところ、画像の一部分が、gif画像に変換したときのようなモワレが生じてしまいました。変換の際に何か間違ったのかと思ったのですが、ブラウザを介さずに、画像を直接見ると、問題なく綺麗でした。何故かブラウザ上で見ると、画像が綺麗に表示されないようです。IEとNNで試してみましたが結果は同じでした。 画像の全てが均一に画質が落ちるのではなく、一部分だけがモワレのような表示になってしまうので、原因がよくわかりません。今までにも何度かjpeg画像は作成しましたが、今回のようなことはありませんでした。モワレが生じている部分は、今回初めてphotoshopのフィルタのぼかし機能を使ってるのですが、他の部分でもぼかし機能は使っているので、これが原因とも考えにくいです。 何かおわかりの方がいらっしゃいましたら、アドバイス頂ければ幸いです。

  • 静止Gifに動画gifを挿入してwebで表示するには?

    Illustrator又はPhotoshopで作成した静止gif画像に、フリーソフトで入手した動画gifをはめて、webで表示したいのですが、html表示しても動きません。どうすればいいのでしょうか?

  • gifアニメの画質の劣化について

    こんにちは。 仕事でバナーを作っている初心者です。 photoshopとimagereadyでgifアニメを作成したのですが、画質が劣化して汚くなってしまいます。 なんとか画質を劣化させず、きれいなgifアニメを作る方法はありませんでしょうか。 もしimagereadyでは不可能な場合、他のアプリケーションであれば出来る、といった事はありますか。 他に持っているものはflashとfireworksがあります。 どうぞ宜しくご教授ください。お願い致します。

  • GIFについて

    知人が制作したウェブサイトを一部修正(画像ファイルの差替)することにしました。 Photoshopで画像を作り「WEBデバイス用に保存」から、GIFファイルを作りました。ところが、知人からもらったデータ画像のGIFファイルと、マーク(アイコン?)が違います。 ファイルの詳細(一般情報)を見ると「Adobe Photoshop GIFファイル」となっておりました。単なる「GIFイメージ」とは違うのでしょうか?また、単なる「GIFイメージ」に するにはどうすればよいのでしょうか? また、Webサイトのディレクトリーの中に、この2種類のGIFファイルが混在していると問題があるのでしょうか? どうぞご教授ください。よろしくお願いいたします。

  • gif画像でたまに背景がグレーになってしまいます。

    はじめまして。 現在、ホームページの画像を作成しています。 photoshopで作成しているのですが、「web用に保存」でgifでしたところ、背景に色がついてしまうときがあります。 ちなみに、背景に色がついてしまうときはかなり小さい範囲の背景を残した時です。 たとえば、四角の枠に画面いっぱいの角丸長方形を作成したときの角の部分などです・・・ これはphotoshop側の問題なのでしょうか? それともWEB表示上の問題なのでしょうか? また、1px単位の境界線を引いた時もカーブがかかっているとかなりギザギザに表示されるときとされないときがあります。 同じレイヤースタイルのものを文字だけ変えて画像にしたときなどにも起こるのですが、これも原因不明で困っています。 どなたか原因と解決方法に心当たりのあるかたはどうかよろしくお願致します。

  • Photoshop Elements3でgif形式の画像の加工も保存も出来なくなってしまいました。。

    Photoshop Elements3を、Macで使っています。 初心者です。 何日かぶりに、Photoshopを使って、背景が透明の画像を作ろうとしましたら、 「web用に保存」が選べなくなっている(字が薄くなっている)し、 「別名で保存」を選択して、次にファイル形式を選ぶ選択肢の中から、 「gif形式」がきれいさっぱり無くなっていました。 (たしかもともと選べるものですよね) また、photoshopで前に作って保存してあったgif画像も、photoshop上で開けなくなっています。 (photoshopの「ファイルブラウザ」にgif画像のデータが表示されないのです。) (「ファイルを開く」からむりやり開こうとしたら、「要求された操作を完了出来ません。有効なPhotoshopドキュメントではありません」とメッセージが出て開けません。) 一体どうしちゃったのでしょうか、、 何か変なところをいじってしまったのでしょうか。 色々なところで調べてみましたが分かりません。 分かる方いらっしゃいましたら、教えてください。 よろしくお願いします。

  • Photoshopで画像をgif保存すると崩れる

    背景を透過させ、文字のみの画像をPhotoshop7.0で作成し gifで保存したものを、 ブラウザで確認すると文字がかなり崩れて表示されてしまいます。 何かの設定が悪いのでしょうか? 分かる方いらっしゃったら教えてください。 jpgではそんなことないのですが、 透過ができないので意味がありません。

  • 作成したJPG画像が、PC上とブラウザ上で見るのとでは、ブラウザの方が荒くなります。

    作成したJPG画像が、パソコン上(Win画像とFAXビューア)で見るのと ブラウザ上で見るのとでは、ブラウザの方が荒く見えます。 どうすれば、同じように表示できますでしょうか? ------------------- ファイヤーワークス4を使用して画像を作っています。 グラデーションをかけた画像(jpg形式 圧縮率100)を作成し ファイヤーワークス上、パソコン上(Win画像とFAXビューア)で グラデーションが綺麗に表示されていることを確認し その画像をホームページにアップしたところ、 グラデーションが荒く表示されてしまいました。 ブラウザ上でも綺麗に表示させたいのですが 何か良い方法はありませんでしょうか? 試しにこの画像をFlashに作り変えて ブラウザで表示してみたところ、綺麗に表示されました。 でも、できればこのような方法でなく jpgで綺麗に表示させたいと思っています。 アドバイスよろしくお願いします。

    • 締切済み
    • CSS
  • ブラウザによるFlash表示の違い

    初心者なのでよろしくお願いします 現在ホームページを製作中です flashバナーを製作し、flash未対応のブラウザ向けに、gifアニメーションバナーも見れるようにしました IEでみるとFlashで表示されるのですが、firefoxやchromeでみるとgifになります どうしてでしょうか? お助けください ちなみにサイトは http://www.koshihikari-fukui.com/ です

  • 編集できないgif画像

    編集できないgif画像 仕事用でデザイナーさんに作っていただいたgif画像がいくつかあり、私のサイトのリニューアルに伴ってそれらを使用したのですが、その中の2個のgif画像だけがブラウザによって表示されたり、されなかったりということが起こりました。 そこでタグが間違っているのかと思い、できるところまで修正したり、もともとgif形式だったものをjpegにしてしまったものを元に戻したりしたところ、私のPC(Mac OSX バージョン10,4,11 ブラウザはSafari)でも表示されなくなってしまいました。 そこでその2個のgif画像をSeashoreという画像処理ソフトで開けてみたら、本来はカラーのイラストなのに、なぜかグレーと黒になっていて何も編集できない状態でした。 デザイナーさんからいただいた他のgif画像はちゃんとソフトでも開けられますし、編集もできて、サイトにも表示されています。 ですから、ブラウザによって表示されたりされなかったりするのは、タグの問題ではなく、もともとのgif画像の問題かな?と思っています。 本当はデザイナーさんに連絡を取りたいところなのですが、今日は土曜日でお休みなので、週明けまでは聞くことができません。 ちょっとでも早く直したいので、詳しい方のお力をお借りしたいです。 このように編集できないgif画像ってあるものなのでしょうか? また、これを使えるようにするにはどうすればいいのでしょうか? よろしくお願いします! ※今、画像をここに添付しようとしたら、エンコードができませんでした。

専門家に質問してみよう