イラレで作った画像がぼやけて、色も保存するとなぜか

質問

イラレで作った画像がぼやけて、色も保存するとなぜかずれます。
右上の福岡市中央区許可保育園という部分です。
一番上の線と同じ色にしたいのですが、ずれます。#990000にしたいのですが993333などに勝手にずれます。

なぜ勝手にずれるのでしょうか？
ｐｎｇ24にしています。
フォトショップで作ればこのようにはならないのでしょうか？
http://sample1.digi2.jp/kindergarten/index.htmlより

回答No.3

tkmojo · ベストアンサー

ぼやけるのは画像のサイズと表示サイズが違うからでしょう。
横幅239pxの画像を、cssの指定で260pxに拡大して表示しているので、ぼやけるのは当然です。

色が変わるのはCMYKで作っているからではないでしょうか？
一度カラーモードを確認してみてください。

また、基本的にイラレはWebの制作には向いていません。
イラレは印刷向けのソフトなので基本の単位はmmです。
それをピクセルに直すと小数点の数値になるので画像の端は必ずぼけます。

環境設定から単位をピクセルにして作る事も出来ますが、
それでも完璧にピクセルにあった画像を作れるわけではありません。
Web用の画像はPhotoshopかFireworksで作成しましょう。

ただ、Fireworksは開発終了が発表されていますので
今後の事を考えるとPhotoshopを使うのが良いと思います。
また、PhotoshopはWeb専用ツールではないので、Webデザイン作成時にはある程度設定する必要があります。
下記の記事を参考にしてください。
http://designcolor-web.com/2012/05/29/photoshop-first-setting/

お礼

ありがとうございます。お忙しい中大変ありがとうございました。

サイズ、CMYKの件修正しました。

＞
また、基本的にイラレはWebの制作には向いていません。
イラレは印刷向けのソフトなので基本の単位はmmです。
それをピクセルに直すと小数点の数値になるので画像の端は必ずぼけます。

環境設定から単位をピクセルにして作る事も出来ますが、
それでも完璧にピクセルにあった画像を作れるわけではありません。

WEB用に設定をしても、フォトショと違って、ぼやけるのですね。
ただハシということなので文字などはぼやけないのでしょうか？
それともすべてにハシがあるので、イラレでぼやけないようにするのは不可能ということでしょうか？

回答No.2

foomufoomu

問題の文字を拡大して見ると、白と赤が混じってしまっているのがわかります。
おそらく、文字を書くときのアンチアイリアス処理が災いしているためでしょう。
http://725desu.blogspot.jp/2011/02/blog-post.html

お礼

ありがとうございます。お忙しい中大変ありがとうございました。

アンチエイリアスはなしになっていました。
文字に最適などのタブですよね。

回答No.1

ORUKA1951

パレットを制限してPNGで保存する。
スタイルシートで文字を・・
div.header h2{
text-align:center;
font-size:16px;
position:absolute;
top:0;right:10px;
width:15em;height:1.5em;
color:white;
background-color:#990000;
line-height:1.5em;
border:#990000 solid 2px;
border-radius:0 0 5px 5px;
box-shadow: 10px 10px 10px 10px rgba(0,0,0,0.4);
}

お礼

もともとはスタイルシートでやっていたのですが
ＩＥ８がCSS3に対応していないので画像にしました。

文字はぼけるものなのでしょうか？