Resizing an image using preview help

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
Hi all,

I am having a website built, the web guys have set up templates for me to upload photos etc onto..

For example;
One of the templates needs images - 370px Width x 210px Height

(am assuming the px means pixels)

I have discovered how to resize using Preview but it also asks about pixels/inch or pixels/cm, the pre-set is 300...

What would I need?

Thanks in advance :)

is there anyone out there? :confused:
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
hello,

yes I'm using preview to resize, but when I do, it has a preset pixels/inch....

This is what I need help on... do I change this setting? For example;
One of the templates needs images - 370px Width x 210px Height
The pre-setting for this is 300 pixels/inch.....

Do I change the 300 pixels/inch or leave as is? Other photos come out at 72 pixels/inch....... it is never the same......
 

DoFoT9

macrumors P6
Jun 11, 2007
17,512
33
Singapore
hello,

yes I'm using preview to resize, but when I do, it has a preset pixels/inch....

This is what I need help on... do I change this setting? For example;
One of the templates needs images - 370px Width x 210px Height
The pre-setting for this is 300 pixels/inch.....
hi emma, i will elaborate more :)

untick "keep in proportion" so that you can choose custom sizes. yes - please use "px", this does = pixels. see the attached image, you should mirror it exactly to achieve what you want to get.

Do I change the 300 pixels/inch or leave as is? Other photos come out at 72 pixels/inch....... it is never the same......
this number depends what the original image is. this setting is known as DPI (dots per inch) - it basically means how many dots on inch there are in an image. higher will obviously have better looking images. 72DPI is fine for online content, where will the content be used? i recommend sticking to 72DPI.
 

Attachments

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
hi,

thank you so much for your reply..

the content is for a website, photographs of hotels.... the web guys said that they had set it so that whatever the size of the photo I put in the cms, it will come out on screen the correct size, but if I could scale the photos down the page would load quicker, so obviously I want to scale them down!

the photos that need to be 370/210 most come out as 72 dpi so I'll keep that as it is then.... but for the ones that come out as higher, should I lower it to 72 dpi?

the photos that need to be 156/113 come out at 304.8, 254, 300 etc etc, should I lower them down to 72 dpi? or leave them as is?

I received the photos from each hotel individually, I was told to request high resolution and most are....... should I assume that the dpi is different because each photo is different? So therefore should I just be more concerned about the size that is needed and just keep the dpi as whatever it is?

am I making sense? :confused:
 

DoFoT9

macrumors P6
Jun 11, 2007
17,512
33
Singapore
hi,

thank you so much for your reply..
thats ok :)

the photos that need to be 156/113 come out at 304.8, 254, 300 etc etc, should I lower them down to 72 dpi? or leave them as is?

I received the photos from each hotel individually, I was told to request high resolution and most are....... should I assume that the dpi is different because each photo is different? So therefore should I just be more concerned about the size that is needed and just keep the dpi as whatever it is?

am I making sense? :confused:
ahh ok, its for a website. yes its all making sense :)

given that it is for a website, and a photographic one at that - i would recommend setting them all to the same DPI. it might be a good idea to get some sort of work flow happening.

1. set the DPI in Preview, save them and dont worry about the sizes.
2. download Resize 'Em All and use that to batch-process the size of the images into the predefined size.

there is probably a batch program to do all of these steps in one, but i am too lazy to look :p
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
DPI has absolutely no influence if you are using the pictures on a website. Just set them to the required pixel width and height and you're good to go.

Here's a very good explanation.
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
hi,

thanks for taking the time to reply..

I read the article, which did help me understand more but then reading peoples comments after means I am now confused again...

most were saying, like yourself that the dpi doesn't matter, then 1 guy said this;

'When client pops a 8M digital photo into their content, even if we’ve restricted its physical display dims via the code so that it doesn’t blow out the layout, that image has various critical effects. 1) It loads slowly 2) It eats both server disk space & bandwidth 3) It reduces the quality of the user experience overall'


obviously, I don't want to risk any of this happening, and as I have to change all of the pixels heights and widths anyway (using preview), changing the dpi is no extra bother, so am still confused.....
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
DPI has, again, nothing to do with the comment you posted from the article. This guy was talking about, for example, uploading and using a 1000x500 image and then using the HTML or CSS code to display it as a 250x125 image. Thus, he uploaded the big image, then uses code to make it appear smaller. I hope this explanation is clear :)

If you want, you can change the DPI when you change the dimensions, but it is not at all necessary because it has no effect on how the image is displayed on your website.
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
DPI does not, no. But using unresized pictures in their original dimensions does, yes. That's why it's bad practice to not resize pictures to the dimensions they will be displayed in on the website. So I would recommend you resize all the pictures to the required dimensions but leave the DPI (to save you a little work).
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
thank you

just to clarify;

so when I am resizing images using preview as my web guys said to;

I choose the appropriate size i.e. 370px width /210px height, uncheck 'scale proportionally' (otherwise it doesn't let me change it), leave 'resample image' checked and just go with whatever resolution (ppi) appears, whether it be 304.8, 254 or 72 etc!

So this process is correct? and one that is 304.8 will not make the page load any slower than one that is 72? Sorry to be thick but am a bit new to this!

ps. really really appreciate your help (both of you)
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
sorry me again,

am just reading up on all of this and this article;
http://www.techsoup.org/learningcenter/software/page6045.cfm

states;

'Finally, Windows allows a monitor to display a maximum screen resolution of 72 PPI, so there's no point in saving an image at more than 72 PPI; doing so will only cause the image to load slower without giving the visitor any increase in quality. And because Web graphics generally have low PPI counts, they will probably blurry or fuzzy if you attempt to print them.'


am still confused!
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
Hm, you said the image proportions need to be changed to? That makes it a bit more complicated, unfortunately. If you just resize the image and change proportions, the image will be squished or stretched. You can try it out to see the effect (but don't save ;) ). You'll probably need to crop the image to the required dimensions before resizing it in order to not stretch it.

Other than that, the process is right. DPI has no influence on how fast the page loads since it's only about pixels and an image at 100x200 with a DPI of 72 only has 100x200=20 000 pixels, just like an image at 100x200 with a DPI of 300 only has 100x200=20 000 pixels.

'Finally, Windows allows a monitor to display a maximum screen resolution of 72 PPI, so there's no point in saving an image at more than 72 PPI; doing so will only cause the image to load slower without giving the visitor any increase in quality. And because Web graphics generally have low PPI counts, they will probably blurry or fuzzy if you attempt to print them.'
PPI is not DPI and DPI really does not affect how images are displayed on websites or how fast they load.
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
PPI is not DPI and DPI really does not affect how images are displayed on websites or how fast they load.
one minute I think I've understood it, then another twist comes! I thought that is was ppi, because it is pixels per inch in preview....so dpi doesn't affect the speed but does ppi?

Sorry!

am wondering whether I should just set everything to 72 and be done with it!

ps. after resizing the images look fine, so until one looks weird I won't worry about any stretching etc as have a headache as it is!
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
Sorry, there are so many aspects to it that it's sometimes confusing to me as well :eek:
Let's try again:

DPI: affects how big images appear when printed and has absolutely no effect on how they are displayed on websites or, for that matter, on any monitor.
PPI: affects how big images appear on monitors but you can't change that since the monitor you view the picture on has a set number of pixles per inch determined by the resolution and the physical size. A monitor will always display a pixel in an image as one physical pixel (unless you zoom in etc.).

The labelling in Preview is a little confusing yes, but it does indeed change the DPI used for printing. You can test it by changing the value for any image. You'll see that the pixel dimensions as well as the image size will remain unchanged.
 

EmmaLouise

macrumors member
Original poster
Aug 2, 2010
33
0
Andalucia, Spain
this stuff isn't easy is it!

so to clarify, after changing the width/height, I'll just leave the resolution at whatever it is and whether it be 304.8, 254 or 72 etc the page will load at the same speed?
 

DoFoT9

macrumors P6
Jun 11, 2007
17,512
33
Singapore
PPI is not DPI and DPI really does not affect how images are displayed on websites or how fast they load.
yeh, you are right. i changed the DPI of an image and the size did not change one bit.

i read through that link - interesting stuff! i am still confused however, why doesnt changing the DPI directly change the resolution of digital media? i understand that it would change it for printed media.
 

ergdegdeg

Moderator emeritus
Oct 13, 2007
1,628
0
this stuff isn't easy is it!

so to clarify, after changing the width/height, I'll just leave the resolution at whatever it is and whether it be 304.8, 254 or 72 etc the page will load at the same speed?
Yes, that's right.

yeh, you are right. i changed the DPI of an image and the size did not change one bit.

i read through that link - interesting stuff! i am still confused however, why doesnt changing the DPI directly change the resolution of digital media? i understand that it would change it for printed media.
I'm not sure how to explain the technical aspects, but that's just what DPI does :eek:. It does not change the number of pixels in an image and, as I said, monitors will always display a "logical" pixel in an image as exactly one "physical" pixel (unless you zoom in etc.).
 

DoFoT9

macrumors P6
Jun 11, 2007
17,512
33
Singapore
I'm not sure how to explain the technical aspects, but that's just what DPI does :eek:. It does not change the number of pixels in an image and, as I said, monitors will always display a "logical" pixel in an image as exactly one "physical" pixel (unless you zoom in etc.).
understood. DPI = hard copies! :D
 

Similar threads

Register on MacRumors! This sidebar will go away, and you'll see fewer ads.