The Best Image Size To Upload for Photography Websites

We receive awesome questions all the time, and previously we were highlighting a bunch of the questions in one article at a time.  But we decided to change things up and share one at a time. On to the latest question...

My burning question is about how to determine a smart size and resolution for the images we upload onto the Imagely sites. Should the images I use for featured images, backgrounds, blog posts, and galleries all be uploaded at a same optimum size? Or are there different recommended minimum and maximum sizes for different uses?

On my old [old!] site, my media center was a mess of duplicates of different sizes, and I wasted hours on setting custom dimensions. Please point me to a set of best practices for uploads into the NexGen plugins.

When it comes to image sizes it's less important as to what theme or plugin you're using and more important as to what your server is.

The Best Image Size To Upload for Photography Websites

For example, if you are on a shared hosting server then it's more likely that large image sizes will slow your site down. So on shared hosting, going with a small image size is important, if not essential.

But if you're on a quality server, like a VPS, a cloud server or a dedicated server, then larger images sizes should be ok.

Here is what we recommend displaying on the front end.

  • Shared Hosting: 1000px longest max
  • Cloud Hosting: 1400px longest max
  • VPS Hosting: 1600px longest max
  • Dedicated Hosting: 2200 longest max

As mentioned, these don't matter for any theme you're using. However, we want to talk about something important for plugins.

The majority of WordPress gallery plugins rely on the WordPress media library and the core functions of WordPress. While this is a nice thing, it's not ideal for photographers trying to sell their work.

The reason is that with the media library you have to upload your image extremely large and let WordPress resize it down. The sizes are designated by the theme you're using and any plugins with image functions. This means that you will likely have a lot of image duplication at various sizes, and potentially calling multiple images on the front end.

The better way is how NextGEN Gallery does it, using the backup and resize method.  NextGEN Gallery has the ability to backup your original upload and then resize the image for front end display. That means you can upload a full size (not scaled down) 300DPI image And then the plugin will safely secure and back it up. It will then make resized copies as needed for front end display. You can also specify your preferred front end size. The best part of this method is when selling an image, you're always selling based on the original backed up image. This is essential for digital downloads and for the automated print fulfillment in the works.

We hope that this clears up some things. Stop overthinking image sizes, and keep it simple. If you want a more complex answer to this question, listen to this podcast episode.

Share this with other photographers

This Post Has 8 Comments

  1. Does NextGEN support any Retina displays? Such as 1.5x, 2x and 3x? If not, is that on the roadmap to fix?

    1. NextGEN Plus and Pro will automate retina by having Resize on Upload & Backup Originals turned on.

      1. So far, I haven’t seen how Resize on Upload & Backup Originals has made any difference to my image previews– I’m waiting to hear back on a ticket I opened about that. But regarding your recommended sizes, do those take Retina into account, or should we double them for that purpose?

        1. If you have the settings on and then look at your image thumbnails on a retina screen versus a standard screen you’ll notice a pretty big difference.

          The retina feature will automatically create the 2x image, so all you need to do is upload your image at a decent size, and then NextGEN Gallery will create the thumbnail sizes appropriately.

  2. Most web-optimizer apps offer an option for quality. I usually set it on 80%, but it’s just a random choice. Do you have any suggestion on this topic also?

    1. You’ll need to test to determine which settings you prefer for your own website. There is no one answer.

  3. Eu uso o NextGEN Pro, e percebo que ele realmente faz o redimensionamento, exibindo assim uma foto bem menor no front end, e mantendo um backup do arquivo original, sendo perfeito para downloads digitais.

    Eu tenho o imagify, e portanto, minha pergunta é: O que ele faz não é basicamente o que o NextGEN já faz?

    1. Imagify compresses the image displayed on the front end to save space and make your images load faster. But it does it in a way that doesn’t degrade the visual quality of the images.

Leave a Reply

Close Menu
[i]
[i]