Jessica

Borrowing this screenshot of PAWS from @compactdiscinteractive

Original PNG

~18 KB

Pixel-doubled PNG

~29 KB

Pixel-tripled PNG

~31 KB

SVG with embedded PNG to force image-rendering: pixelated when display > original size

~74 KB

Notes

• These are all forced to be full-width in the cohost box, like they would be if uploaded directly in the normal way
• The SVG, and the original PNG file sizes are based on a version optimised with oxipng -o max --strip safe, which I believe is slightly smaller than the version embedded here
• SVG is optimised with svgo, but there's simply not much it can do about the inefficiency of base64 (that 18 KB PNG is 72,814 bytes in base64 🙈)
• PNG does a better job compressing this image than GIF, so the SVG couldn't be optimised any further
• On my high-DPI display, and in Safari, the SVG looks better-scaled than any of the other three, though of course this is me at 144dpi and dealing with the image being upscaled just slightly
• One technique I haven't explored is clamping the image's size to the original until the image is displayed large enough to make pixelated look nice