72 DPI or 300 DPI - Which Is Better For Web And Print Both?

[WPgeek]

Firstly, I know this is a long post, but it was necessary.

I am making a website where images will be available on web, but they can also be saved by users and printed. So I was wondering how much DPI should I choose.

I decided to google it out. But I am super confused right now, because I am getting completely different answers to this question.

Use Case:

- Adobe photoshop file (.psd)

- High resolution photograph

- 1000 px by 1000 px

- Saved as .jpg

- Upload to website as well (file size not an issue)

- Photo can be saved via website and printed

There are 4 different websites I found giving me 4 different answers.

Website 1: 300 DPI

Print - 72 DPI < 300 DPI

URL: http://www.vsellis.com/understanding-dpi-resolution-and-print-vs-web-images/

"Print: 300dpi is standard, sometimes 150 is acceptable but never lower, you may go higher for some situations."

With examples of 300dpi and 72dpi.

Website 2: 72 DPI

Web - 72 DPI = 300 DPI

Print - 72 DPI > 300 DPI

URL: https://daraskolnick.com/image-dpi-web/

This author shows an example of how 72 DPI and 300 DPI look when printed. And guess what, the 72 DPI image looks bigger. How???

Please search for:

"Remember the three images I showed you above with different DPI values that look exactly the same on the web? Here’s what they’d look like printed:"

72 DPI - https://daraskolnick.com/daraskolnick/wp-content/uploads/2015/03/72-231x300.png

300 DPI - https://daraskolnick.com/daraskolnick/wp-content/uploads/2015/03/300-232x300.jpg

Website 3: 300 DPI

Print - 72 DPI < 300 DPI

"300 DPI is usually a good rule of thumb."

URL: https://graphicdesign.stackexchange.com/questions/95/what-dpi-should-be-used-for-what-situations

Website 4: 72 DPI

412 x 324 pixels, 7 dpi, prints 58 x 46 inches

412 x 324 pixels, 72 dpi, prints 5.7 x 4.5 inches

412 x 324 pixels, 720 dpi, prints 0.57 x 0.45 inches

URL: http://www.scantips.com/no72dpi.html

Sorry, but I don't understand what is going on here. Someone please care to explain??

Thanks in advance!

PS. Researching about this confused me even more. Haha. 😱😁

[jrhoffman75]

DPI is Dots per inch.

For a given image size in pixels the smaller the dots per inch number the larger the image will print since there are fewer dots required to fill out the inch of print.

But, the lower the quality becasue the dots are larger.

DPI is meaningless for web use.

[RobertTheFat]

---

@jrhoffman75 wrote:

DPI is Dots per inch.

... 

DPI is meaningless for web use.

---

Well ... sort of. When you're preparing a picture for the Web, you first decide how large (in inches or mm) the picture is ever likely to be displayed. Then you make sure that you have enough pixels, in both the x and y dimensions, to cover that area while matching the display monitor pixel-for-pixel at the highest resolution you're ever likely to encounter. That ensures that the display system never has to interpolate, which could degrade image quality significantly. So DPI isn't really meaningless, but it enters the calculation only indirectly.

[jrhoffman75]

Hi Bob - I'm not sure I understand.

Below are two screen shots. One was exported from Lightroom at 20DPI and the other at 300. Opened in Windows

7 Picture view and enlarged to full screem (1200x1600 monitor).

Images look identical to me.

20 DPI

300 DPI

[RobertTheFat]

---

@jrhoffman75 wrote:

Hi Bob - I'm not sure I understand.

Below are two screen shots. One was exported from Lightroom at 20DPI and the other at 300. Opened in Windows

7 Picture view and enlarged to full screem (1200x1600 monitor).

Images look identical to me.

20 DPI

300 DPI

---

I don't have any trouble seeing the difference, and my eyes are at least as old as yours. But there are enough variables that it's hard to draw many conclusions. I'm looking at a moderately high-resolution monitor on an ancient computer running Windows Server 2003, but the browser (IE 11) is running on a Windows 10 laptop to which I'm logged in remotely. The laptop has a very high-res display, but the remote login probably renders that irrelevant.

[ebiggs1]

There are no dot per inch or DPI unless you print the picture.  Only printers have DPI.  The matter is only made more confusing by LR and PS adding the DPI setting for export.

[ebiggs1]

This web site is correct:  Web site #4

"We still frequently hear the very bad advice: "Computer video screens show images at 72 dpi, so scan all your images for the screen at 72 dpi". This is incredibly wrong; it simply doesn't work that way.

Regardless what you may have heard almost everywhere, there is no purpose or reason for 72 dpi images on computer video screens or web pages. As a concept, 72 dpi is simply a false notion. It is a myth. It is NOT how video systems work, and it is detrimental to understanding how things really do work."

[Waddizzle]

---

@ebiggs1 wrote:

This web site is correct:  Web site #4

"We still frequently hear the very bad advice: "Computer video screens show images at 72 dpi, so scan all your images for the screen at 72 dpi". This is incredibly wrong; it simply doesn't work that way.

Regardless what you may have heard almost everywhere, there is no purpose or reason for 72 dpi images on computer video screens or web pages. As a concept, 72 dpi is simply a false notion. It is a myth. It is NOT how video systems work, and it is detrimental to understanding how things really do work."

---

Changes to the DPI of a JPEG changes the default size of how images are displayed in Windows 10 Photos.  The high DPI images do not always fill my 27" display, by default.  I'm using my iPad now, but. I think the resolution of the monitor is the same as what jhoffman cited.  It's druven by a 4 GB graphics card.

[ebiggs1]

Believe what you want.  Most people do but they are wrong about dpi.

[TCampbell]

PPI and DPI confuse a lot of people -- so you're not alone.  Ultimately what you _really_ have is some image resolution.

DPI and PPI both refer to a pixel density and the "PI" stands for "Per Inch".  The "D" in DPI is for "dots" and refers to printers (which paint dots onto the photo paper) and the "P" in PPI is for "pixels" and refers to images displayed on monitors or projection screens.

The really important detail that you may be missing is that when a DPI or PPI is applied to an image... absolutely nothing about that image changes.  It's a meta-data tag.  Images have lots of meta-data tags such as the date & time that it was made, the equipment used, the exposure settings, and so on.  If you added copyright info "Copyright 2017 by Me" to the meta-data tag then you wouldn't really expect the image to look different just because you added meta-data. It's not quite that extreme beause it turns out that sometimes computer software will do something with the image based on the data it sees in meta-data regarding the pixel density -- sometimes... not always.

If I have an image which is 900 x 600 pixels then as long as the monitor has a resolution greater than 900 x 600 (and it'd be hard to find a monitor monitor with resolution that low) then the image is going to be displayed as 1 pixel of image is 1 pixel on the monitor.   ...maybe.

I have a 5k display on one of my computers.  It's native resolution is 5120 x 2880.  That's pretty big.  But this creates a problem if the monitor display some things in native resolution... they're too small.  So the computer scales everything to look good, but apps that want to take advantage of the native resolution can.  BTW, the pixel density on this montior is 218 pixels per inch.

I have another display with a native resolution that happens to be precisely half of my 5k display.  It's 2560 x 1440 and it's density is 109 PPI.

So assuming no scaling is going on (which isn't necessarily a safe assumption) then if I wanted an image to appear as a 4" x 6" image on the display then the image needs to be resampled to 436 x 654.

I honestly don't worry too much about DPI or PPI becasue it's essentially some meta-data tagged to the data not normally displayed in an image (like EXIF data) and programs can choose to use it or ignore it.  Worse... even if programs don't choose to ignore it, the fact that there is so much variation on the pixel density of various displays means the only time your images are going to show up at your intended size is when you happen to get lucky because the end user has a display that precisely matches the specs.