What is the ideal resolution and pixel dimension of an image before upload?
-
To ensure clarity without consuming too much available space in my blog, what is the ideal resolution and pixel dimension of a jpeg photo before I upload it to my blog?
Blog url: http://alittlebitofanne.wordpress.com/The blog I need help with is: (visible only to logged in users)
-
Resolution 72, because that’s what browsers display. Pixel width depends on which link option you prefer, so see here first:
Uploading and inserting images: the three (plus one) link options
-
Thanks for this! My photos normally come from my iPhoto. They’re all high res (about 2MB each). When I pull them into photoshop for some enhancements, the pixel dimensions are 1935 x 2592 x 72dpi. Isn’t this too big or heavy? I just want to make sure I don’t eat up too much available space in my site that I would have to upgrade for more disk space too soon.
Will manipulating the image settings (after inserting the image into the post) take care of reducing the size of the image? I hope I’m making sense.
Thanks for your time.
-
[i]They’re all high res (about 2MB each). When I pull them into photoshop for some enhancements, the pixel dimensions are 1935 x 2592 x 72dpi. Isn’t this too big or heavy?[/i]
By far too large. Shoot for no wider then about 600 and no heavier than about 100Kb
[i]Will manipulating the image settings (after inserting the image into the post) take care of reducing the size of the image?[/i]
No. Resize and compress them before you upload. Irfanview (a free program) handles this well.
-
Great! Thanks for your help. I appreciate it. I’ll check out that free program, too. Have a great day!
-
@alittlebitofanne:
a) Your concern is quite justified, not only because you don’t want to waste your storage space but also because smaller files means faster loading.
b) Notawoodpecker’s suggested 600px is quite arbitrary. Do you want images that cover the whole width of the post column or not? Do you want them to be clickable or not? If yes, do you want them to link to an attachment page or a larger version of the image alone? Are you talking about art photos that would be better appreciated if viewed large or not? There can be no answer to what the pixel width should be without answers to these (interconnected) questions. -
a) yes, that’s the idea.
b) I actually tried his suggestion. First I converted my pics to only about 150KB, which resulted in a width size of about 300pixels. When I inserted it into my post, it turned out too small for my liking even at full size.I went back to photoshop to increase the size to 600 pixel width, making the size bigger at about 250KB. When I uploaded it into the post, it was exactly the width of the text, which was what I was trying to achieve.
If you check out my most recent post “Handsome Pants” (http://alittlebitofanne.wordpress.com/2012/07/31/handsome-pants/), I still used some pics with a 300 pixel width so I could neatly insert them side by side (though I had to reduce them to 80% in the image settings to achieve my goal).
So my finding is that, I can set images with a 300px width for a small image layout and 600px for full width layouts.
My question still remains, though. Is this a comfortable enough size that it will not to eat up too much of gigabyte space (and faster upload)? Then again, if I want to achieve a certain width presentation, I guess I don’t have much choice. This should do for now.
Thank you, guys, for your quick help!
-
Physical dimensions and file size are not directly related; or at least, they don’t have to be.
If you’re using Irfanview, you Resize (Image > Resize/Resample) the image to whatever dimensions you want first, then compress them to reduce the file size. Compression is done while saving the image with a new name (I always keep the original, unaltered image and save any edited images with a new name).
Under File > Save As, if you select .jpg as the file type, you’ll see a Slider bar towards the upper right labeled “Save Quality”. I usually set that around 70. Your 250Kb image could probably end up less that 75Kb and you’d never see any quality degradation with the naked eye.
Other programs work the same general way, but I’m not familiar with their menus.
-
“Your 250Kb image could probably end up less that 75Kb and you’d never see any quality degradation with the naked eye.”
Thanks for the tip. I’m going to find that Irfanview right now.
-
-
Your suggestion about 600px width is arbitrary—if only for the obvious reason that different wp.com themes are designed to display different maximum image widths.
Please look here for maximum image widths of many themes, including Twenty-Ten which the original poster is using: 640px.
http://wpbtips.wordpress.com/2009/07/23/maximum-image-width/You are correct that px dimensions are not directly related to file size, but I’m not sure why you are giving information to the OP about using Irfanview when she has Photoshop. ?? (sorry, on second reading, I guess you say you don’t have that program.)
To compress an image in Photoshop is a very useful function of that program. She could easily set her image width to 640px first and then adjust the compression of the image to under 100KB without loss of image quality at 72 resolution. Ideally, one should easily be able to compress images for fast loading online to under 50KB.
-
Your suggestion about 600px width is arbitrary—
Yes, it is. That’s why I said shoot for no wider than about 600. Of course that would vary depending on page layout and any number of other factors.
-
from justpi above:
b) Notawoodpecker’s suggested 600px is quite arbitrary. Do you want images that cover the whole width of the post column or not?
Do you want them to be clickable or not? If yes, do you want them to link to an attachment page or a larger version of the image alone?
Are you talking about art photos that would be better appreciated if viewed large or not?
There can be no answer to what the pixel width should be without answers to these (interconnected) questions.
If you want your images to be full width in Twenty Ten, then you want to set your image width in Photohop (under “file” “save for web”) to 640 px. Then adjust the jpeg quality to allow for enough compression to be under 50kb (or at least under 100kb).
As for justpi’s questions, it would be useful to know what your goals are for how you want your photos seen.
-
I went back to photoshop to increase the size to 600 pixel width, making the size bigger at about 250KB. When I uploaded it into the post, it was exactly the width of the text, which was what I was trying to achieve.
[…]
My question still remains, though. Is this a comfortable enough size that it will not to eat up too much of gigabyte space (and faster upload)?Ok let’s clear things up.
1. This kind of photos doesn’t need to be displayed any larger, so your images don’t have to be clickable (see the post I originally linked to).
2. The 600px wide images showed up “exactly the width of the text” because they are wider than that, and when you select the Full-size option the theme automatically downsizes them to maximum allowed.
3. In Twenty Eleven that’s 584px. Assuming you’ll stick to this theme, that’s the ideal pixel width for you when you want full-width images. If you upload images that are wider than 584px, you lose quality, because images downsized by the theme lose some color and sharpness (compare the inserted versions with the originals and notice the differences).
4. Yes, that’s a size that will allow you to upload many thousands of images before running out of space. And at that size you can even skip compressing, because WP does that anyway when you upload images: your 250KB originals have became less than 160KB after uploading.By the way, if you continue with posts like the one you published, your main page will require too much scrolling and will take too long to fully load: you’d better use the read-more tag to truncate the posts.
http://en.support.wordpress.com/splitting-content/more-tag/ -
@justpi:
2. The 600px wide images showed up “exactly the width of the text” because they are wider than that, and when you select the Full-size option the theme automatically downsizes them to maximum allowed.I figured that.
3. In Twenty Eleven that’s 584px. Assuming you’ll stick to this theme, that’s the ideal pixel width for you when you want full-width images. If you upload images that are wider than 584px, you lose quality, because images downsized by the theme lose some color and sharpness (compare the inserted versions with the originals and notice the differences).
Got it. I tried 1Tess’ suggestion to File>Save for Web on some photos. They worked but the images became very low quality. I’ll keep 584px in mind. Thanks.
4. Yes, that’s a size that will allow you to upload many thousands of images before running out of space. “And at that size you can even skip compressing, because WP does that anyway when you upload images” : your 250KB originals have became less than 160KB after uploading.
That’s all I needed to know! : )
By the way, if you continue with posts like the one you published, your main page will require too much scrolling and will take too long to fully load: you’d better use the read-more tag to truncate the posts.
http://en.support.wordpress.com/splitting-content/more-tag/You’re right. I saw option a while back. Should try this. Thanks!
And thanks everyone for all your advise. I’m learning a lot! : )
-
You’re welcome. Note that Tess meant the same kind of advice as my no.3 above, only she thought you’re using 2010 instead of 2011.
- The topic ‘What is the ideal resolution and pixel dimension of an image before upload?’ is closed to new replies.
WordPress.com Forums 