A site has about 85 detailed illustrations of a neighborhood (two sets in total - one illustration has a white stroke so user can tell its highlighted on hover).
We are trying to determine the best way to serve these illustrations so that we don't lose much quality, keep an engaging experience, yet also be mindful of site performance and speed (only concerned about desktop and tablet).
A few questions:
- Should we export the vector file as a PNG or a JPG?
- For 85 illustrations (actually, 170 in total) what would be a good target kilobyte size for each illustration to maintain site performance?
- Are there any recommended steps we can take in the codebase to increase performance?