Lately, I have been working with the creation of images and text for our new project www.teterum.com. My challenges, as I’m not an expert on either Photoshop or image design, have been to keep the text sharp but still be able to create an image that is as low in resolution as possible as Google appreciates that from a usability point of view (the page takes less time to download). This is what I have learned this week by asking my professional friends and searching on the web. If you have more tips, feel free to add as we are all here to learn.
How did I take an image from this blurred stage
to this much more focused and keeping the whole banner to less than 100kb.
5 tips on how to make an image sharper
1. Reduce the space in-between the letters. The eye interprets the text as being more in focus. (Window – Character – AV distance set to minus).
2. Work with the Anti-alias. Each Font reacts differently on the anti-alias you apply, you have to test which one is best for your font (Window – Layer – right click on the text layer you are working with to see the options)
3. Import the text from Illustrator. It is more time-consuming but for big heading it may be the best solution (File – Place). It has to be an .eps file you import though.
4. Use the Smart Sharpening functionality. This does not always make the trick for text, but try it (convert text layer or the whole image into a smart object –Filter – Sharpen – Smart Sharpen).
5. Work with the saving functionality and the quality.This was a tip given to me by a good friend. When you save for the web, instead of using the standard functionality, opt for the “save as” option and see how low you can bring the image before it start to become blurry (chose the option sRGB IEC61966-2.1 in the first saving options.
In the second box, choose at lowest 6 and “Baseline optimized”).
More suggestions?
El blog de Patricia Pólvora 