Posts Tagged ‘photoshop’

Save For Web’s Mysterious White Border

Saturday, December 22nd, 2007

White Border

Photoshop has a handy feature that allows you to save images for web use. It allows you to save images as JPGs, GIFs, and PNGs. It also allows you to resize your image before saving it. Some time ago I noticed that some of my images had a thin white border around them. I believe this to be a result of image resizing. After some trial and error, I found a couple of ways to fix this problem.

Before you "Save For Web"

1. Try to resize your image first: Image -> Image Size...

2. Try to "Flatten" your layers first: Layer -> Flatten Image

If all else fails open your file, after you've Saved For Web, and paint around the edges with the same color as your background. Once you're done painting just: File -> Save

No Border

Smooth Fonts in Photoshop

Monday, December 10th, 2007

When working with text in Photoshop, I've come across situations where my text/fonts turn out to be rough or jagged.

Rough Font

I've seen websites where designers have used images like the one above and may not have known that there is a very simple fix: When the "Type Tool (T)" is selected there is an anti-aliasing drop-down menu in the toolbar at the top of the screen. The selected option, to produce the text above, was "None". This is the default anti-aliasing method.

Font Setting

If you change this to "Smooth" or possibly any of the other options, you will get a much smoother font.

Smooth Selection

. . . and here's the final result

Smooth Font

I've tried to search for this solution before and didn't have much luck. That's why I'm sharing this with everyone!