[This appeared in our July newsletter. Subscribe now so you get monthly tasty tech tidbits and special deals.]
The more you pay attention to images, the better your website will be. Good graphics make the difference between a webpage that attracts and one that repels. Here are a few essential graphics tips you can follow to make your whole website better:
1. Save photographic images as JPG and save illustrated images as GIF. Learn more about GIF vs. JPG.
2. Make sure your web graphics are saved as no more than 72 dpi. That’s the standard compression for the web. Anything bigger means slow loading. Learn more about optimizing images from The Comprehensive Guide to Saving Images for the Web.
3. Don’t use HTML to set the width and height. Instead, resize the picture to the appropriate dimensions. Doing otherwise will make your page load slowly and could skew the look of the picture. In other words, if you need
<img width=”200″ height=”200″ src=”boat.jpg” alt=”sailboat” />
then your image (boat.jpg) should be 200x200px rather than a scaled down 500x500px image. Just like this perfectly sized pic:
[[{“type”:”media”,”view_mode”:”media_large”,”fid”:”668″,”attributes”:{“class”:”media-image size-full wp-image-1402 alignnone”,”typeof”:”foaf:Image”,”style”:””,”width”:”200″,”height”:”200″,”title”:”boat”,”alt”:”boat”}}]]
Here are more tips on web design from the Talance blog:
- Save Your Sanity AND Get the Logo You Love (Yes, You Can!)
- You’re Doing It All Wrong! How to Use Pictures on a Website
- How To Design by Committee (And Live To Talk About It)
- Make Websites Easier for Older People
- 7 Best Homepage Updates