今日已更新 43 条资讯 | 累计 39899 条内容
关于我们

I Ran My Own Favicon Checker Against 10 Sites. All 10 Failed.

lixy 2026年09月05日 23:38 0 次阅读 来源:Dev.to

I maintain a small collection of single-purpose web tools. Last month I built a favicon checker: you type a URL, it reads the icon declarations in the HTML head, probes every referenced file, and also hits /favicon.ico directly, because plenty of software still requests that path without ever reading your HTML. The first thing you should do with any auditing tool is point it at your own stuff. So I did. Ten sites, all built by me, all shipped and verified in browsers I actually use. All ten failed. Not seven out of ten. Ten. Failure one: SVG-only icon sets Every site had a nice crisp favicon.svg and nothing else. Modern browsers request it, render it at any size, everything looks great in Chrome and Firefox. Then something older comes along: a bookmark sidebar, an RSS reader, a corporate proxy portal that lists your link, that one intern running Opera 12. These clients do not parse your <link> tags. They request /favicon.ico and hope. All ten sites returned a 404 for that path. The fix is not glamorous. You need an actual .ico file, ideally with 16, 32, and 48 pixel frames packed inside, plus a PNG for iOS. More on that below. Failure two: no apple-touch-icon Nine of the ten sites had no apple-touch-icon.png . When someone saves such a site to an iOS home screen, Safari does not use your favicon. It takes a screenshot of the page, letterboxes it, and calls that your app icon. If you have ever seen a bookmark that looked like a cropped text paragraph, that is why. The fix is one file and one tag: a 180 by 180 PNG, referenced with <link rel="apple-touch-icon" href="/apple-touch-icon.png"> . Done. No JavaScript, no media queries, no dark mode variants needed. iOS rounds the corners itself. Failure three: the 404 that would not leave This is the one that cost me an evening, so pay attention if any of your sites sit behind Cloudflare. I generated the missing icons, deployed them, and re-ran the checker. Still 404. I deployed again. Still 404. I started doubting my build,

本文内容来源于互联网,版权归原作者所有
查看原文