Photoshop Elements 6を使った文字の装飾

このQ&Aのポイント
  • WEBデザインにおいて、文字の装飾は重要な要素です。しかし、HTMLやCSSだけではデフォルトやブラウザの差異により一貫した表示ができないことがあります。
  • そこで、Photoshop Elements 6を使用して文字を装飾し、画像として保存してWebサイトに表示させる方法があります。
  • しかし、Photoshop Elements 6に関する具体的な書籍やWebサイトがあるかどうかは不明です。また、実際にPhotoshop Elements 6を使用して文字の装飾を行い、成功した経験を持つ方の体験談も参考になります。
回答を見る
  • ベストアンサー

Photoshop Elements 6 を使った文字の装飾

 当方、独学でWEBデザインについて勉強しながら、HPを運営しています。  WindowsのOSで閲覧できる、複数のブラウザでテストしながら、記述したコードの確認を行っていますが、どうにも頭を悩ませている問題として、サイトの一部で使用している、装飾系の文字が、HTMLの「font face」とか、CSSの「font-family」では、パソコンのデフォルトや、ブラウザの差異によって、大きく変わってしまうので、やはりお手本になるWEBサイトのソースでも記述されているように、何かしらのソフトで文字を装飾してから、「~.jpg」形式で保存、別ファイルに記述した、「IMG SRC」タグで読み込ませるように、手を加えたいと考えています。  しかしながら、高額なソフトを買い足せるほど、潤沢な予算はなく、手元にあるPhotoshop Elements 6 でもって、その作業を行いたいと考えていますが、具体的に、このソフトを利用した、文字のデザインに関する、書籍ですとか、WEBサイトは、実際にあるのでしょうか。  また、Photshop Elements 6 を使っての、文字の装飾を実際に行って、イメージどおりのWEBサイトを構築してきた方がいらっしゃれば、是非体験談など、お聞かせ願えればと思います。

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

  • ベストアンサー
  • chiki777
  • ベストアンサー率42% (396/929)
回答No.1

タイトル等、デザイン重視の文字なら、 やはりjpgやgifにします。 alt属性でしっかり指定してやれば、 文字を画像化しても何も問題ないと思います。 (オススメはgif) 文字を画像化するだけなら、(ちょっと手を加えるだけなら) photoshop elementsもCS4も何ら結果は変わりません。 elementsで十分です。 書籍は、書店に腐るほどあると思います。 解説ウェブサイトも腐るほどあると思います。 photoshop elements 使い方 で。 バージョンが違っても、さほどやるべき事は変わりないので バージョン間の操作の違いに戸惑うことは少ないと思います。 イメージ通りのウェブサイトづくりについては、 私のイメージは非常に貧しい物なので、 再現に困難なほどのイメージがわいてきません。 というわけで、私の体験談は当てになりません。 余談ですが、お金をかけずに画像を作成・加工したいのなら、 gimpというソフトが無料、かつ非常に高性能なので、 これも使用してみるのもいいかもしれません。

maniacHP
質問者

お礼

chiki777様 大変丁寧にアドバイスいただきまして、本当にありがとうございます。 WEBデザインに関しては、かなり疎いところがあるので、Phtoshop Elementsでは、やれることも限られてしまうのかなと心配していましたが、いただいたアドバイスを参考にして、頑張ってみます。 ありがとうございました。

関連するQ&A

  • GIMPの操作と文字の装飾

    当方、独学でWEBデザインに取り組み、現在HPを運営しています。 以前、このコーナーで、HTMLやCSSを用いての、フォントのデザインに関して、ブラウザやPCの差異によって生じる、文字の見え方の違いについて相談した際、文字の画像をJPGで用意し、IMGで読み込みたい意向だったため、装飾文字を作成するソフトとして、GIMPをご紹介いただきました。 このソフトの使用によって、部分的に問題は解決しましたが、ソフトの機能として何種類も用意されている、Italicのフォントでは、半角の英数字だけが斜体で表示され、カナ文字に関しては、斜体表示ができないことに気付きました。 この問題に関して、解決したいポイントをまとめると、 1.GIMPでは、斜体でカナ文字の画像を作成することは不可能なのか。 2.可能であれば、どのフォントを使用すればよいのか。 3.不可能であれば、フリーで使える、どんなソフトでもって、斜体のカナ文字画像を作成することができるのか。 以上3点ですが、どなたか詳しい方、何卒ご教授いただけないでしょうか。

  • Photoshop Elements 5.0の文字入力に関して

    Photoshop Elements 5.0では、Cに○のマーク、 著作権とかに使われるマークや、Rに○のマークなど、 特殊な文字は、?になってしまいます。 文字も、フォントもあわせているのですが、 どうなんでしょうか。 他にも、特殊文字ありますが、とりあえず、 そういう文字は、デザインに、文字入力で、 組み込めませんか。 それとも、Photoshop Elements 5.0用に、フォントかなんか、 ダウンロードが必要ですか。

  • 文字の装飾で悩んでいます。

    入力した文字を装飾しようとしているのですがうまくいきません。 どういう装飾かというと、文字中の重なっている部分のみを 色替えしたいのです。 どういうことかと言うと、例えば漢数字の「十」という文字で 説明します。この文字自体は縦線と横線で構成されているのですが その重なった中心の部分のみを色替え(白抜きでも可)したいのです。 他の字も同様なのですが、要は字を書いていく時の線と線の重なった 部分だけが色替わりしていればよいのです。 最終的に何がやりたいかというと、道案内の看板を作成した時に 案内文字自体を目立たせる装飾方法の一つに使いたいのです。 できることなら任意の入力文字をWordのワードアートみたいな 装飾変換機能を使って簡単に一発変換で装飾したいと考えています。 その他の方法として、そういう装飾が施されたようなフォント (重なり部分が白抜きになっているような)が分かればとも 思っています。 文字を画像データに変換してペイントブラシのような 画像加工ソフトを使って色塗りすればなんとかなるとは 思っているのですが、やはり入力した任意の文字列を簡単に 加工したいというのが本音です。 そんな装飾が簡単にできるソフトってないのでしょうか? 過去の質問を検索してみたのですが、見当たりませんでした。 分かる方がいらっしゃったら回答お願いします。

  • Word2003 文字の装飾で悩んでいます。

    Word2003を使用しています。 入力した文字を装飾しようとしているのですがうまくいきません。 どういう装飾かというと、文字中の重なっている部分のみを 色替えしたいのです。 例えば漢数字の「十」という文字で説明します。文字自体は 縦線と横線で構成されているのですが、その交わった部分のみを 縦線・横線とは異なる色づけをしたいということなのです。 細い線だとあまり意味がなくわかりにくいかもしれないのですが 広告とか看板とかに書かれているような太字にこの装飾を 施したいと思っています。 最良の方法としては任意の入力文字をワードアートのような 装飾変換機能を用いて一発装飾したいのです。 ワードの機能で無理なのであれば、そんな装飾が施されたような フォントがあればなと思っています。 文字をビットマップ画像に変換してペイントブラシのような 画像加工ソフトを使って色塗りすればなんとかなるとは 思っているのですが、やはり入力した任意の文字列を簡単に 加工したいというのが本音です。 また、そんな装飾が簡単にできるソフトを教えて頂いても 構いません。 過去の質問を検索してみたのですが、見当たりませんでした。 分かる方がいらっしゃったら回答お願いします。

  • インターネット上の装飾文字の作り方

    ホームページとかアクセスしてみると、タイトルとかに かっこいい文字(装飾文字って言うのでしょうか?)が 使われていますよね。 あのような装飾文字はどのように して作るものなのでしょうか??? (ひらがな、カタカナ、アルファベットはWeb素材として 関連サイトから入手することが可能ですが、漢字とかは どのようにして取得・作成するのでしょうか?)

  • フォントに関して

    当方、独学でWEBデザインを勉強しながら、HPを運営しています。 インターネットの閲覧では主にIEを使用。 サイトコンテンツの一部で、フォントの「cursive」/「fantasy」をHTMLで記述、IEでは非常に見栄えがよいのですが、Firefox/Operaでは全く反映されていません。 CSSの記述に改めても反映されないので、デザインの面でお手本にしているサイトで使われている、「IMG」にて、別途作成した文字を、ファイルにて読み込むような形式に、変更しようかと検討しています。 ただ、その場合、「Photoshop」のわりと上位のバージョンが必要になるかと思うのですが、実際のところ、どうなのでしょうか。 ちなみに、当方が所持している「Photoshop」は、「Elements」です。

  • Photoshop Elementsを購入するか迷っています

    既出の質問でしたらすいません。 検索しても良く分からなかったので、新規で質問させていただきます。 「Photoshop6.0」を使ってデジカメで撮影した写真の処理をしています。 パソコンを買い換えたので入れなおそうと思ったら、CDを以前勤めていた職場(倒産しています)に置きっ放しにしてしまい、新しく買い替えなくてはなりません。 でも「PhotoshopCS」は高すぎて手が出ませんし、「PhotoshopElements」にしようかと考えております。 そこで質問なのですが、「CS」と「Elements」の大きな違いは何でしょうか? 私は以下の作業くらいしかしていないのですが、「Elements」でも十分に補えることでしょうか?  ・縦横比を固定した範囲選択  ・画像の切り取り、サイズ変更  ・シャープやぼかし、明るさなどの、若干の加工  ・画像への文字入れ+文字の装飾・加工 おそらく、十分に使えると思うのですが・・・ フリーソフトの「Paint.Net」を試しに使ってみましたが、私の中で一番重要な「縦横比を固定した範囲選択」が出来なかったので、使用をやめてしまいました。 たいしたことでは無いのですが、ちょっと悩んでおります。 よろしくお願いいたします。

  • フォントを入れた際の文字化け

    サイトのデザインとして使おうと思い漢字フォントをいれたところブラウザやソフトで文字化けのようなものが発生してしまいました。 (インストールした際フォントフォルダにきちんと入れてました) 慌ててその漢字フォントは消去しまして一応ほぼ直ったんですがたまに発生してしまいます。 (日本語の文字のところがなってることが多いです) これは直せるでしょうか?

  • アルファベットの装飾文字(くるくるのひげ文字)

    こんにちは ヤフーメールやホットメールなどのフリーメールで知人にクリスマスメッセージをメールで送ろうと思います。(既存のオンラインのクリスマスカードを使わずに、普通にメールを打とうと思っています。) ここで、よく市販されているクリスマスカードの“christmas”等の英語の文字では、(何と呼ばれるフォントか知りませんが)文字の末端がひげを巻いたようにくるくると装飾された文字がありますが、あのような文字でメールを打ちたいと思うのですが可能でしょうか? (フリーソフトをインストールすることで、あのような文字をメールで打てるようになればいいのですが・・・)

  • Photoshop ElementsでWeb用保存

    Photoshop Elements5.0で、 作った画像をWeb用に保存しようとすると、 ファイル名を半角英数文字にしているにもかかわらず 「ファイル名に使用された2バイト文字は 一部のブラウザやサーバーでサポートされていない 場合があります。このまま2バイト文字を使用して ファイルを保存しますか?」 という警告が出ます。 なぜでしょうか? 他の名前や他のファイルでもダメでした。 初心者にわかる解説でよろしくお願いします。