Image quality

Discussion in 'Website Creation' started by simplypictorial, Sep 18, 2012.

  1. What are thoughts on image resolution for a website? While I want my images to be sharp I do not want them to take forever to load. Given that not all users have a "high-speed" connection I would like if they could still view my work without having to wait very long and also at the same time without losing integrity of my images. Any and all feedback is appreciated, thanks!
  2. A typical laptop screen is 1280 x 800, an iPad is 1024 x 768. You don't usually want them bigger else they have to download the entire image and then shrink it to fit on the screen.
    Depends on your business. If you're an architect you may want bigger images as you know your client(s) would typically be using bigger monitors & resolution from work. If you're a wedding photographer your client would typically be the bride using an iPad so make it work with the 1280 x 800 or 1024 x 768. Don't worry too much about size, as pictures that small can be sharpened heavily without taking long to download.
  3. If I save my images to fit the iPad size )1280 x 800 or 1024 x 768) what DPI would you save these into help with page loading? 72 DPI? I've been using 120 to ensure the quality but again, my page loads are slower.
  4. [[what DPI would you save these into help with page loading? 72 DPI? I've been using 120 to ensure the quality but again, my page loads are slower.]]
    DPI has nothing to do with displaying images on the screen. The number is meaningless.
    The only thing you need to worry about is pixel dimensions, file size, and color space.
  5. Rob,
    I'm not sure that the DPI is "meaningless." Naturally the the larger the file size means it's of higher quality.
    If I try and load a 11" X 17" 300 DPI image vs. the same size at 72 DPI I'm pretty sure the 72 image will load quicker.
    See so yourself here:
  6. Jason,
    The two images you have on that page are vastly different sizes. DPI has nothing to do with it. Your image on the right is 4032 x 3270 pixels and is 8MB. Your image on the left is 968 x 785 pixels and is 580KB.

    Of course the one on the right loads slower, it's significantly larger! This has nothing to do with DPI. This has to do with the fact that you re-sized the image.
  7. Okay, with that being said, you're saying I should be more concerned with pixel dimension than DPI when saving my images for my website?
  8. For displaying images on a web page, you should only be concerned with pixel dimensions, file size, and color space, as I stated earlier. :)
    More details about dpi here:
  9. I guess I should've been speaking in PPI not DPI. Thanks Rob!
  10. If you wish to make life easy for your website visitors, keep your in-line images small, but larger than thumbnails so as to encourage people to click on them to see a larger version.
  11. I upload pictures at 100 ppi, 6 inches wide. They seem to look better than 72 ppi. Anything bigger would slow things down and of course take pictures into a range where they would be worth stealing.
  12. There is no such thing as a 6" wide photo on the web. 10 different sized monitors at 10 different resolutions will give you 10 different "measurements" of the exact same image on the screen.
    What matters, what ONLY matters, are the pixel dimensions.
  13. There is no such thing as a 6" wide photo on the web.
    Strictly speaking, no, but I have the feeling that my method stops images being shown on screen converted back to 72 ppi and therefore appearing too large to be seen all at once. I don't care whether images appear in final form at exactly 6 inches wide or not, but I do want them to be in proportion to the screen display as a whole.
  14. Spearhead

    Spearhead Moderator

    You have no idea what size screen people are using, what density screen people are using, how they have sized their browser window. As a result, inches are completely and totally meaningless in terms of how it displays. All you can do is say how many pixels in each dimension you have. Any dpi setting is merely telling the system how many pixels you are using, not anything related to inches, and the sooner you stop thinking of inches for digital display, the sooner you will understand what is really going on.
    The reason the image looks better is that you are telling it display an image 600px wide instead of 492px wide.
  15. There is an option for jpeg quality. I suggest a photo size of 900 x 600 or similar, but maintain the 3:2 ratio. In terms of
    jpeg quality, start with 75% see how it displays

Share This Page