• ベストアンサー

プロのWeb製作者さんよろしくお願いします。

tsucuの回答

  • tsucu
  • ベストアンサー率62% (71/113)
回答No.1

>PSDファイルの保存でテキストをホームページ制作ソフトで >編集が出来るように保存したいと思っています。 直接的な回答をすると、PhotoshopでスライスをCtrl+ダブルクリックして スライスの種類のプルダウンメニューで画像なしを選び、テキストを入力します。 これでHTMLでテキスト編集可能な状態で書き出せると思います。 しかし、これでは根本的な解決にならないと思います。 なぜなら、フォントの種類や大きさを定義できないからです。 >ホームページ制作ソフトで、PSDファイルからHTMLと画像だけを保存しテキストをCSSで でk_berryさんが行っていることと、たいして変わらないと思います。 結局フォント定義をCSS等で行わないといけないからです。 PhotoshopはWeb製作の万能ツールではありません。 すべてをPhotoshopでやることには無理があります。 通常、プロはPhotohopのみで完結するような作り方をしません。 PhotohopのHTMLの書き出しはオマケだと考えてます。 完全にテーブル組みをするパーツでは使えますが、 テキストなどの変動要素(閲覧ユーザがフォントの大きさを変更したりできる)を中に入れることはしません。デザインが崩れるのは当然です。 ボックス要素にバックグランドで画像を使い、テキストをのせる方がまだマシでしょう。それでも、当然テキストのフォントサイズを大きくするとバックグランドからはみ出したりするのはWEBの宿命です。 そういった変動要素をどのように処理するかは、その時々のノウハウになり、一概に説明しきれないと思います。もっとピンポイントで具体的な題材を示してくれる方が答えやすいと思います。 最後に、一番無難なのはテキストを画像にすることだと思います。

k_berry
質問者

補足

tsucu さん回答ありがとうございます。 下記について >ボックス要素にバックグランドで画像を使い、テキストをのせる方が >まだマシでしょう。それでも、当然テキストのフォントサイズを大き >くするとバックグランドからはみ出したりするのはWEBの宿命です。 確かにテンプレートのPSDファイルを見てみるとバックグラウン ドで画像を指定し、その上にテキストが表示されています。 しかし、CSSで表示されています。確かにサイズ変更を行うとデ ザインが崩れます。通常では、CSSを使うと文字サイズや位置が 指定できデザインが崩れるような事はないように思いますが、こ れは、上記のボックス要素をPhotoshopで指定できるという事で しょうか。 その場合、ボックス要素とはどのように指定すればよろしいでし ょうか。 また、どのようにお伝え致していいか難しいのですが、PSDでWe bを制作している方は、そこまで時間が掛かる設定を行っている のでしょうか。テンプレートのPSDファイルとHTMLを見るとCSSで テキストを指定していました。 多数のものを見てみましたがPSDテンプレートのデザインとテキ ストは同じ位置に配置されています。どのようにやっているの でしょうか。 上記のような場合、PSDファイルそのものでテキストや画像を別 々にひとつのHTMLとして保存できるようにする事が出来るのでし ょうか。 例えばPSDファイルの画像であれば画像として、テキストはCSS やHTMLタグのDivなど。 多数のPSDテンプレートを見ていると何らかの同一方法でHTML化 しているように思えてならないのですが。

関連するQ&A

  • PhotoshopでWEB用に保存をすると

    WinXPでPhotoshop7を使っています。 psdファイルから画像を切り出して、WEB用に保存をすると(形式GIFにして)、保存時に出てくる窓のファイルの種類という欄が「htmlと画像」になってしまいます。 他のpsdを同じ操作すると「画像のみ」ですんなりGIF保存出来るのですが、今扱っているpsdは毎回そこを「画像のみ」に直さないと保存出来ないんです。これはpsdに何かの違いがあるのでしょうか。 どうすれば保存時に常に「画像のみ」に出来るでしょうか。

  • Photoshopテキストが編集可能なフリーソフト

    Photoshopで作成したテキスト(PSDファイル)をフリーソフトで開いて編集しようとすると、テキストレイヤーではなく、画像レイヤーとして読み込まれます。 有名どころのフリーソフト(GIMP,PaintNETなど)はほとんど試してみましたが、すべて画像レイヤーとして認識されるので、イチから作りなおす必要があります。 私の調査不足かもしれませんが、PSDファイルが開ける画像編集フリーソフトで、かつPSDテキストを認識して編集できるソフトを知っている方おられましたら教えてください。

  • ホームページにデジカメの画像が表示されません

    simpleテキストにHTMLを書き込んで、ホームページを勉強してます。デジカメで撮ったものを、photoshopでwebように、保存して○○○jpegのファイル形式で、テキストにも<img src="○○○.jpg">と書き込んで、同じフォルダーの中に入れておき、アップロードする時も最初のファイルは、index.htmlというプロバイダーの指示に、従っってます。画像以外は、ちゃんと、ネット上で見られます。接続しなければ、画像は表示されます。どうしたら、自分で写した画像がネットでみられるのでしょうか?デジカメでそのままのファイルをのせても、photoshopでwebように保存してもだめです。初心者です。よろしくお願いします。

    • ベストアンサー
    • Mac
  • ダウンロードしたテンプレートの編集

    ホームページを作りたいと考えています。 Htmlやウェブについては、初心者です。 海外のサイトからテンプレートをダウンロードしてみたところ、 下記4つの項目がありました。 ・images ・index(HTML Document) ・PSD ファイル ・Style (カスケードスタイルシートドキュメント) PSDファイルはphotoshopで開けました。 Photoshopはある程度は使えるので、画像としての編集はできそうです。 ただ、ウェブにアップするには、dreamweaverが必要ですよね、そちらのソフトに関する知識がありません。 このファイルからホームページビルダーで作成することは、可能でしょうか? もし可能であれば、その具体的な方法を教えて下さい。 NGの場合、ホームページビルダーで作成可能なテンプレートである旨を、 どうやって判断したらよいのか教えて下さい。 アドバイスよろしくお願いいたします。

  • photoshopと、ホームページ作成について勉強しています。

    photoshopと、ホームページ作成について勉強しています。 たとえば、お客様からデザインをPSDなどの画像ファイルで頂いた場合です。 デザインからHTML、CSSなどを作りこむことになると思うのですが、 その場合はやはりデザインを見ながら横幅、高さなどのサイズを調べて作りこんでいくのでしょうか? それとも、photoshopの中に土台となるHTMLを作りこむ機能のようなものがあるのでしょうか? 私は、PSDファイルを見ながらガイド機能を使って部品の幅や高さを調べながら、 必要な画像部品をファイル内から抽出しつつ…といった感じでホームページを作っています。 web関係の勉強をしている皆さんのご意見をお聞かせください。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • MACでWEB保存できません!

    PHOTOSHOP CSで編集した画像をWEB用に保存したいのですが薄い文字で表示されていて選択出来ません。 psd形式の画像1ページをスライスしたモノをJPEGで保存したいのですが。。。 サポートを使えないので困っています。 なにか解決法がありましたら宜しく御願いします、、、!!

    • ベストアンサー
    • Mac
  • Photoshopとブラウザの色の違いについて

    PhotoshopでデザインしたPSDファイルの赤色(6桁コードを覚えていません。。。)がブラウザで見ると朱色っぽく表示されてしまいます。画像ファイルの保存方法は「WEB用に保存」でスライスを切り出しているのですが、はじめてのこういった状況になりました。 上記の解決方法ってありますでしょうか?回避策などあればおしえてください。 【制作環境】 Mac OSX Photoshop CS4

  • Photoshopで保存したepsファイルをpsdに元に戻す方法

    自主制作のCDをプレス会社に依頼しようと、ジャケットも自主作成しています。独学でPhotoshopとIllustratorを勉強しているので素人です。 プレス会社の入稿規定などを見ながら作成していました。 規定の中で「Photoshopで作成したファイルはepsで保存してください。」とあったので、その通り保存しました。 画像完成後に訂正箇所があり、ファイルを開くとレイヤーがないではないですか!!!もうがっかりです。編集途中のファイルも、もうありません。 少し調べましたが、psdからepsとはエンコード(?)して保存しているのですよね?作成しなおすのは気が遠くなりそうです。 psd形式に戻して、Photoshopで編集したいのですが、不可能でしょうか。 誰か助けて下さい。

  • フォトショップで『Web用に保存』ができない!!

    Adobe Photoshop Elements6.0で、OSはMac OS X(バージョンは10.6.2)です。 画像を保存しようと、 ファイル>Web用に保存 をクリックしても、何もおきません。というか選択している画像が非選択の状態になるだけで、ダイアログボックスもエラーも出てきません。 文字の色は黒です。ちゃんとクリックしているんですが、JPGでもGIFでもPSDでも結果は同じでした。 ちなみに、『保存』『別名で保存』はボックスが表示されるので、普通にファイルを保存するのは問題ありあせん。 どうすればWeb用に保存ができるのでしょうか?使い始めたばかりで理由がさっぱり分かりません…よろしくお願い致します。

  • Photoshop感覚でWeb制作出来るソフトありますか?

    はじめまして。 小さなデザイン事務所でPhotoshopを使って仕事をしております。 この度、Web制作未経験の私が事務所のホームページを制作を任されてしまいました。 とにかくまず形をと思い、手に入ったホームページビルダー10の「どこでも配置モード」で制作してみました。 Photoshopに感覚が近く無事に出来たと思ったのですが、ブラウザの違いなのかモニタ設定の違いなのかパソコンによって表示が重なったり左に寄ったりしてしまいました。 そのような事のないようにその後スタイルシートを使用してみたのですが、日頃Photoshopでレイヤを動かしたり重ねたりしているものですから兎に角、痒い所に手が届かないと言いますか、Photoshopなら何でもない事が思うように出来ずじれったいのです。 TOPページの原稿は社長がデザインしたものをその通りに作らなければなりません。 シンプルなデザインですが背景画像の上に文字が重なったり、画像がパズルのように並んだりしています。 Web制作がそういうものではない事は分かっているのですが、未経験で全てを任され非常に困っております。 Photoshopのレイヤ感覚で制作出来るオススメのソフトがありましたらどうぞアドバイス宜しくお願い致します。

    • ベストアンサー
    • CSS