Get the basic skills of working with Photoshop. This section contains descriptions of the Photoshop bars and tools as well as the basic techniques of using them.  Home Photoshop Photoshop Basics Making Text Look Sharper on Your Webpage

Making Text Look Sharper on Your Webpage


There are a few little tricks that will help your text look a bit sharper on your webpages, especially at smaller sizes.

Resizing:

When resampling blocks of text, there is an option that you may not have noticed, that will help you achieve sharper results. This is particularly useful when you have scanned in blocks of text or line art.

image 1

When we go to resize the image, Bicubic resampling is the default option. This works best for most images.

image 2

Here is the result on our text.

image 3

Try it again, this time choose bilinear resampling

image 4

Notice how much sharper the text is?

image 5

The second trick is for small text and is tracking, or kerning. This means the spacing between letters. Here is a line of text with standard tracking.

image 6

In the tracking box, increase the amount to 20

image 7

See how much more legible the text is. Look at a road sign and you will notice that the tracking is set very wide. That is why you can read them from a distance.

image 8

Here is a line of text with the crisp anti-alising, kind of blurry.

image 9

Photoshop 7 ships with a new level called Sharp, notice the difference?

image 10

I hope these little tips will help you to produce webpages with sharper, easier to read text.



Author's URL: Photoshopcafe.com
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Making Text Look Sharper on Your Webpage"

Only registered users can write comment

No comments yet...