hope: Art of a woman writing from tour poster (i'm gay. so sue me.)
puddingsmith ([personal profile] hope) wrote2004-04-21 07:29 pm

(no subject)

alright, imma chuck a mini 101 in here, because usually i let it slide, but liek, being on dialup makes me gnash my teeth when it takes half an hour just to load the icons on my flist.

alright. so.


concerning dpi

'dpi' is a term that you use when you're talking about digital images. 'DPI' stands for 'Dots Per Inch', which means the dots of ink that ai printer will put out per inch of your image. generally, the higher the dpi, the better quality of image you will get. so a 600dpi image will be better quality printed out than a 50dpi image printed out. however, you need to keep in mind that some printers have a limit to the dpi they put out. for example, the printer at uni is limited to 360dpi, which is perfectly suitable for our photo-printing purposes, and setting the dpi on an image to 600dpi won't get it any better - the printer will just take longer to put it out because it's telling it to take longer, when nothing different is really happening.

but anyway. enough of the printing lesson. dpi generally = image quality, which is most important when you're printing stuff, but it has an impact on images you publish online as well.

when it comes images on the web, you need to keep in mind the simple fact that the highest monitors can display is 72dpi. that's the display of any monitor. what you're looking at right now is a 72dpi display. there are no exceptions.

so basically, if you're creating or saving images as over 72dpi with the idea that you're maintaining a higher quality, you're sadly mistaken. all it will do is up the filesize; the picture you see on your screen is exactly the same as if you'd set it as 72dpi.

now. the difficult thing with this is if you scan your own images. because when you scan, you want a high quality image to come out of it. therefore, when you're tweaking your scanner settings before you click the final 'scan' button, you might want to change the setting for the dpi of the scanned image to something higher than 72. so if you had something say, the size of a coin that you wanted to be (visually) large with high quality, you might scan it at around 600dpi, and it would come up huge and quite detailed in photoshop (don't get too excited with this, though. your scanner is not a microscope, you can lose quality if you go too high with the dpi on an image that isn't big).

so for say, a magazine photo, you might want to scan it at around 360dpi [you can play around with the scanner settings yourself and decide what dpi you prefer to scan things in at. keep in mind that the higher the dpi you scan in, the longer it will take]. it'll be bigger than the original (on your screen, anyway), and the quality will be quite high. it will be big both in dimensions and in filesize.

now, i'm assuming in this tutorial that you'll want to be posting the picture you just scanned on the internet. but the thing you have to understand now, is, that what you have in photoshop is a 360dpi image, but when you're physically looking at it, you're only looking at a 72dpi image. because your monitor can't show you what a 360dpi image looks like. so basically, you can lower the dpi to 72 on that image now and still maintain the size and quality that you're seeing, and, more importantly (to me, anyway), considerably cut down on the filesize.

so. now comes the practical part of this lesson. as usual, i'll assume you're using photoshop, but generally the process won't be radically different if you're using a different kind of photo editor.

1. make sure you have the image you'd like to post open in photoshop.

2. go to the Image menu and select Image size...

3.

firstly, make sure the 'constrain proportions' box is ticked [red star]. this will stop your image from distorting when you change the dimensions. this box should ALWAYS be ticked. it'll mean numbers automatically change themselves when you change others, but it's for the best, believe me.

4. underneath the subheading that says 'image size', go to the field that says Resolution [yellow star]. in that field, enter '72'. make sure the drop-down menu next to that field [green star] has 'pixels/inch' selected, as it refers to dpi, that is, dots per inch.

4. when you adjust the resolution, the width & height dimensions of the image will adjust themselves as well, because photoshop is making automatic adjustments with you printing out your image in mind. therefore, if you lower the dpi, to maintain the same quality in a print, it'll have to be smaller. so. before you adjust the resolution, it's probably a good idea to take not of the dimensions (or just one, width or height) of the original version [pink star]. so. when you change the resolution to 72dpi, the width and height will automatically change. when they've done that, change them back to the original dimensions. the dpi will still be at 72.

that way, your filesize will be a great deal smaller but there will be no noticeable difference in image quality (from your original scan) when you're viewing it on the web.

the moral of the story? all images you want to publish on the web should be 72dpi.



any questions?

left unlocked, so feel free to link to this if you'd like to share the load knowledge.

[identity profile] bexless.livejournal.com 2004-04-21 02:33 am (UTC)(link)
Does this apply to pictures transferred from digital cameras? I ask because I just tried this part:

when you change the resolution to 72dpi, the width and height will automatically change. when they've done that, change them back to the original dimensions. the dpi will still be at 72.

and when I readjusted the height and width back to the original, there was a massive drop in quality and the picture was really blurred. Am I doing something wrong, or is not possible to reduce the filesize on these images?

Please excuse my ignorance, o wise one. I am new to all this high-fangled pixelly stuff.

[identity profile] serai1.livejournal.com 2004-04-21 02:46 am (UTC)(link)
I've found that if I scan at 300dpi, then reduce to 72, I can choose an image size that's larger than the original paper photo and still get good quality, just as long as it's not hugely larger (which wouldn't be useful for the web, anyway. The pic below is about 4 inches across in the mag I scanned it from:

http://image.inkfrog.com/pix/Meiga/leo_1.jpg

:)

[identity profile] crantz.livejournal.com 2004-04-21 07:55 am (UTC)(link)
...okay, this will be useful. I keep setting my icons on 100dpi. >.> I will stop now.
ext_16163: (the better to see you)

[identity profile] bunniewabbit.livejournal.com 2004-04-21 11:59 am (UTC)(link)
a;lkjd;solfjadl;a!

Okay. That makes total sense.

Oddly, changing the dpi on my program does not change the pixel dimensions, but only the print dimensions. The onscreen image remains the same size. Strange. Also, the file size does not change substantially, and in one experiment I did, the overall file size was larger in the one I did at 72 dpi (I guess because even though the pixel size was the same, the actual print size was larger on the lower resolution version). I guess that's just a function of my particular graphics program.
ext_16163: (d'oh!)

[identity profile] bunniewabbit.livejournal.com 2004-04-21 11:59 am (UTC)(link)
ewpz. forgot to close my tag.