• ベストアンサー

photoshop cs3で web用の半透明画像を作りたい

web用の半透明画像を作りたいのですが、方法がわかりません。 具体的には、ただの塗りつぶした薄いグレーの長方形(少しテクスチャーを加えてあります)が半透明になってくれればよいのですが・・・。それをボックスの背景画像に使って、その下の背景が透けて見えるようにしたいのです。 しかし、透明度を半分にしてから「web用に保存」で保存しようとすると、gifでもpngでも透明にならないか、あるいはテクスチャーが非常に粗くつぶつぶ状になってしまいます。 方法をご存知の方、ぜひ教えてください! よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • sandenn
  • ベストアンサー率67% (311/459)
回答No.2

png24で保存してください。 ただし古いブラウザは半透明に対応していませんし、Internet Explorerでは6でもちょっと対策が必要です。 この辺参考に http://cat.therese.name/index.php?categ=3&id=1138395537

cottonfeel
質問者

お礼

これは・・・普通できそうにないことができるという!?ことでしょうか?! 対応していない、ときにどう見えるのかちょっと不安ですが、IE6以下を使っている人にはあまりおめにかからないですし、但し書きをすることにして、まずはチャレンジします。 ありがとうございます。朝から元気でました。

cottonfeel
質問者

補足

「必要に応じてiepngfix.htcファイル内のパスを合わせる。」 というのがわけがわかりませんが、「パス」というのよく耳にしますし、調べれば多分克服できるはず。がんばります。

その他の回答 (2)

  • taikon3
  • ベストアンサー率22% (803/3613)
回答No.3

CS3が半透明を表現できないのでわなく、ブラウザが半透明を表現できないのです、その点をお間違えなく。 だからWeb用に保存では自動的に半透明にはならなくて、透明か不透明にしかなりません。 かといって別名保存で半透明にしてもブラウザで表現できないから一緒なんですけどね(^_^; □■□■□■ ■□■□■□ □■□■□■ このような透明、不透明のパターンをピクセル単位で作った物を背景とすれば、見た目上は半透明の効果があるように見せる事は可能です(ブラウザで半透明に見えます)

cottonfeel
質問者

お礼

あ、そうですよね。紙の上では普通に透けさせますし、ブラウザの問題ですよね。IEの問題でした。 仕事で使うようになり、とはいってもそれでご飯を食べているわけではないので今みようみまねなのですが、とにかく楽しい。奥が深くてとてもついていけていませんが、楽しいです。ご指摘ありがとうございました。

  • cubetaro
  • ベストアンサー率24% (1290/5172)
回答No.1

 半透明はおそらくムリかと思います。  基本は不透明か完全に透明なので、中間の設定は出来ません。  背景に重なる色が単色であれば、同じ色をブレンドして、擬似的に表現するコトは可能です。  レイヤーで画像を半透明にして、WEBで保存。  マット色の所で、重なるであろう背景と同じ色を指定してあげれば、背景とブレンドした画像を作るコトが出来ます。  それ以上のコトをしたければFLASHがオススメです。FLASH上でなら、半透明も扱えます。

cottonfeel
質問者

お礼

おはようございます。回答ありがとうございます。そうかーcs3にもできないことがまだまだあるんですね。いろんなことができるのに、なんだか不思議ですが、需要がないんでしょうか。 サイトはまた別のデザインを考えることにします。ご指摘どおり、背景が単色じゃないんです・・・ 調べてもわからなかった理由もわかり(できない、ということが)とにかくスッキリしました。ありがとうございました。 

関連するQ&A

  • 画像透過について

    透過した写真の画像をpngファイルで保存したのですが、ウェブにアップするとグレーっぽい色の背景がついてしまいます。gifファイルで保存する以外はウェブでは背景がついてしまうのでしょうか?

  • IllustratorでのWEB用保存がうまくいきません

    Illustrator10.0(9.0でも)でホームページに使用する画像を作っています。(写真も含みます) 画像全体をWEB用で保存して、その画像をホームページビルダーで 取り込もうと思っており「WEB用に保存」で保存をかけました。 写真もあるので、形式は「PNG-24」にしました。 背景は透過されて保存されているハズなのですが(透明部分にチェックは入れてあります) 実際にホームページビルダーで画像を挿入すると、透過されている ハズの背景が透過されず薄いグレーのような背景になってしまいます。 「PNG-8」にすればきちんと透過され、ホームページビルダーでの 背景(壁紙)がきちんと見えます。 ただ、PNG-8にしてしまうと画像全体が荒く写真などザラザラです。 PNG-24で保存した画像をホームページビルダーで透過させて表示 させるにはどのようにしたら良いでしょうか? HPには背景を使いたいです。

  • Photoshopで画像を開くことが出来ない。

    OS:Windows Vista HomePremium 32bit SP1 Photoshop CS3 EXTENDED 10.0 という環境なのですが、PNG形式とGIF形式の画像を開こうとすると 「要求され操作を完了できません。ドキュメントの種類が適切ではありません。」というエラーダイアログが出て、画像を開くことができません。 あと、PNG形式で保存することもできません。 PNG形式で保存するには「Web用に保存」を押す必要があるらしいですが、 文字が灰色で押すことが出来ません。 何か解決法はありますか?よろしくお願いします。

  • 背景が透明な画像をwebサイトに貼り付けたい

    Photoshopでpng形式、gif形式どちらでも背景を透明にしたのですが、いざ制作中のwebサイトに貼り付けると、不要な背景部分がグレーとなって表示されてしまいます。wordpressでサイトを構築中です。 どなたか、考えられそうな原因をご存知の方がいらっしゃいましたらどうかよろしくお願いいたします。

    • 締切済み
    • CSS
  • まったくの初心者です(..)・・・・。

    はじめまして、今ホームページ用に貼りつけるアイコンやバナーなどの作成を考えているのですが。まったくのど素人で・・・。まだまだわからないことだらけです。(^^ゞ どうやってホームページ用の素材を作っていいかもわかりません。それで最近初めてillustror9.0を買ったばかりでまたく使い方が理解できていないのですがWeb用に作った画像を保存するのにPNG形式での保存で透明部分をオンにしてマットをなしに設定したのですが背景にグレーの枠がどうしても付きます。背景を透明に保存したいのですがどうすればいいのでしょうか? GIFでの保存も考えたのですが背景が透明になってはいても画像がそうしても綺麗に保存されません。どうすれば 綺麗な画像を作れるのでしょうか?それとPNG形式での 保存でグレーの枠がつくのはどうしてなのでしょうか? 教えてください。お願いします。長くてすみません。(__)

  • Photo Shop6.0でPNG-24の透過画像を作りたい

    OS windows2000 Photo Shop 6.0 で 画像をweb用に保存するとき、 PNG-24のインターレース画像を作りたいのですが、 この設定で画像を保存して、webに表示した時、透過部分がグレー色になって透過されません。 PNG-8とGIF画像は問題なく透過画像になるのですが、PNG-24はうまくいきません。 ご教授ください。

  • イラストレータ8でWEB用に保存する方法

    アドビイラストレーター8.0で作成した画像を、WEB用に保存したいのですが「WEB用に保存する」がないので、GIFで保存しようと試みました(背景を透明にしたい為)。 GIFで保存する方法がひとつしかなかったのですが、 (これです→)「書き出し」→「GIF」にするとWEB上にUPした時に画質が落ちてガビガビになってしまいます。 独学で、色々調べてもやり方が分かりません。 背景を透明にするWEB用の保存方法を教えていただきたいです。

  • イラストレータCS4 webへの画像UP方法

    全くの初心者で、イラストレータ CS4を四苦八苦しながら作業している者です。 素材集から素材をいくつか使用し、また写真を貼り付け、バナーを作成したのですが、 WEB上にアップロード作業をすると、うまく反映がされません。 作成した画像は「WEB用に保存」→gifでファイルの種類は「画像のみ(*gif)」にして保存しました。 この方法は何か間違っているのでしょうか? ドリームウィーバーで見ればうまく画像は見えたのですが、 実際WEBにUPすると反映がされません。 素材や画像を使用して保存するときは、何か別の保存方法があるのでしょうか? ひと手間加えないといけないのでしょうか・・・? 初心者ですので詳しく教えて頂けたらありがたいです。 よろしくお願い致します。

  • iMovie pngの画像の透明部分が真っ黒になる

    iMovieのpngの画像の読み込み方についての質問です。 iMovieにPhotoshopで背景を透明にした画像を読み込みたいと思い、 pngで保存し読み込んだところ、透明にした部分が真っ黒になって表示されました。 pngの画像は、Photoshopで「Web用およびデバイス用に保存」でPNG-24、透明部分にチェックを入れて保存しました。 どのような方法で保存すれば、背景が真っ黒にならずに画像を読み込むことができるのでしょうか? iMovieは10.0.3、PhotoshopはCS5を使用しています。 よろしくお願い致します。

    • 締切済み
    • Mac
  • webの色。画像の色

    bgcolor="#330066"のセル上にロゴマークを貼り付けました。 ウェブブラウザ上で確認すると、ロゴマーク画像の背景色とセルの色が違っています。 ロゴ.gifをフォトショップで開き、スポイトで背景色を抽出すると#330066になっております。 jpgで保存しても同じです。 gifの背景を透明にするとロゴの周囲が白くなってしまいます。 ぼかしで解決しようとしましたが失敗でした。 何か巧い方法はないでしょうか? よろしくお願いいたします。

専門家に質問してみよう