Image Formats and Codecs

Image quality (particularly important for JPEGs)

For JPEGs in particular, quality is not just a parameter you enter into the encoder, and it is not e.g. a linear estimate of quality. JPG quality values are on an arbitrary scale that is roughly logarithmic; going from 70 -> 80% quality is not the same increase as going from 80 -> 90% quality.

For JPEGs, the higher you go with quality, the less additional visual quality is gained, but a larger filesize increase is gained. For example, moving from 60 -> 70% quality results in fairly little change in filesize but a noticeable improvement in quality; moving from 90% -> 95% quality results in almost no visual improvement but a significant increase in filesize.

For non-art websites, fairly low values like 70-80% are chosen, as a tradeoff between quality and filesize (which will impact your bandwidth costs and page loading times). For an art site, quality is more important, and so I would recommend 90% quality for images that will be viewed at large sizes and 80% for thumbnails of 640x480 or smaller, where the slightly lower visual quality is less noticeable, and where the bandwidth costs are most pronounced due to the large number of such images on a given page.

In addition to the quality parameter, JPEGs also have chroma subsampling, which reduces the range of colours in an image to reduce filesize. In most web applications, this is fine and frequently is not noticeable or significant, but for an art website this is not a good thing. By default it is normally set to 4:2:0, which reduces colour ranges somewhat; you want to set this to 4:4:4 for the purposes of an art website, which disables chroma subsampling.

Image encoders

Taking JPEGs as an example, a JPEG is not a format that is made in one prescribed way; only the result has a standard form. There are several encoders that can save an image as a JPEG file; older encoders tend to run a bit faster, but result in higher filesizes for the same quality than newer encoders.

I would recommend using the MozJPEG encoder, which achieves file sizes comparable to Google's WebP format, with no reduction in quality compared to older JPG encoders or WebP. In addition, for an art website this is even more preferable, as artists are not big fans of WebP (it is not well supported by many art programs, and even some image viewing software). The sharp library has an option for using MozJPEG when saving JPEG images; I highly recommend you use it.