Photo Resolution?

found these unused words:

What is the min/max recommended resolution for photos that will be used on a Web site?

Thanks

Duke

Rather depends upon how the image is used! Certainly not larger than the amount of space within the web page that you are setting aside for it!

Smaller will simply ‘sample up’ and produce jaggies’.

The ‘on the fly’ resampling for oversized images is rather poor in most browsers.

Better to put up a small or mid size and a link to -=another=- ‘full size’ than force display ‘resample’.

All in all, use a bit of pre-planning and you’ll have crisp, effective images.

wrote:

What is the min/max recommended resolution for photos that will be used on a Web site?

The resolution (in pixels per inch) is irrelevant for web images. Browsers do not read or use that information. The only thing that is relevant is the physical size in pixels.

—
Johan W. Elzenga, Editor/Photographer, www.johanfoto.com

On Wed, 15 Dec 2010 12:31:16 -0800, Sir F. A. Rien
wrote:

found these unused words:

What is the min/max recommended resolution for photos that will be used on a Web site?

Thanks

Duke

Rather depends upon how the image is used! Certainly not larger than the amount of space within the web page that you are setting aside for it!
Smaller will simply ‘sample up’ and produce jaggies’.

The ‘on the fly’ resampling for oversized images is rather poor in most browsers.

Better to put up a small or mid size and a link to -=another=- ‘full size’ than force display ‘resample’.

All in all, use a bit of pre-planning and you’ll have crisp, effective images.

you have to ask yourself, what is i for. Is it purely for the other person to look at, or for them to print out in photo form.

the smaller is it the quicker it will load.

a photo say of family will invariably be with 100 others, thats a lot of photos and bandwidth, you may be unlimited bandwith on the internet but the poor old gran who you are trying to show may not be. Another consideration. I personally put then on at 640 x 480 x 72dpi but a using code to enlarge them from a thumbnail

Duke,

Google "common screen resolution"; and narrow your search to Past Year; there is much info from web developers about what size monitors (screen rez) are being used to display their pages. Looks like the most common is still 1024 (pixels wide) and 1280 is becoming common. Note that the screen rez numbers are the entire screen; embedded web page photos must be smaller to account for browser boarders, bars, etc. If I had to answer, I think 600×800 photos is currently the best (safe) size for a web page – fits on nearly everyone’s monitor and still big enough for "snaps" details to be seen.

Recent (IE) browsers have an auto size image to fit browser window function – "enable automatic image resizing" can be turned on/off in IE Options > Advanced Tab >Multimedia. I don’t like it on, but the default is On. Basically, this solves the problem of having to guess the largest size that can be displayed on the viewer’s Internet browser without having to scroll.

As another responder mentioned, the thumbnail link to the full size image is one of the better methods to display photos on a web page [main page loads faster with thumbnails of a picture(s) instead of the full size photo(s)]. Or just a word link My Back Yard. This way you can control the layout of your web page(s) more predictably having thumbnails (or text) a stable size. Thumbnails don’t require a mastery of HTML, just make a very small copy (80×100 pixels for example) of your original image; don’t worry about maintaining the "aspect ratio" of the thumbnail. Place the thumbnail on your web page and the original (full size) image in your web and/or on the Internet/Intranet. Select the thumbnail and create a shortcut to the full size image. Google "create an image link" if needed.

– Kele

——
wrote:
What is the min/max recommended resolution for photos that will be used on a Web site?

Thanks

Duke

wrote:

What is the min/max recommended resolution for photos that will be used on a Web site?

Thanks

For WEB you may set to whatever acceptable to you and your viewer, and of course for whatever you after. Example

– Regular web user, I would would keep the file size small for speed, and quality would be acceptable (to you and your users)

– For your clients or requiring the max quality then go for whatever max your host allowing. Example for my clients, around 2-3M would be more than what most of them need. And since my account only allow my to upload up to 10M max, so if it’s larger than 10M (like 20-80M for example) then I have to go different route.

I haven’t done web page for ages, but years ago with older Photoshop and most people were still using 5.6KB/s modem I usually set to around 75-PPI and Quality would be around 80-90% (older Photosop used 0-100% and newer use 1-12 Quality).

Johan W. Elzenga wrote:

wrote:

What is the min/max recommended resolution for photos that will be used on a Web site?

The resolution (in pixels per inch) is irrelevant for web images. Browsers do not read or use that information. The only thing that is relevant is the physical size in pixels.

It doesn’t matter what browser uses or not use, every single image requires 3 values

H x W + R (R = some program calls Resolution but we understand as PPI). Besides that QUALITY is the viewing value.

Similar to VIDEO, it has more than W x H, but also BriRate, FrameRate (and some waco codec for different thing).

Joel wrote:

Johan W. Elzenga wrote:

wrote:

What is the min/max recommended resolution for photos that will be used on a Web site?

The resolution (in pixels per inch) is irrelevant for web images. Browsers do not read or use that information. The only thing that is relevant is the physical size in pixels.

It doesn’t matter what browser uses or not use, every single image requires 3 values

H x W + R (R = some program calls Resolution but we understand as PPI). Besides that QUALITY is the viewing value.

True. My point was that many people believe R should be a certain value. You often read it should be 72 ppi or 96 ppi. That is false. R can be any value you want. Browsers ignore this value as it is for printing only.

—
Johan W. Elzenga, Editor/Photographer, www.johanfoto.com

On Sun, 19 Dec 2010 09:44:01 -1000, "Kele"
wrote:

Place the thumbnail on
your web page and the original (full size) image in your web and/or on the Internet/Intranet. Select the thumbnail and create a shortcut to the full size image. Google "create an image link" if needed.
– Kele

Thanks especially for this tip.

Duke

"Kele" wrote:

Duke,

Google "common screen resolution"; and narrow your search to Past Year; there is much info from web developers about what size monitors (screen rez) are being used to display their pages. Looks like the most common is still 1024 (pixels wide) and 1280 is becoming common. Note that the screen rez numbers are the entire screen; embedded web page photos must be smaller to account for browser boarders, bars, etc. If I had to answer, I think 600×800 photos is currently the best (safe) size for a web page – fits on nearly everyone’s monitor and still big enough for "snaps" details to be seen.

Recent (IE) browsers have an auto size image to fit browser window function – "enable automatic image resizing" can be turned on/off in IE Options > Advanced Tab >Multimedia. I don’t like it on, but the default is On. Basically, this solves the problem of having to guess the largest size that can be displayed on the viewer’s Internet browser without having to scroll.

As another responder mentioned, the thumbnail link to the full size image is one of the better methods to display photos on a web page [main page loads faster with thumbnails of a picture(s) instead of the full size photo(s)]. Or just a word link My Back Yard. This way you can control the layout of your web page(s) more predictably having thumbnails (or text) a stable size. Thumbnails don’t require a mastery of HTML, just make a very small copy (80×100 pixels for example) of your original image; don’t worry about maintaining the "aspect ratio" of the thumbnail. Place the thumbnail on your web page and the original (full size) image in your web and/or on the Internet/Intranet. Select the thumbnail and create a shortcut to the full size image. Google "create an image link" if needed.
– Kele

H x W usually have not much to do with web, as most of them should be in table (thumbnail or smaller displaying). In general, most photo should be left alone as original or 3:2 RATIO (or whatever came out of camera)

There is not much sence to change the H x W to fit either CRT or Widescreen monitor/TV, as photo should be more than filling any special screen RATIO.

As I have mention earlier, every single PHOTO/IMAGE has or requires at least 3 values.

H x W x R = no image existing with one of those 3 values missing

Besides those 3 values, you can add other value which is the QUALITY

Johan W. Elzenga wrote:

Joel wrote:

Johan W. Elzenga wrote:

wrote:

What is the min/max recommended resolution for photos that will be used on a Web site?

The resolution (in pixels per inch) is irrelevant for web images. Browsers do not read or use that information. The only thing that is relevant is the physical size in pixels.

It doesn’t matter what browser uses or not use, every single image requires 3 values

H x W + R (R = some program calls Resolution but we understand as PPI). Besides that QUALITY is the viewing value.

True. My point was that many people believe R should be a certain value. You often read it should be 72 ppi or 96 ppi. That is false. R can be any value you want. Browsers ignore this value as it is for printing only.

True! we can say PPI, DPI, LPI (or whatever) could means something and mean NOTHING. Or all 3 values have to depend on each other to form a TRUE VALUE. Example

"1 x 1 x 300-PPI" is smaller value than "600 x 600 x 1-PPI"

Try it, just change the PPI to 1-PPI and lets the program (or you change the value of H & W) then you will see 1-PPI could have the exact same value as whatever PPI may be.

I haven’t done any print test with 1-PPI, but I do believe that the printing value would depend on the total pixel. I could be wrong, but I don’t think the printer will read the EXIF then tell the printer to print as 1-PPI. I sure can test print with my inkjet printer, but it may not work with different printers (?).

Also, I did few poster size 36" x 24" prints (online printing companies) with PPI set to 150-PPI and they all turned out great. Yes, the companies mention 300-PPI and even mentions TIFF, but I uploaded JPG and 1/2 the PPI value they recomment. (I guess they do know how thing works, but don’t have the time and word to answer all questions so they just say 300-PPI).

P.S. I don’t mean to correct you or anyone, just taking a chance to post some extra information.

Joel wrote:

I haven’t done any print test with 1-PPI, but I do believe that the printing value would depend on the total pixel. I could be wrong, but I don’t think the printer will read the EXIF then tell the printer to print as 1-PPI. I sure can test print with my inkjet printer, but it may not work with different printers (?).

It depends on the application that does the printing. In Photoshop you can tell the application to fit the image for a certain page size. Thay means that the effective ppi resolution will be increased or decreased accordingly, so you wouldn’t print with 1 ppi. However, if you uncheck this option, Photoshop will indeed print to a huge size and 1 ppi resolution. You also have to realize the difference between ppi and dpi in this situation. The print will indeed be 1 PIXEL per inch, but the printer will still use it’s own routines to make the print at a much higher resolution in DOTS (read: ink droplets) per inch. It simply cannot produce droplets that are big enough to cover an entire square inch.

—
Johan W. Elzenga, Editor/Photographer, www.johanfoto.com

Johan W. Elzenga found these unused words:

Joel wrote:

I haven’t done any print test with 1-PPI, but I do believe that the printing value would depend on the total pixel. I could be wrong, but I don’t think the printer will read the EXIF then tell the printer to print as 1-PPI. I sure can test print with my inkjet printer, but it may not work with different printers (?).

It depends on the application that does the printing. In Photoshop you can tell the application to fit the image for a certain page size. Thay means that the effective ppi resolution will be increased or decreased accordingly, so you wouldn’t print with 1 ppi. However, if you uncheck this option, Photoshop will indeed print to a huge size and 1 ppi resolution. You also have to realize the difference between ppi and dpi in this situation. The print will indeed be 1 PIXEL per inch, but the printer will still use it’s own routines to make the print at a much higher resolution in DOTS (read: ink droplets) per inch. It simply cannot produce droplets that are big enough to cover an entire square inch.

Years ago with this same debate raging then … I put up a page with six images.

1 ‘dpi’, 100 ‘dpi’, 300 ‘dpi’, 1000 ‘dpi’, 5000 ‘dpi’ and 9999 ‘dpi’

Challenge was to pick which had what!

If you printed the page, all came out as set for the ‘screen’ dpi. You had to find the discrete URL for the image and DL that to have the ‘dpi’ setting make any effect.

Most printers will not print anything larger than the paper size selected without popping up a warning notification. However they will gladly mapp a 9999 ‘dpi’ image to a mess on the page! <G>

simple ‘rule’:

Scanners -=generate=- PPI, printers -=use=- DPI.

Just to clarify… I don’t mean to change the aspect ratio of the original image published to the web. The original image, even if resized, should (normally) maintain its original aspect ratio (height x width), "Constrained (maintain) Proportions" in Photoshop. But the thumbnail that links to the original image can be tailored to any size and proportions. If I want the thumbnails to be 80×80 pixel squares, I can disregard constraining the proportions and make the original rectangle shaped image square, or I can crop the original image to a square and Save-As for my thumbnail. It just depends how I want the thumbnails to appear on the web page, ie: thumbnails will all be 80×80 squares.

The thumbnail is nothing more than an image that links to another web element; a thumbnail doesn’t have to relate in any way to its linked image (element). In other words, I can make thumbnails.jpg of dots (for example) that link to anything:

Red Dot opens
http://www.softpedia.com/screenshots/The-Winter-Scenes-Scree nsaver_1.png (My Back Yard)

Blue Dot opens http://www.irs.gov/pub/irs-pdf/fw4.pdf

etc…

——
"Kele" wrote:

Duke,

As another responder mentioned, the thumbnail link to the full size image is one of the better methods to display photos on a web page [main page loads faster with thumbnails of a picture(s) instead of the full size photo(s)]. Or just a word link My Back Yard. This way you can control the layout of your web page(s) more predictably having thumbnails (or text) a stable size. Thumbnails don’t require a mastery of HTML, just make a very small copy (80×100 pixels for example) of your original image; don’t worry about maintaining the "aspect ratio" of the thumbnail. Place the thumbnail on your web page and the original (full size) image in your web and/or on the Internet/Intranet. Select the thumbnail and create a shortcut to the full size image. Google "create an image link" if needed.

– Kele

——
wrote:
What is the min/max recommended resolution for photos that will be used on a Web site?

Thanks

Duke

Johan W. Elzenga wrote:

Joel wrote:

I haven’t done any print test with 1-PPI, but I do believe that the printing value would depend on the total pixel. I could be wrong, but I don’t think the printer will read the EXIF then tell the printer to print as 1-PPI. I sure can test print with my inkjet printer, but it may not work with different printers (?).

It depends on the application that does the printing. In Photoshop you can tell the application to fit the image for a certain page size. Thay means that the effective ppi resolution will be increased or decreased accordingly, so you wouldn’t print with 1 ppi. However, if you uncheck this option, Photoshop will indeed print to a huge size and 1 ppi resolution. You also have to realize the difference between ppi and dpi in this situation. The print will indeed be 1 PIXEL per inch, but the printer will still use it’s own routines to make the print at a much higher resolution in DOTS (read: ink droplets) per inch. It simply cannot produce droplets that are big enough to cover an entire square inch.

I don’t print directly from Photoshop. Years ago, when printlab was so expensive I used to print my own with inkjet, but now printlab is cheaper than inkjet I have been printing my photos using much more expensive printer (whatever the printlad uses).

In general, I don’t know much about Photoshop and its printing option, but I do believe that most if not all softwares should print whatever TOTAL PIXEL to whatever maximum it can print. IOW, the larger the print size the fewer PPI (lower quality, fewer PPI), and the print won’t be much or any better if …. it’s hard to explain cuz

– I don’t care much what my current inkjet printer can do, but years ago I read some newer generation of inkjet printer can do 1200-2400 DPI (or even more using the macro technology)

– I can’t tell what my newer inkjet printer with 6-ink-cartridge does, but I can the print is much better than the older 4 and 5-ink-cartridge printer.

And I haven’t cared to check the better quality option yet.

About the difference between PPI, DPI, LPI, I do understand what they stand for, but I don’t see how they relate to each other. IOW, my understanging that when viewing we use PPI (Pixel = for monitor), when printing we use DPI (HOT = for printer or ink), and when we PRESS we use LINE (LINE = for press which I haven’t heard anyone mentions it for ages). So to me, even the 3 differrent words have no related to others, but all 3 share the same value.

IOW, if you have more PIXEL (PPI) then the printer can print more DPI and the press can press more LPI.

P.S. Photoshop with UNCHECK option then I don’t have any experience, and thanks for sharing.

"Kele" wrote:

Just to clarify… I don’t mean to change the aspect ratio of the original image published to the web. The original image, even if resized, should (normally) maintain its original aspect ratio (height x width), "Constrained (maintain) Proportions" in Photoshop. But the thumbnail that links to the original image can be tailored to any size and proportions. If I want the thumbnails to be 80×80 pixel squares, I can disregard constraining the proportions and make the original rectangle shaped image square, or I can crop the original image to a square and Save-As for my thumbnail. It just depends how I want the thumbnails to appear on the web page, ie: thumbnails will all be 80×80 squares.

The thumbnail is nothing more than an image that links to another web element; a thumbnail doesn’t have to relate in any way to its linked image (element). In other words, I can make thumbnails.jpg of dots (for example) that link to anything:

Red Dot opens
http://www.softpedia.com/screenshots/The-Winter-Scenes-Scree nsaver_1.png (My Back Yard)

Blue Dot opens http://www.irs.gov/pub/irs-pdf/fw4.pdf

etc…

Well, it depends on your style. Thumbnail can be a LINK, smaller displaying, or it can be actually smaller file with link to the original larger image.

IOW, thumnail with smaller filesize wwith link to larger size for quick diplaying (loading), and smaller thumbnail (with original size) to fit more images to the page.