With your WideRange Galleries website you will be uploading web-sized JPG image files, not full resolution image files. All you have to do is upload one JPG image at your desired size (see below) and the admin will automatically create all the various smaller thumbnail sizes.
Summary JPG Specs:
- Dimensions: 1800px on the long end (doesn't matter if they're horizontal or vertical images).
- File Sizes: aim for file sizes between about 400kb - 800kb; avoid file sizes larger than 1mb.
- Color Profile: embed sRGB color profile.
What size should I upload my photos?
The short answer: I do 1800px on the long end, or 2400px for panoramas.
Here’s a brief summary of various sizes:
1200px: A bare minimum size for normal screens; could be larger and sharper on retina screens.
1800px: Nice and sharp even on MacBook retina size screen; this is a good size for average laptop, desktop, and iPad screens. Might still look a bit small on large, high-res screens.
2400px: Catered specifically for larger high-res screens such larger laptop screens or large desktop monitors. Not really any need to go larger than this.
Keep in mind that the larger size you choose, the more “future proof” you will be, as I’m sure as time goes on higher resolution monitors will become more of the norm.
Personally I think the sweet spot is 1800px — it’s large enough to display sharply at a good size on retina screens, but not so large that the files could be stolen or printed.
* Note that you should size both your horizontal and vertical images to the same dimension on their long edge. So for example if you choose 1800px as your size, then size your horizontals to 1800px wide, and your verticals to 1800px tall.
* Also note that you do not have to size everything to the same exact size; the website is flexible enough to handle any sizes up to about 2500px. So for example if you want to size your panoramas wider than normal, go ahead and do that.
Watch the file sizes!!!
One consequence of uploading larger image files is that the file size can get out of control. You should try to avoid uploading images that are much over 1mb in size — they will take longer to load and will slow your site down. And besides, it’s just unnecessary.
For 1800px images, you should aim for file sizes of about 400-800kb, but not more than about 1mb.
How to generate your optimized web JPG image files
Any image editing software can resize and export JPG files, but here are directions for Adobe's popular software.
Adobe Lightroom: The easiest way to generate your web jpg files is with Lightroom's Export panel (if you use Lightroom). Their Export panel is super convenient because you can save all your export settings as a Preset, then you can export all subsequent web images using the same quick preset. The key settings to use in the Export panel are:
- File Settings
- Image Format: JPEG
- Quality: 65
- Color Space: sRGB
- Image Sizing
- Resize to Fit: Long Edge
- enter your target pixel size (discussed above)
- Resolution: doesn't matter (you can do 300ppi, 72ppi, or whatever)
- Output Sharpening
- Sharpen For: Screen
- Amount: Standard or Low
You can also configure a small, unobtrusive watermark to automatically be applied to your jpg images, if desired.
Adobe Photoshop: If you don't use Lightroom, Photoshop also has a simple Export panel, at File > Export > Export As. Here are the setting you can use there:
- Format: JPG
- Quality: 6
- Width/Height: enter the target pixel size for whatever is the longest side, then the other dimension will automatically adjust accordingly
- Resample: Bicubic Automatic
- Color Space: select both Convert to sRGB and Embed Color Profile
As always, also be sure to embed the sRGB color profile in your web images so that they will maintain consistent colors on various monitors.