파비콘이란?
파비콘(Favicon)이란?
파비콘은 웹사이트의 브랜드 아이덴티티를 나타내는 작은 아이콘입니다. 브라우저 탭, 북마크, 검색 결과 등에 표시되어 사용자가 웹사이트를 쉽게 식별할 수 있도록 도와줍니다.
권장 크기
- 16×16px: 가장 일반적인 파비콘 크기, 브라우저 탭에 표시
- 32×32px: 고해상도 디스플레이용 파비콘
- 48×48px: Windows 바탕화면 바로가기 아이콘
- 180×180px: Apple Touch Icon (iOS 홈 화면 아이콘)
- 192×192px: Android 홈 화면 아이콘
- 512×512px: PWA (Progressive Web App) 아이콘
파비콘 적용 방법
생성한 파비콘을 웹사이트에 적용하려면 HTML의 <head> 태그 안에 다음 메타 태그를 추가하세요:
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="512x512" href="/android-chrome-512x512.png">디자인 팁
- 파비콘은 작은 크기로 표시되므로 단순하고 명확한 디자인을 권장합니다.
- 1-2글자의 텍스트나 간단한 이모지가 효과적입니다.
- 배경색과 텍스트 색상의 대비를 충분히 확보하세요.
- 브랜드 색상을 활용하여 일관성을 유지하세요.