Jimmy T Loc: Virginia

I have been asked to provide images for our church’s website. The church webmaster and I are new we are both learning as we go. I shoot a Canon 5DIV, RAW, read large files. After watching Youtube videos by Tony, Jared, etc. I have the process down. However, what I need to know is what size files will the webmaster of our church need for a decent looking photo to display (full screen) on a 27” monitor? I process the RAW files and save them as JPG in either Lightroom 6 (standalone) or PhotoScape X Pro. The file sizes are still pretty large. Next I batch process the desired Jpg files to reduce their size using PhotoScape X Pro by: selecting – Resize Long Edge (PX) 1000, and select the following: Image Format Original, Jpg Quality 100%, then Check - Maintain Metadata Information, Check - Preserve File Data, Check DPI – 300DPI Printer Resolution. Finally I “Save as______.JPG” with a “Batch File designation.
When I follow the above process I usually get files in the 400 to 800KB file size depending on how much I have cropped, etc. When I view these files on my 27” monitor they look pretty good to me. I would just like to establish a standard to go by for our church website. Thanks for your knowledgeable input, Jimmy T. Sends P.S.: Don’t you just Love this photography stuff!!!

AzPicLady Loc: Behind the camera!

I'm watching for replies, as I also need to know this.

burkphoto Loc: High Point, NC

Web resolution defaults to 72 dpi. 300 is an ancient standard of the graphic arts world for color separations.

The thing is, monitor sizes and screen resolutions vary! Whether 21, 24, 32, or any size in inches, 16:9 aspect ratio monitors work fine with 1920x1080 pixels when displaying images “full screen”. Web software scales down larger images nicely. Also, web images need to be small for slow connections and fast display. Compression settings of 66-75% quality, or Photoshop 8 on its 12-Point scale, or at least 10:1, are common.

Be sure NEVER to use the Adobe RGB profile for web images. The standard ICC profile used on the Internet is sRGB, because the vast majority of monitors use that color space (and can display only 60-80% of Adobe RGB).

CHG_CANON Loc: the Windy City

This post was written to help with these types of questions and includes examples for multiple software to accomplish a target file size and pixel resolution:

http://www.uglyhedgehog.com/t-512745-1.html

The resizing work can be done entirely within your Lightroom software from RAW source to website-ready JPEGs. If not done already, in the Library module you select all the images being exported from LR to run the processing "in batch".

warrior Loc: Paso Robles CA

Guided in Elements has a very good resizing tool.

TheDman Loc: USA

There is no such thing as "web resolution". Dpi is irrelevant to the web. The photos could be 1 dpi or 9,999 dpi and it would make no difference.

Longshadow Loc: Audubon, PA, United States

amfoto1 Loc: San Jose, Calif. USA

We need to know the resolution of that 27" monitor... and if it's actually set to use the native resolution.

27" is the diagonal measure... it doesn't tell us the height and width, which can vary depending upon the aspect ratio. The exact dimensions will be in pixels.

For example, a typical "16:9 wide screen" 27" monitor has a native resolution of 1920 x 1080 pixels. In which case, that would be the size to shoot for. HOWEVER, you have to crop the image to the correct aspect ratio, too... not just change it's size or it is likely to end up distorted. Your camera is probably set to 3:2 aspect ratio (it may have means of setting to 16:9). Note: You should check the specific screen in question... both it's aspect ratio and native resolution AND that it's actually set to use that native resolution.

Save as an sRGB 8-bit JPEG with moderate compression for the most reasonably sized files that will load quickly when people view the website.

EDIT: 72 pixel "web resolution" is OLD SCHOOL. I think the dinosaurs and cave men (okay, cave people to be totally PC) used that with their 256 color CRTs and Apple II computers.

Most monitors today are closer to 100 pixels per inch, so that's what you should shoot for. (Some "4K" and "5K" have even higher resolution than that, but folks also have both larger and smaller screens where they'll viewing websites... there's no way to perfectly match them all.)

BebuLamar

Depending the 27" monitor resolution. If it's a typical one of 1920x1080 then you only need that size of image to display full screen at full quality. If it's one of those 4K screen then you would need 3840x2160 image to make use the entire screen. In both case it's much smaller size than what you camera can produce.
I made the assuming of 27" monitor as I know they are only available in either 16:9 or 16:10 aspect ratio.

rgrenaderphoto Loc: Hollywood, CA

burkphoto Loc: High Point, NC

Technically, that’s right. But nonetheless, the default res of JPEGS is 72 dpi. I agree, it IS meaningless, unless doing layout for pre-press makeready. In that specific case, EXIF resolution headers control how an image “flows” onto a page in page layout software. It tells that software “how big to make the pixels.” In that case, the usual reference is 300, not 72.

Bill_de Loc: US

Find the dimensions of the screen in pixels and produce your images to match. That's probably the best way to do wallpaper on your computer monitor, rather than clicking the fill screen option.

--

raymondh Loc: Walker, MI

I missed the link the 1st time thru & went back to review it. What an Excellent job you did with that post!
A couple of questions:
1. In displaying an image on the new 4D TV's, would converting a raw file to 3840 pixels on the long side produce a sharper image?
2. I share shots with the school / parents at different sporting events and am of the impression that the actual file size would have an impact on the viewed image depending on the device. A 100kb file might look fine on a smart phone but maybe not so good on a standard computer monitor. I will generally crop shots to fit the action so they could be 1x1, 3x2 etc.. Might there be a 'catch-all' file size that would fit the bill? ( I haven't got past using DPP-4
)

Gitchigumi Loc: Wake Forest, NC

👍🤓👍 Thank you for such an informative and thorough article. It's one I will review again!

Xclaim Agency Loc: Saint Petersburg, FL

Hi Jimmy,

As a professional web developer for over 24 years, I can tell you that most of the responses you have received so far are technically correct answers to your question and very useful with regard to sizing and/or re-sampling images for the web.

However, you stated you are providing photos for your church webmaster. Again, as a web developer, we always appreciate receiving the highest resolution photos available to place on a website. Hi-rez photos give us enough to 'play with' when making decisions on placement on a web page.

We shoot nearly all of the photos we place on our clients' websites and we always shoot at the highest rez settings (Sony Nex-7, Canon 5D Mark II, and of course iPhones) and resize / re-sample to 72 dpi as needed with Photoshop / Lightroom or web development platform image tools when placing the image on a web page.

Nothing is more frustrating than getting a 72 dpi image from a well meaning client (that needs to be made larger as a 72 dpi image pixelates very quickly) when you need to make it larger to ‘fit in’ with the web page content (copy, graphical design elements, photo animations, other photos, etc.)

So, unless your church webmaster doesn't know how to resize / re-sample images for the web (unlikely), let THEM decide how best to use the photo and give them enough rez to work with.

Of course, if your church Webmaster is learning too, simply resample the image to 72 dpi for them but keep it big so they can resize / crop it as needed to ‘fit’ on the web page which is quite easy.

(-;

JP | XclaimAgency.com