PhotoshopForums.com Home
Navigate Contact FAQ Search Members
Image/Text issues
Post new topic   Reply to topic    PhotoshopForums.com Forum Index -> General Photoshop and Design Discussion
 See a User Guidelines violation? Please contact us.
Author Message

latcarf

Joined: 17 Oct 2007
Posts: 6
Location: Michigan, USA


PostPosted: Wed Oct 24, 2007 1:33 pm    Post subject: Image/Text issues Reply with quote

Hi all... I am fairly new to using PS (CS2) and just recently started using it for web design also.

It seems every time I use text, when I save the image and apply it at the site the text is rough and choppy around the edges (like pixelized).

I searched for an answer to this and the responses seem to indicate the image size and/or dpi is the key. I have redone the images in the sizes needed and increased dpi but this still does not help.

I am thinking I have missed a step (or just don't know!) how to use PS for web text...

thoughts, suggestions!?

example is here http://www.latcarfproductions.com/mls/mlsindex.html on the logo
View user's profile Send private message Visit poster's website

doubrovski

Joined: 29 Sep 2007
Posts: 230



PostPosted: Wed Oct 24, 2007 9:02 pm    Post subject: Reply with quote

Hi,
Play with anti-aliasing menu (try "Smooth", "Sharp", "None", etc.)

_________________
Andrei Doubrovski
SimplePhotoshop.com
View user's profile Send private message

latcarf

Joined: 17 Oct 2007
Posts: 6
Location: Michigan, USA


PostPosted: Thu Oct 25, 2007 12:34 pm    Post subject: Reply with quote

Thanks... So I went in and did some text and saved it 5 times using each of the aa attributes. The aa attribute None was the best but still came out looking basically like what I have already.

I'll just keep plugging away until someone or myself figures it out...
View user's profile Send private message Visit poster's website

doubrovski

Joined: 29 Sep 2007
Posts: 230



PostPosted: Thu Oct 25, 2007 9:44 pm    Post subject: Reply with quote

latcarf,
I've just noticed that pixel dimensions of your image are 2083x1125, while HTML code sets image size to 278x140 (incorrect proportion, into the bargain). It's absolutely wrong approach. Most of the edge jugginess appears when your browser zooms the image out. Resize it in Photoshop as needed (278x150 or 259x140) and then set the same size in HTML code.

Also, in "Save for Web" dialog add "Matte" color matching your page background color. This must smooth the edges even more.



BTW, Do not forget about optimizing images for the Web; 188 KB is certainly too much for a logo :)

Here is my version (intended for "EEEEFF" bg color)


_________________
Andrei Doubrovski
SimplePhotoshop.com
View user's profile Send private message

latcarf

Joined: 17 Oct 2007
Posts: 6
Location: Michigan, USA


PostPosted: Sun Oct 28, 2007 8:18 am    Post subject: Reply with quote

Hello doubrovski,

Thanks for the help! I am/was sure it was something I was doing to include a lack of experience... I was quite sure I was saving the images at the sizes I needed but I will double check my settings.

I had a heart cath friday so I am resting a bit and will look at this in more when I am feeling a little better. I will come back and give you some feedback but I am sure it will be positive.
View user's profile Send private message Visit poster's website

Patrick
Administrator
Administrator

Joined: 14 Feb 2003
Posts: 11945
Location: Harbinger, NC, U.S.A.


PostPosted: Sun Oct 28, 2007 8:27 am    Post subject: Reply with quote

Hope you're feeling better soon, latcarf.
_________________
Patrick O'Keefe - PhotoshopForums.com Administrator
Have a suggestion or a bit of feedback relating to PhotoshopForums.com? Please contact me!
User Guidelines
View user's profile Send private message Send e-mail Visit poster's website AIM Address Yahoo Messenger MSN Messenger

latcarf

Joined: 17 Oct 2007
Posts: 6
Location: Michigan, USA


PostPosted: Tue Oct 30, 2007 7:00 am    Post subject: Reply with quote

Patrick wrote:
Hope you're feeling better soon, latcarf.
Hello Patrick,

Thanks for the thought, and the welcome in the intro section. They put in 2 stents so the overnight stay in the hospital took more toll on me than the procedure. Hospitals may be able to "fix" but they sure are not an environment for resting and healing!

Lance
View user's profile Send private message Visit poster's website

latcarf

Joined: 17 Oct 2007
Posts: 6
Location: Michigan, USA


PostPosted: Tue Oct 30, 2007 7:18 am    Post subject: Reply with quote

doubrovski wrote:
latcarf,
I've just noticed that pixel dimensions of your image are 2083x1125, while HTML code sets image size to 278x140 (incorrect proportion, into the bargain). It's absolutely wrong approach. Most of the edge jugginess appears when your browser zooms the image out. Resize it in Photoshop as needed (278x150 or 259x140) and then set the same size in HTML code.

Also, in "Save for Web" dialog add "Matte" color matching your page background color. This must smooth the edges even more.


BTW, Do not forget about optimizing images for the Web; 188 KB is certainly too much for a logo :)

Here is my version (intended for "EEEEFF" bg color)

Hello doubrovski,

Thanks again for the feedback it surly helped. I think the image you pulled (2083x1125) was an experiment I did trying to work through the problem. I was applying image printing theory to web display by shrinking an image hoping that would make up for the pixeling effect. lol... so much for theory!

I did learn from your feedback. I had no clue about using the Matte function to match the background. That helped tremendously and thanks for providing the example image also. I got a chance to practice also since the site has changed dramatically and the background is now black.

Is there a font that is best for web use? A PS tutorial for using text in web images? I noticed the CS Help has a section for web images but they don't discuss text.

Regards,
Lance
View user's profile Send private message Visit poster's website

doubrovski

Joined: 29 Sep 2007
Posts: 230



PostPosted: Tue Oct 30, 2007 9:17 am    Post subject: Reply with quote

Hello Lance,
Hope you are ok now.

As for the fonts, "sans" seem to be more common on the Web due to (supposedly) better readability.

_________________
Andrei Doubrovski
SimplePhotoshop.com
View user's profile Send private message

Patrick
Administrator
Administrator

Joined: 14 Feb 2003
Posts: 11945
Location: Harbinger, NC, U.S.A.


PostPosted: Tue Oct 30, 2007 11:44 am    Post subject: Reply with quote

True enough. :) I think most everyone wants to spend no more time in a hospital than they have to. ;)
_________________
Patrick O'Keefe - PhotoshopForums.com Administrator
Have a suggestion or a bit of feedback relating to PhotoshopForums.com? Please contact me!
User Guidelines
View user's profile Send private message Send e-mail Visit poster's website AIM Address Yahoo Messenger MSN Messenger
Display posts from previous:   
Post new topic   Reply to topic    PhotoshopForums.com Forum Index -> General Photoshop and Design Discussion All times are GMT - 6 Hours
Page 1 of 1
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
You cannot attach files in this forum
You can download files in this forum


Contact - User Guidelines >

Copyright © 2003-2016. PhotoshopForums.com, iFroggy Network. All Rights Reserved.
Powered by phpBB © phpBB Group. phpBB SEO. Privacy Policy.
We are in no way affiliated with Adobe. Photoshop, Adobe and related marks are registered trademarks of Adobe.
PhotoshopForums.com