전체 도구

파비콘 & 앱 아이콘 검사기

파비콘 설정을 검증하고 파비콘, Apple 터치 아이콘, 웹 앱 매니페스트에 필요한 전체 링크 태그 세트를 생성하세요.

사이트 URL

아래 link 태그의 전체 경로를 생성하는 데 사용됩니다.

파비콘 체크리스트

0/9개 파일 (0%)

필수 파비콘 파일

생성된 HTML 태그

아래 태그를 <head> 요소 안에 추가하세요.

<meta name="theme-color" content="#ffffff">

site.webmanifest

이 파일을 site.webmanifest 라는 이름으로 사이트 루트에 저장하세요.

{
  "name": "Your Site Name",
  "short_name": "Site",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "display": "standalone"
}

파비콘 모범 사례

  • 모던 브라우저에는 PNG 사용: PNG 파비콘은 투명도를 지원하며 모든 크기에서 선명하게 표시됩니다
  • 레거시 지원을 위해 favicon.ico 유지: 일부 구형 브라우저와 도구는 여전히 루트의 favicon.ico를 찾습니다
  • SVG 파비콘은 미래의 표준: rel="icon" type="image/svg+xml" 로 SVG 파비콘을 추가하면 확장 가능한 품질을 제공합니다
  • Apple Touch Icon은 180x180: iOS는 필요에 따라 축소하므로 권장 최대 크기를 제공하세요
  • 실제 기기에서 테스트: RealFaviconGenerator 같은 도구를 사용하여 다양한 플랫폼에서 아이콘이 어떻게 표시되는지 확인하세요
  • 캐시 무효화: 브라우저는 파비콘을 강하게 캐시합니다. 업데이트 시 버전 쿼리 스트링을 추가하세요

주요 기능

  • 파비콘 태그 생성
  • Apple 터치 아이콘 태그
  • 웹 앱 매니페스트
  • 크기 권장사항
  • 형식 유효성 검증
  • 전체 태그 복사

SEO 팁

  • 타이틀 태그는 60자 이내로 작성하세요
  • 메타 디스크립션은 150~160자가 적당합니다
  • 주요 키워드를 자연스럽게 포함하세요
  • 각 페이지의 메타 정보를 고유하게 작성하세요