Favicon là icon nhỏ (16x16px) hiển thị trên tab trình duyệt, thanh địa chỉ, bookmark. Giúp nhận diện brand.
Các bước
- Chuẩn bị ảnh logo vuông, tốt nhất 512x512px (PNG/SVG).
- Dùng công cụ tạo favicon: favicon.io, RealFaviconGenerator.
- Tải bộ file favicon về (bao gồm các kích cỡ: 16x16, 32x32, 180x180 cho Apple touch, v.v.).
- Đặt vào thư mục root hoặc
/assets/favicon/. - Nhúng vào
<head>:<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
Mẹo: RealFaviconGenerator tạo sẵn file site.webmanifest và code HTML hoàn chỉnh.