파비콘이란
파비콘(Favicon)은 브라우저 탭, 북마크, 즐겨찾기 목록에 표시되는 작은 아이콘입니다. 웹사이트의 얼굴과 같은 역할을 합니다. 파비콘이 없으면 기본 아이콘이 표시되어 전문성이 떨어져 보입니다. 브랜드 인지도 향상에 작지만 중요한 요소입니다.
파비콘 규격 이해
전통적인 파비콘은 16x16, 32x32 픽셀 크기의 ICO 파일입니다. 현재는 PNG, SVG도 지원되며 애플 터치 아이콘은 180x180까지 필요합니다. 다양한 기기와 브라우저를 지원하려면 여러 크기를 준비해야 합니다. 파비콘 생성기로 필요한 모든 크기를 한 번에 만들 수 있습니다.
효과적인 파비콘 디자인
작은 크기에서도 식별 가능해야 합니다. 복잡한 로고는 단순화하고, 대비가 강한 색상을 사용합니다. 텍스트보다는 심볼이나 이니셜이 효과적입니다. 온라인 도구에서 미리보기로 작은 크기에서 어떻게 보이는지 확인하세요.
파비콘 적용 방법
HTML head 태그에 link 요소로 파비콘을 지정합니다. 다양한 기기를 지원하려면 여러 link 태그가 필요합니다. manifest.json 파일로 PWA 아이콘도 설정할 수 있습니다. 생성기에서 필요한 HTML 코드도 함께 제공합니다.
CMS별 설정 방법
워드프레스, 티스토리 등 CMS마다 파비콘 설정 방법이 다릅니다. 대부분 관리자 페이지에서 이미지를 업로드하면 자동으로 적용됩니다. 직접 HTML을 수정해야 하는 경우도 있습니다. 파비콘 도구로 먼저 적절한 형식으로 변환하세요.
파비콘 캐싱 문제 해결
파비콘을 변경해도 브라우저 캐시 때문에 바로 적용되지 않을 수 있습니다. 파일명을 변경하거나 쿼리 스트링을 추가하면 됩니다. 강력 새로고침(Ctrl+Shift+R)으로 캐시를 무시할 수도 있습니다. 변환 도구로 새 파비콘을 만들어 적용해보세요.