blog.git

blog

~ Personal research notes. blog.sqzer.com
git clone https://github.com/debuman/blog.git
commit de512a179fa3a71df2129ca36072693316f0795c
parent f35d87195d510923b25b863ada4aaae76022daf8
Author: sqzer <110329244+sqzer-x@users.noreply.github.com>
Date: Wed, 23 Sep 2026 14:59:35 +0900

feat: give the site an icon

/favicon.ico and /favicon.svg both answered 404, so every tab showed the browser's
placeholder.

It is the author's portrait, cropped square on the head rather than scaled down from the
4:5 original — a whole portrait at 16px is a smudge, where a head fills the frame and
still reads as a face. The crop is derived from the picture rather than eyeballed: the
subject's top edge and the head's width were found by sampling against the solid
background, and the square is centred on what that gives.

No SVG icon, because this is a photograph. The .ico carries 16, 32 and 48 in one file
for the sizes that actually get asked for, with a 180px apple-touch-icon beside it.

Diffstat:
Apublic/apple-touch-icon.png | 0binary
Apublic/favicon-32.png | 0binary
Apublic/favicon.ico | 0binary
Msrc/layouts/Base.astro | 9+++++++++
4 files changed, 9 insertion(+), 0 deletion(-)

diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
Binary files differ.

diff --git a/public/favicon-32.png b/public/favicon-32.png
Binary files differ.

diff --git a/public/favicon.ico b/public/favicon.ico
Binary files differ.

diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro
@@ -94,6 +94,15 @@ const buildYear = new Date().getUTCFullYear();
     {description && <meta name="description" content={description} />}
     <link rel="canonical" href={new URL(here, Astro.site)} />
     <link rel="alternate" type="application/rss+xml" title="sqzer" href="/index.xml" />
+    {/* The site had no icon at all: /favicon.ico and /favicon.svg both 404'd, so every tab
+        showed the browser's placeholder. It is the author's own portrait, cropped square
+        on the head rather than scaled from the 4:5 original — a whole portrait shrunk to
+        16px is a smudge, where a head fills the frame and still reads.
+        No SVG icon: this is a photograph, and the .ico carries 16, 32 and 48 for the
+        sizes that actually get asked for. */}
+    <link rel="icon" href="/favicon.ico" sizes="48x48" />
+    <link rel="icon" type="image/png" href="/favicon-32.png" sizes="32x32" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
     {/* One Latin face now, so this is unconditional: every page paints Lora, and the
         old branch between a display face and the Korean one has nothing left to pick. */}
     <link rel="preload" href="/fonts/latin-9bba8f25.woff2" as="font" type="font/woff2" crossorigin />