No one would disagree that our intranets would benefit from more images, and better use of photos. Yet getting a photo from a digital camera onto the intranet can be such a chore, and the results often disappoint the page owner / editor as well as the audience.
Images are often fuzzy, too large for the screen / too small to see, and take an age to download even inside the network.
With a few basic tweaks we can improve photos without spending a lot of time; no expertise required.
The truth is that few of us are professional photographers, few of us know which end of Photoshop to hold and few of us even have Photoshop / Fireworks and so we dump photos directly online without any editing.
Here’s a handy guide that I made for you to steal use and take credit for help your intranet contributors. I forgot to put my name on it (except in the ‘Properties’) so go, run with it!
- Image editing basics – crib sheet [PDF; 300KB] (right-click the link and choose ‘Save target’ to pop it on your desktop)
The key points are to use whatever image editing software you have (and remember, you can edit photos online these days) and tweak the quality (resolution), dimensions and shape of the photo before ‘exporting it with preview’ as a PNG or JPG file.
Online editors: Pixer; Fotoflexer; Pixenate; Splashup; Picnik; Pixlr; Online PhotoShop.
When you’re feeling adventurous or have a few minutes more, you can experiment with tweaking the brightness, contrast and colour saturation.
This one page crib sheet might help your people remember these few steps. Oh and if you print this crib sheet you’ll see why it’s so important to get the quality (resolution) correct for the medium – the images in this crib sheet have been formatted for the screen – they look odd (‘blocky) in print. As always, use the appropriate quality for the intended medium.
If you’d like to share or tweet this crib sheet, the short URL is: http://kilobox.net/1401
Please link to http://kilobox.net/1401 if you’d like to share this image editing sheet with your colleagues or readers.
Thank you for a very handy PDF; I’ve saved it in my website folder. I’d often wondered about the difference between PNG and JPEG, so it’s great to learn such things :)
Thanks so much for this Wedge! That’s a really nice, useful info sheet! Thank you for your generosity.
Kind regards, Nadine
It’s lovely of you both to say, thank you.
Many thanks for sharing this. I might even put my photo up on our staff intranet now!
Glad you like, Marianne :)
Hi Wedge – what do you have against GIFs?? They are a valid option when producing web graphics – and in my experience almost always smaller than PNG files (when used correctly).
I don’t see GIF as the poor cousin to the PNG – just a different format, and better suited to some images than either JPG or PNG. While it’s always important to choose the correct graphic format depending on the image, and to balance file size and quality, I don’t think you should exclude GIF as a option.
I fear that GIFs offer a less favourable smoothness than PNGs. Both GIF and PNG offer ‘adaptive’ colour optimisation which are very comparable, but then PNG offers greater quality options. File-size is very important to me, user-experience is crucial, but I’ll take a few extra KB for a better quality image.
Knowing when to use JPG instead of PNG/GIF is easy; knowing when to use GIF instead of PNG is tricky.
How do we advise amateur web publishers in how to choose between GIF and PNG?
The people I’m trying to help need a clear direction with such choices; only experience can help a person *truly* choose the correct graphic format for the image in question.
Until people gain experience and develop a feel for which format to use, we go with the “4 up” approach when exporting (in Fireworks or Photoshop) – comparing an original image against JPG, GIF and PNG previews – aiming for a balance of best quality and smallest filesize.