파비콘이 안 보이는 이유

1. HTML link 태그 확인

먼저 문서 head에 올바른 HTML link 태그가 있는지 확인하세요. 없거나 잘못되면 파비콘이 표시되지 않습니다.

<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="icon" type="image/svg+xml" href="/favicon.svg">

href 경로가 실제 파일 위치와 같은지 확인하세요. 안 보이면 사이트 루트를 기준으로 상대 경로를 다시 점검하세요.

2. 브라우저 캐시 지우기

브라우저는 파비콘을 강하게 캐시하므로, 코드를 고쳐도 잠시 안 보일 수 있습니다. 캐시 때문에 안 보일 때는:

• 강제 새로고침 (Windows/Linux는 Ctrl+Shift+R, Mac은 Cmd+Shift+R)
• 해당 사이트의 캐시와 쿠키를 지웁니다
• 시크릿/프라이빗 창에서 열어 봅니다
• 캐시가 자연스럽게 만료될 때까지 24-48시간 기다립니다

이 단계를 거쳐도 안 보이면 캐시 문제가 아닐 가능성이 큽니다.

3. 파일 경로와 위치 확인

파비콘 파일이 올바른 위치에 있는지 확인하세요. 파일이 없거나 디렉터리가 다르면 표시되지 않습니다.

흔한 위치:

• 루트 디렉터리: /favicon.ico or /favicon.png
• public 폴더: /public/favicon.ico (정적 사이트 생성기)
• assets 폴더: /assets/favicon.ico

HTML의 경로가 서버의 실제 위치와 일치하는지 확인하세요.

4. 파일 형식과 크기 확인

지원하지 않는 형식이나 잘못된 크기 때문에 안 보일 수도 있습니다. 고치려면:

• ICO 형식: 전통 형식이며 모든 브라우저에서 동작합니다 (16x16 또는 32x32 픽셀)
• PNG 형식: 최신 브라우저가 지원합니다 (16x16, 32x32, 48x48, 96x96, 192x192, 512x512)
• SVG 형식: 최신 브라우저가 지원하며, 크기를 바꿔도 선명합니다

형식과 크기가 맞는지 확인하세요. 안 되면 먼저 표준 ICO나 PNG로 시도해 보세요.

5. 서버 설정 확인

서버 설정이 잘못되면 파비콘이 안 보일 수 있습니다. 점검 항목:

• .ico, .png, .svg의 MIME 타입이 올바른지 확인합니다
• 서버가 파비콘 파일 요청을 허용하는지 확인합니다
• 파비콘 요청을 막는 리다이렉트 규칙이 없는지 확인합니다
• HTTPS/HTTP가 일치하는지 확인합니다 (혼합 콘텐츠 경고가 없어야 합니다)

서버 문제라면 호스팅 업체에 문의하거나 서버 설정 파일을 확인하세요.

6. 여러 브라우저에서 확인

한 브라우저에서만 안 보이고 다른 곳에서는 되는 경우도 있습니다. 점검할 때:

• Chrome, Firefox, Safari, Edge에서 확인합니다
• 모바일 브라우저를 확인합니다 (iOS Safari, Chrome Mobile)
• 북마크와 방문 기록에도 파비콘이 보이는지 확인합니다
• 데스크톱과 모바일 화면 모두에서 테스트합니다

특정 브라우저에서만 안 보이면 해당 브라우저의 요구 사항이나 알려진 이슈를 확인하세요.