Іко́нка сайту


Я здався і зробив собі favicon.

Не те щоб мені якось було незручно без іко́нки; навпаки, я б і надалі обхо́дився мінімалістичним підходом. Просто мене з часом почало біси́ти, що браузери час від часу самі, не пита́ючи мене, шлють запити GET /favicon.ico, отримують 404 і пока́зують це в різних логах.

Натиска́ю F12 і бачу матюки там, де на́чебто кожне посилання переві́рене.

Коротше, терпець урва́всь.

Нова іко́нка

Ось яку я намалював собі іко́нку:

Іко́нка сайту

Вірніше, я не намалював її, а вручну написав. Це лише кілька рядків SVG. Насправді SVG це дуже круто і, у простих випадках, це може бути не надто складно :)

<?xml version="1.0"?>
<svg viewBox="0 0 600 600" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <circle cx="300" cy="300" r="250" fill="#000"/>
  <path d="M 60 300 Q 80 80 300 60 H 300 V 300 Z" fill="#ff0"/>
  <path d="M 540 300 Q 520 520 300 540 H 300 V 300 Z" fill="#ff0"/>
</svg>

Як бачите, це кругла чорно-жовта хрінь, як маркери на манеке́нах для краш-тестів. Це ж в мене тут те́стовий сайт, чи не так? :)

Автоматична генерація іко́нок

Щоб бути модним і сучасним, я автоматично генеру́ю квадратні іко́нки у форматі PNG з шириною/довжиною у 16, 32, 36, 48, 57, 60, 72, 76, 96, 114, 120, 144, 152, 180, 192, 194, 256, 384 та 512 пікселів.

Оновлено в 2022: я їх вже не генеру́ю, вирішив що не треба.

Окремо я генеру́ю старий favicon.ico, хоча жодного посилання на цей файл у мене немає.

Окремо я вирішив зробити одну з іко́нок (180×180) з непрозо́рим білим фоном, бо мій старий iPad для прозорих іко́нок використовує тільки чорне тло, а на чорному ця іко́нка виглядає не так кльово.

Додав mainfest.json та до купи чомусь дода́в robots.txt теж.

Оновлено в 2022: також я видалив manifest.json.

Що мені не сподо́балося, так це те, що для Github Pages мені довелося закоммі́тити згенеро́вані іко́нки у форматі PNG. Не те щоб мені було так шкода ~50 Кб, просто якось це не дуже правильно. Адже репозитарій має містити джерело, а не результат, чи не так?