Q: Sorry if you’ve already answered this somewhere - but how / why do you dither all the images on your site? Do you do them all manually, or do you have some cool pipeline? And was the dithering an aesthetic choice, or also to do with image sizes? I like it btw!
how
i use dithermark! it’s linked in the credits section of my site info page (update: now the colophon page), the webcrafting resources section of my links page (under image tools), and most recently, the first section of my contact page, which i hoped would reduce the number of times1 i get asked about it.
no cool pipeline. i’m more of a drag and dropper than a pro…
Q: Sorry if you’ve already answered this somewhere - but how / why do you dither all the images on your site? Do you do them all manually, or do you have some cool pipeline? And was the dithering an aesthetic choice, or also to do with image sizes? I like it btw!
how
i use dithermark! it’s linked in the credits section of my site info page (update: now the colophon page), the webcrafting resources section of my links page (under image tools), and most recently, the first section of my contact page, which i hoped would reduce the number of times1 i get asked about it.
no cool pipeline. i’m more of a drag and dropper than a programmer.
- resize each image to whatever dimensions i plan to display it at
- drag and drop into dithermark
- usually i use the default settings
- occasionally i’ll change it up and use a different dithering algorithm or color palette (like the 2-3 color palettes i’ve been using for blaugust)
- drag and drop into my site’s local folder
- rename files
- drag and drop into pinga if i remember
- drag and drop the images (and the html files that reference them) into the neocities dashboard when they’re done (or done enough)
dithermark doesn’t do gifs, so the few dithered gifs on my site were made with photoshop’s export for web function. i don’t have access to photoshop anymore, so i’ll have to find another option eventually.
why
i guess i’ve never publicly explained why i like to dither images, but the answers are right there in your question: it’s both. i like the way it looks, and i like when things load fast.
superficial reasons
i prefer crunchy to smooth, square to round, pulp to pulp-free... i like to dither images for the same reason i use pixel fonts and don’t use border-radius in my css: i like the look of sharp, blocky edges. dithering has that crunchy texture i like.
it’s also a really simple way to make images from different sources look like they go together. the shared color palette and texture do a lot to make photos with wildly different lighting and perspective still feel like part of a cohesive whole.
practical reasons
small files load faster than large files. making the images on my site tiny means i can use more of them without my pages taking forever to load. there are something like 1500+ images2 on my site but the whole thing only takes up 0.3% (152.04 MB)3 of the 50 GB storage i get from neocities. if my site keeps growing at a constant rate, it will take 997 years to run out of space.
- for a while people were asking me multiple times per week...
- searching for .png within my site’s folder in file explorer yields 1,627 results right now.
- these numbers are from my neocities dashboard. (also, almost a quarter of that space is used up by a single page with a few videos on it. videos are big! each image barely makes a dent!)