A Picture's Worth...

Hi, I'm a very accidental techie, now the communications person at an airport nonprofit.

I'm setting up a new web site with NonProfit Office but am confused about how I can best get my photos optimized so they load quickly but are sharp (the NonProfit designer just said she didn't know anything about it). They are jpgs taken on a digital camera but when I reduce them to "recommended size" (v. small) they are muddy/blurry/pixilated. I've been reading many techsoup articles about lossy jpgs etc. but nothing that leads me through whether or how best to resize (from 2000 to 200 pixels!), etc. I currently use Microsoft PhotoEditor or Picassa--do I need some PhotoWizard-type software? Any comments or explanations? Feel free to talk down to me!

Also, a marketing consultant just mentioned that most organizations don't want their web site viewers to have 'too easy access to photos'. I haven't heard this myself but, as I want the site to have lots of pictures, is there a (software) way to keep (or deter) people from copying and pasting our pictures elsewhere?

Thanks very much for any help...

Lukey

Microsoft Photo Editor doesn't do a whole lot. I use GiMP, which is open source and free. For putting pictures on the web, you don't want to reduce size so much as resulution. Most monitors aren't going to give a print level resolution (around 300 pixels per inch) so I usually take my photos for the web down to a resolution of about 96. After you reduce the resolution, you can always use the Sharpen function to make them look a bit sharper. You can also adjust contrast and brightness to get the best of your image.

Unfortunately, I don't know of any way to prevent download of images. I know there is a way, but don't know how. Hopefully someone can educate both of us.

Hi, Lukey,

Welcome to TechSoup.

I think you will get the best answers to these questions in the web building forum. If you post there, be sure that you reword your question a little as duplicate posting is discouraged here.

But... that said and done, in answer to your question, there are several ways to reduce your photos and still keep them as high a quality as possible. I don't use either of the programs you named, but assume that the things I will say here will apply pretty generally. (I use Serif PhotoPlus).

What I do is this

• First, I crop the picture to the exact size I want, thus reducing the overall size.


• Then I adjust the image size to make the overall picture smaller again. I finesse this a little, i.e. I adjust the size and check how blurry it has gotten. If too blurry, then I change how much I've reduced it (ie reduce it less). You should have an edit drop down option to adjust the image size by pixels or by inches. I use the pixel adjustment for web work.


• Then, in my program, I have an export optimizer that lets me make some final adjustments and see how they look. It allows me to see if exporting as a jpg or a gif will make an image smaller or clearer; and it lets me choose to reduce the overall quality, by percentage. So, maybe if I export an image at 100% it is be 330 KB, but if I export at 80% it will be 50 KB, and the quality loss is acceptable. See if your program has that export optimizer.

Hope that helps,

Thanks for the help. I know I'm missing something in the translation here when Jodith mentions resolutions and you mention adjusting the image by pixels.

In Microsoft Picture Manager I have been cropping (I have the measurements set to pixels, not inches), autobalancing, saving at 100%, then choosing 'Compress for web pages' which reduces the file size from 1 or 2 MB to about 25 or 30 KB (and the size is reduced to approx. 2x3, depending on original size). (I didn't notice that saving it at 80% and then compressing made the file any smaller or more/less pixelated, honestly.) I'm assuming the Compression for web pages is a sort of export optimiser but am not completely sure (way too many ways to say/mean the same thing) of that, or if it is a not very good one, etc.

Am I completely obtuse or just on a parallel track? Unless I hear more/different, I will go with this for now and try to decipher 'optimization' lingo for the future.

The light's beginning to dawn, I think.

I went into file/export in Office Picture Manager and it seemed to do the same thing by reducing the size (to any WxH amount of pixels I wanted) without calling it "compression". Tried same picture using each way--Export and Compression--similar (but not the same) KB size and picture resulted.

Essentially, digital pictures are made up of pixels, that is dots of color that together to make up a picture. Resolution is how many pixels you have per inch. That is, how many dots of color in each inch of picture. The more dots per inch, the clearer your pictures will be, but the larger the size of the file. The higher the resolution, the more clear the picture. For printing purposes, you want at least 300 pixels per inch, preferably higher.

Essentially, when you "compress" the pictures for web usage, they program is taking dots out of the picture while leaving the picture the same size, giving you a lower resolution. That is acceptable in web usage because most monitors don't display at a high resolution to start with.