SamC

Max width for uploaded images

Recommended Posts

I was thinking about this field today when uploading a few images. I have it set to 2400, the theory being that it saves space when some uploaded images if untouched could be huge, like raw digital cameras files.

However, I was thinking this could cause rather large problems down the line (larger than storage issues):

1) Screen resolutions going up further so 2400px is not considered large anymore. 
2) The original image is required in order to resize to 3000px in a template.

Seems maybe the most sensible idea is to keep an untouched copy of the original on the server for maximum flexibility in the future.

I'd be interested to hear other peoples thoughts on this.

Share this post


Link to post
Share on other sites

I'd say that this depends entirely on your use case.

For an example, we have a couple of sites with a large amount of pages, where each page potentially holds a very large number of images, and those images tend to be highest possible digital camera quality. If there wasn't a limit in place, the site would get unmanageably large in no time. At the same time we know where and what those images are used for, and for those use cases ~1200px width/height is more than enough.

On the other hand if you know that there won't be a massive amount of images or you have a notable amount of disk space to spend, and you really do need images in 2400px+ sizes, then by all means keep the full versions. In most cases I'd argue that a sensible limit makes sense, but obviously some cases – storing images used for print stuff, very large header images, etc. – demand that you set the limit pretty high, or even leave it off.

Just thinking out loud, really. Probably nothing there that you didn't already know :)

  • Like 4

Share this post


Link to post
Share on other sites

You'd also want to think about memory usage/limits. If someone uploads a 10000-pixel-wide image and you go to resize it for use in your template you could run out of memory. This was one of the reasons for introducing the client-side image resizing which is linked to the max-width/max-height settings.

  • Like 4

Share this post


Link to post
Share on other sites

Thanks for the replies. I had run into some memory issues before I started setting a max-width. It's for the tutorials site I'm working on which are manual screenshots from a 2013 macbook pro at 2750px (ish).

I settled now on:

Max upload size: 3000 (unlikely to ever exceed this anyway).

Image displayed on page: 1200px

Modal: 1800px (on desktop)

Covers a bunch screen sizes (looks great on 2560x1440) and gives some size increase headroom. 4k or 5k I can't test on sadly.

Prob need to use srcset to accomodate mobile users but tbh, this site would suck on a mobile.

Anyway, rambling on.

Share this post


Link to post
Share on other sites
8 hours ago, SamC said:

Prob need to use srcset to accomodate mobile users but tbh, this site would suck on a mobile.

Definitely. One of my pet peeves is desktop-sized images being served to mobile users. Now that browsers have a decent solution for this, there's no excuse not to do things properly.

In our case there are also some useful modules for handling the "tricky" parts :)

  • Like 1

Share this post


Link to post
Share on other sites
3 hours ago, teppo said:

In our case there are also some useful modules for handling the "tricky" parts :)

They look interesting, thanks. I did something along these lines previously:

<?php
  $options = array('quality' => 80, 'cropping' => 'center');
  $small = $image->size(500, 325, $options);
  $medium = $image->size(1000, 650, $options);

  echo "<img sizes='100vw' srcset='{$small->url} 500w, {$medium->url} 1000w' src='$medium->url'>";
?>

After reading a bunch of tutorials, still not sure whether you set the src="" to the smallest available image or the largest one (in case of fallback needed).

Share this post


Link to post
Share on other sites

  • Recently Browsing   0 members

    No registered users viewing this page.