Hi Tom,
Remember how I told you in another thread that a 24-bit RGB color image requires 3 bytes per pixel and 1024 bytes = 1KB? Well, that means you need 3KB for every 1000 pixels in an image…convenient numbers to work with.
Now, you need a file size under 600KB? So, that means your images needs to have no more than 600KB x (1000 pixels/3KB) or 200,000 pixels. Doing a square root in the mind isn’t so easily done, but a calculator would tell you that equates to 447 pixels on each side. So, an image of 447×447 pixels saved in an uncompressed file format would be about 600KB in size. In truth, it is 585KB…still pretty darn close.
So, where do you go from there? Well, actually you never had to go there at all since as Cybernetic Nomad suggested, the Image Size dialog will do the math for you. I’m sure you’ve already been there, as you referred to the "locked" dimensions that you unlocked. I suspect you unlocked them by checking the "Resample Image" box, giving Photoshop "permission" to adjust the number of actual pixels in your image so that you can reach your goal on the file size. To answer your question about maitaining proportionate scaling, you need to additionally checkk the Constrain Proportions box. With both options checked, now enter a new Pixel Dimensions Width of 447 pixels. Upon doing so, you will see that the Height changes proportionately to 465 px. Notice too that the file size is then shown as "608.8K (was 6.47M)". You wanted 600KB? Knock off a few more px on the width to 444 and with an adjusted height of 462 px you’ll have a file size of 600.6KB…good enough! 🙂
Now, regarding a good size image for web use? Something on the order of that final size you’ve got is pretty good…not too small, not too big. But, it may be too small for your personal preferences and your objective in what you’re presenting. If so, don’t be afraid to go up in size, but keep in mind that some folks still may be using smallish monitors. I’ve seen some guidance that you should assume nothing larger than an 800×600-pixel display setting is in use by those viewing your web pages, but that is very conservative and I personally think 1024×768 is sufficiently small. Allowing for browser toolbars, footers, other page components, etc., keeping your image to something on the order of 640×480 pixels will often work well.
Since your image is nearly square, even a 640×640 image wouldn’t be too out of place on the web, so go back and change your image height (the larger dimension) to 640 px, yielding a 615 px width and….Oops!…a "whopping" 1.13MB file size. Yeah, oh well!
Seriously, that size is more than manageable, because what we are looking at is the uncompressed file size if you were to save the image in TIF, BMP, or other lossless formats. But, as you probably know, most web-based images are in a compressed format such as JPEG for full-color images or GIF for images requiring no more than a 256-color depth. Well, by the time you save your file as a JPEG, even at the highest quality setting of 12, your file size will be reduced from 1.13MB to around 230KB…about 5:1, but varying with the actual color content of your image. Drop the quality to 9, which will still provide a very good image quality for a monitor-only presentation, and your file is now about 85KB in size!
So, as you see, while the uncompressed pixels can be adjusted in your image dimensions to meet your file size needs, you may also find that if you must have a larger file, the JPEG compression itself will often pull you well under the maximum file size limts you are adhering to.
As you work more with the Image Size dialog, you will find it is quite a handy calculator for seeing the interrelationship between image sizes in pixels versus file sizes.
Now, did you notice how I never discussed a suitable pixels/inch value for an image to be used on the web? That’s because the Document Size options are irrelevant to any image being viewed on a monitor. If you are viewing at image at a 100% scale factor (the 33.3% value you saw was the current image magnification in Photoshop), then 1 pixel in your image will map to 1 pixel of your monitor display. On screen, an image could look relatively large and pleasing, but when you print it at the common 300 pixels/inch resolution, you will find the image rather tiny in comparison because you’ve gone from a 1:1 to a 300:1 viewing ratio. And the uncompressed file size of a photo-quality print? Just play with the Image Size dialog and learn! 🙂
Regards,
Daryl
