本当に基本的な質問ですいません、今ホームページを初めて作成中なんですが、adobeのGOLIVE!の5.0を使っています、テキスト文字だけでなく
プロっぽいきれいな文字をタイトル等に使いたいので、adobeのPhotoshopの
4.0で、文字を作ってみました、これって画像と同じようにgoliveの方に貼付ければいいのでしょうか?
今現在やっとできたのは、四角のテーブルの中に文字を書いて、画像と同じようにはりつけました、でもなぜか張り付ける前の方がきれいで、張り付けられたものはにじんでる感じです。これはなぜなんでしょう?
又フォトショップで作った「文字だけ」をサイトに張り付けるにはどうしたらよいんでしょうか?
初心者のマックユーザーです、小学生に教えるような感じで
どなたか教えていただけないでしょうか?
宜しくお願いします。
No.4ベストアンサー
- 回答日時:
補足、読ませていただきました。
画像の背景を透明にすることとHTMLは、まったく関係がないのでご安心下さい。
背景が透明な画像を透過GIFといいます。
これを書き込んでいるのが、会社のため手元にフォトショップがないので定かではありませんが……
確かでGIF画像を作るには、プラグインがないとダメだったように記憶しています。
で、保存するときにツールバーの「ファイル」から、出力用プラグにあるGIFフォーマットのプラグインを指定して保存。
と、その前に。
背景色にする色を設定することを忘れないで下さい。
おそらく、これでできる、かと。
ではでは。
kumosukeさん!ありがとうございますっ!できました!
出力プラグにgifがあって、御指導の通りにやってみました
本当にありがとうございました。
又何か出てくるとは思うので、その時は又宜しくお願いします
うっうれしいですっ!
No.3
- 回答日時:
こんばんは。
さて、私はGOLIVEは使っていないので、どのようにHTML作成していくのかわかりませんが、タグ(画像を配置している場所)を見てみて下さい。<IMG SRC="~.gif" ~>もしくは<IMG SRC="~.jpg">となっているかと思います。いろいろな説明ははぶきますが、No.1の方の言われるようにPHOTOSHOPで作ったものをGIFで書き出しましょう(この場合)。PHOTOSHOPでもできるのですが、PHOTOSHOPを持っておられるのでしたら、PHOTOSHOPのパッケージ内にImageReadyというアプリケーションが付いてきたと思います。そのソフトを使えばWEB用の画像作るときは便利です。WEB用画像作成ソフトと考えて下さい。解像度は自動的に72dpiで出力してくれます。っていうか72dpiしかつくれませんけど。
アドバイスですが、ImageReady上で直接文字を打ち込むと綺麗ですよ。Illustratorなどで作ったファイルをImageReadyで開いくと、文字がラスタライズされて、文字を直したしたくても図形化してしまっているので直せないし、少しぼけたような感じになります。
ImageLeadyで直接文字を打つ(ツールの「T」を選んで)打ち込んでね。画面上の部分にオプションバーが出てると思うけど、出てなかったら「ウインドウ」→「オプションの表示」をしてね。オプションバーで文字の種類や大きさなどできるよ。
完成したら、レイヤーを見てみよう。レイヤーのバーが出ていなかったら、「ウインドウ」→「レイヤーを表示」でレイヤーのバーを出してね。
レイヤーバーを見ると、一番下に「背景」てあると思うけど、もし、ウェブ上で背景がいらない場合は、そのレイヤーをレイヤーバーの下にあるゴミ箱にドラッグすると捨てられるよ。そうすると、この場合、文字(Tとあるレイヤー)意外はないよね。デザイン画面をみるとバックがチェックの柄になっていると思うんだ。このチェックの柄はバック透明ってことだよ。
とりあえずここまでできたら、このファイルを保存しておこう。保存の仕方は、普通に「ファイル」→「保存」もしくは「別名で保存」を選んでね。もちろん、保存したファイルは、PHOTOSHOPでも開くよ。PHOTOSHOPで開くと解るけど、解像度が72dpiになってるでしょ。拡張子(ファイル名)も「~~.psd」になってると思う。保存できたら、いよいよWEB用に書き出しだ!
書き出す前にやっておかなくていけないことがあるから注意してね。
まず、「ウインドウ」→「最適化を表示」させて、最適化バーの中に、「GIF」か「JPG」か「PNG-8」か「PNG-24」を選ぶところがあるから、「GIF」にして、メイン画面(デザインした画面)の上の部分に「元画像」「最適化」「以下省略~」の「最適化」をクリックして、最適化バーに「カラー」があるから、「256」から「128」って感じで数字を下げていってみてね。数字が減れば減るほど容量が軽くなるんだけど、画質は悪くなっていくからね。数字を下げていくとメイン画面の画像がどんどん変わっていくのがわかると思うんだけど、文字ぐらいだったらそんなにかわらないかもしれない。めんどくさいようだったら、256でいいよ。自動でやってくれるから。意図的に軽くしたい場合はこの方法でします。
そして、ここが肝心なところだけど、最適化バーの中に、「透明部分」てあるから、そこにチェックを入れて、マットの部分の色をウェブのバックの色に合わせてね。バックが白だったら「白」にするなど。そうすると、さっきレイヤーでチェックの柄の意味は透明だったから、透明になって、文字とバックの透明の接点部分をマットの色、この場合は白で補ってくれるんだ。便利でしょ。別に透明にしたくなかったら、さっきの背景をすてなくすればいいだけだよ。この場合「透明部分」のチェックがあろうとなかろうと関係ないんだ。書き出したときに四角い画像だからね。
さっ、書き出ししよう。書き出し方は、「ファイル」→「最適化ファイルを保存」もしくは「最適化ファイルを別名で保存」をしてみて。そうすると保存先のウインドウが出てきて、ファイル名が「~.gif」になってるでしょ。これで、GIFファイルができたね。
あとは、GOLIVEなどで配置すればOKだと思うよ。
ちなみ今の説明は、Adobe ImageReady3.0だから、PHOTOSHOP4.0に付いてるのは、Adobe ImageReady2.0だったと思うけど、操作的には似てるから頑張ってみてね。あと補足しておくと、今の作業はPHOTOSHOPでもできるよ。ただ、作る際、解像度に注意してね。じゃ~頑張ってね~。(^o^)/~~~
この回答への補足
詳しく回答していただきありがとうございました
プリントアウトして早速やってみましたが、検索でImageReadyをさがしてみたのですが、フォトショップの4.0にはどうもないみたいです、
でも文字を書く時に文字ツールの中の表示のフォントの所が×にしてなかった
のでしてみたら、なぜか、美しい文字が出るようになりました。
その後の背景をゴミ箱に捨てるのもやってみました、ちゃんと背景が
チェックになりましたが、複製を保存でJPEGの画像を作ったとたんに
背景が白くなりました、(GIFにはできないみたいです、形式の欄に
入ってませんでした)
それを、GOLIVEにポイントシュートしてみたら、やっぱり四角い大きな白い
物の中に文字が出てしまい、文字だけにはできませんでした....
ちなみに、GOLIVEは簡単にウエブページを作るソフトで
html は関係なくできるやつです。
私自身もHTMLの事わからないです、すいません...
このような状態で、何とか文字だけを載せる事はできるんでしょうか?
お手数おかけしてすいません、又お返事いただければ幸いです
No.2
- 回答日時:
こんばんは。
えっと、にじんでる感じのほうですが、それはたぶん画質が落ちているからではないでしょうか。
画像を制作している段階(制作画面)では、フォトショップ(psp)形式だとかbmp形式だとか、質の高い綺麗な画像なんです。
それをWeb上に公開するには、jpeg・gif・またはpngで保存しないといけないんです。
なので、たぶん「にじんでいる」をいうことであれば、jpeg形式なのではないでしょうか?
文字・ロゴはgifのほうが向いていると思いますので、保存の際にgifで保存してみてください。
色数は64もあれば美しく仕上がるのではないかと…
「文字だけ」というのは、四角の白いテーブル(というか、画像)ではなく、それを張りつけても背景の色が文字以外出は透ける、ということでいいでしょうか?
その場合もgifで、文字に絶対に使っていない色を文字以外の背景に塗り、そこを「透過」にします。
簡単にですみません、詳しくは4,0ユーザーの方にお願いするとして、参考までに!
この回答への補足
ありがとうございます、4.0は透過できるのでしょうか?
さがしても、透明度とかしかなくて...これを1にしてみましたが、かわりません、どうしてでしょうか....
gif形式にもできないみたいです、pngにしたらもっとモザイク風になってしまいました、あとはjpegしかないみたいです
他に何か方法がありましたら宜しくお願いします。
No.1
- 回答日時:
そのソフトは使ったことがないので、どこをいじれば設定を変えられるのかは分かりません。
それを前提で説明させていただきます。
文字というのは、フォトショップで作成した画像ですね?
画像がにじんでしまう……外見上はそう見えますが、実際には画像の天地左右がソフトによって勝手に引き伸ばされて(あるいは縮小されて)しまっているからです。
たとえば。
元の画像の天地(上下のサイズのことです)が180。
左右が200だったとします。
この値が、それぞれ120%あたりで拡大されると、自分が作った画像が思うように表示されなかったりします。
さて。
通常のHTMLの場合、画像の指定は以下の感じで行います。
<img src="honyarara.gif" heigth="180" width="200">
パーセント指定では、以下です。
<img src="honyarara.jpg" heigth=100% width=100%>
こんな感じ。
src="honyarara.png"は画像の指定なので、この際無視するとして、問題のサイズについて。
heigth="180"あるいはheigth=100%というのは天地のサイズ指定です。
width="200"あるいはwidth=100%は、左右のサイズ指定。
この辺の数字が、aiko8080さんが作られた画像のサイズと違っていませんか?
adobeのGOLIVEがどういったものなのかは知りませんが、イラレとかと同じに考えるなら、この手の設定をする場所があるはずです。
貼り付けた画像が、作った画像のサイズとイコールかどうかを確認してみてください。
ではでは。
この回答への補足
ありがとうございます、サイズは100%で、かわっていませんでした
とりあえず、文字は何とかハっきりしたんですが
まだバックが消えないんです
ちなみにhtmlの方は、全く知識がなく、やるのに時間かかりそうです
すぐにお返事できません、ごめんなさい...
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Word(ワード) ワードアートの袋文字のコピー 1 2023/01/08 16:03
- Photoshop(フォトショップ) 画像編集ソフトPhotopeaのツールバーなどの文字の大きさを変える方法を教えてください。 1 2023/02/25 19:09
- その他(メールソフト・メールサービス) メールソフトを教えてください 1 2023/03/28 23:32
- Evernote Evernote(エバーノート)の文字化け 1 2022/04/05 19:30
- Word(ワード) ワードの表、別文書からコピペすると、レイアウトが崩れる 3 2022/04/17 14:59
- Visual Basic(VBA) 特定の文字を簡単な操作で半角スペースに変換するか削除したい 2 2022/11/01 10:35
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- 写真 私が撮った別の写真に、下の画像の「LEON」の文字をそっくりそのまま貼り付けるにはどうすれば良いです 2 2022/10/28 11:42
- マンガ・コミック 漫画家はみな書道が得意か? 漫画家で悪筆の人はいるか? 5 2023/08/16 09:05
- Excel(エクセル) Excelに文字データのみを貼り付けたい 8 2023/05/03 15:38
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Gom Player 動画を再生できなく...
-
有料ツール可/DVDをリッピング...
-
GIMPの線の太さ
-
DVDプレヤーだと 再生できない
-
ビデオカメラで撮影した動画にA...
-
YMM4でUtVideoを使用する方法を...
-
mp3の音楽ファイルの「アルバム...
-
ゆっくりムービーメーカーで発...
-
4Kテレビと2.7K or 4K動画の画...
-
直したい
-
Freemake Video Converter の無...
-
動画ファイルの字幕について。
-
どのにピー音あってどうやった...
-
ただ動画と動画を結合できれば...
-
連続質問です 動画ファイルの圧...
-
プリントパック入稿用テンプレ...
-
ゆっくりムービーメーカー4、GI...
-
動画編集ソフトについて
-
MP4 から ISOに 変換
-
効率よくキャプチャ画像を保存...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
mp3の音楽ファイルの「アルバム...
-
AudacityでMP3をMIDIに変換
-
GeForce RTX3060はPowerDirecto...
-
ブルーレイのオーサリングソフ...
-
パソコンで編集した、動画をテ...
-
画像修正について
-
アドビのクリエイティブクラウ...
-
動画編集ソフトについてです。 ...
-
audio CDをUSBメモリーに...
-
Vtuberになるために自作AI生成...
-
写真・動画ファイルの整理ソフ...
-
イラレやフォトショ、acrobat以...
-
動画編集ソフトについて
-
YouTuberになりたいのですが、...
-
キーフレーム
-
PhotoScape という画像加工ソフ...
-
声の音声解析ツール(ソフト)...
-
画像編集ソフト、GIMPの規約に...
-
PowerDirector 365に詳しい方
-
vlcプレーヤーで動画を再生した...
おすすめ情報