Skip to content

Commit db22d95

Browse files
committed
copy editing
1 parent bf9bb08 commit db22d95

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

_posts/2024-09-01-svg-ccc.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ toot_id: 113064123926263617
1414

1515
When using images on the web you've always had to choose between size and quality. This gets particularly pointed when you have one image containing both a photo and crisp lines (for instance text or a diagram). Compressing both of those in the same image will generally either require a large image, or the compression artifacts will become apparent, especially around the graphic component's lines.
1616

17-
For instance, here's the header image for this post, originally a 627kb PNG, compressed to a 21kb jpg (a "0% quality" setting in the app I was using), to exaggerate the effect beyond what you'd ever typically settle on:
17+
For instance, here's the header image for this post, originally a 627kb PNG, maximally compressed down to a 21kb jpg (a "0% quality" setting in the app I was using), to exaggerate the effect beyond what I'd ever typically settle on (I may do a later draft of this with some line-art to make it more obvious):
1818

1919
![SVG: SVG cross-codec-compilation JPG at 0% quality](/assets/img/posts/svg-ccc/0.jpg)
2020

@@ -32,7 +32,7 @@ Now able to compress the photo to my hearts content without messing up the text,
3232

3333
Pretty quickly I even discovered that the image size vs quality tradeoffs were such that you might as well just use an AVIF for the whole thing, rather than the complexity of layering a PNG and AVIF into one file, for comparable quality and size (further below I get into the case for still using an SVG).
3434

35-
Lossless AVIF of the whole file cut it down to to 413kb, a decent savings. But taking it all the way down to "25% quality" you get a 15kb imagem much smaller than jpg of a similar quality setting (51kb), but without the horrendous artifacts it displayed (though on small enough mobile, like the iPhone mini I use, even the jpg might be good enough):
35+
Doing the whole image in one lossless AVIF cut it down to to 413kb, a decent savings. But taking it all the way down to "25% quality" you get a 15kb image, even smaller than a maximally compressed jpg, much less of a similar quality setting (which came out to 51kb), but without the artifacts those displayed (though on small enough mobile, like the iPhone mini I use, even the jpg might be good enough):
3636
JPEG 25% quality:
3737
![SVG: SVG cross-codec-compilation - JPG at 25% quality](/assets/img/posts/svg-ccc/25.jpg)
3838
AVIF 25% quality:

0 commit comments

Comments
 (0)