The 42 byte transparent GIF saw ample use in web development a quarter century ago, when it was used to create pixel perfect <table> layouts. Some things have changed for the better.
The 42 byte transparent GIF saw ample use in web development a quarter century ago, when it was used to create pixel perfect <table> layouts. Some things have changed for the better.
The smallest GIF is still useful because it is the smallest possible valid favicon. This means you can stuff it into a data: URI to prevent useless requests showing up when you are working on something:
If you're just wanting to shut the request up and aren't actually trying to display a certain favicon you can do:
With the bonus you've probably already remembered how to reconstruct this on demand just by reading this comment. It is "invalid" data but so is your example on Safari and Firefox instead of Chromium based browsers. It doesn't matter as much because that problem is local and silent in the logs, unlike the request.Thanks! I’m pretty sure I tried this ages ago and it didn’t work at the time, but I tried this again now and it does the job.
The key is to keep up through "data:" since any shorter (even just dropping the ":") and it gets treated a relative link instead.
You can also make an actually useful and readable SVG favicon this way:
Good to know! My goal is simply to stop a 404 popping up during development in the simplest way possible, so the smallest amount of code is best for me.
A use case: https://news.ycombinator.com/s.gif (43 bytes) (use for comment indentation)
It's kinda cool than HN looks OK even in simple browsers like Dillo:
<https://imgur.com/a/Seu8rYT>
However it's pretty bad on narrow screens. I wish there was some progressive enhancement via modern CSS, or at least just dark mode.