파비콘을 만드는 방법
현대의 파비콘은 16×16 이미지 그 이상입니다. 모든 브라우저, OS 및 장치에서 선명하게 보이는 설정을 위한 전체 작업 흐름은 다음과 같습니다.
6 분 분량
파비콘이란 무엇입니까?
파비콘은 브라우저의 탭, 북마크바, 기록 목록에 표시되는 작은 아이콘입니다. 모바일에서는 홈 화면 아이콘입니다. Windows에서는 바로가기 아이콘입니다.
최신 사이트는 다양한 해상도와 형식을 제공하므로 모든 표면이 선명한 렌더링을 얻을 수 있습니다.
소스 이미지 준비
최소 512×512 크기의 정사각형 이미지에서 시작하세요. 정사각형 viewBox가 있는 SVG가 이상적입니다. 더 작은 것은 축소되면 흐려집니다.
가는 선과 작은 텍스트를 피하세요. 16×16에서는 사라집니다.
여러 크기의 .ico 생성
단일 favicon.ico 안에 16, 32, 48, 64, 128 및 256을 묶습니다. 브라우저는 자동으로 적절한 크기를 선택합니다.
우리의 파비콘 생성기는 클라이언트 측에서 1초 안에 이 작업을 수행합니다.
HTML 태그 추가
favicon.ico를 사이트 루트에 삭제하세요. 그런 다음 전체 설정을 위해 <head>에 SVG, apple-touch-icon 및 매니페스트 아이콘을 추가하세요.
모든 브라우저에서 확인
Chrome, Safari, Firefox 및 Edge에서 강제 새로 고침. 북마크바, 탭, 홈 화면 설치를 확인하세요.