PNG를 ICO로 무료 변환하기

logo.png를 favicon.ico로 바꾸는 것만으로는 부족합니다. ICO는 자체 헤더가 있는 컨테이너 형식입니다. 헤더에는 이미지 개수, 각 이미지의 크기와 파일 내 시작 위치가 기록됩니다. 이름만 바꾼 PNG에는 이런 헤더가 없어 엄격한 브라우저는 표시하지 않습니다.

올바른 ICO에는 같은 아이콘의 여러 해상도가 들어 있습니다. 브라우저는 헤더를 읽고 필요한 크기에 가장 가까운 이미지를 선택하여 불필요한 확대를 피합니다.

첫째, 원본을 준비하세요. 최소 512×512픽셀의 정사각형 PNG를 쓰면 모든 크기를 축소해서 만들 수 있어 결과가 좋습니다. 배경이 투명하다면 유지할지 결정하세요. 투명 배경은 탭에 적합하지만 iOS와 Android는 검정색으로 채웁니다.

둘째, 각 해상도를 생성하세요. 파일에는 최소 16×16, 32×32, 48×48이 포함되어야 합니다. 고품질 리샘플링 필터로 크기를 조정하지 않으면 작은 아이콘을 알아보기 어렵습니다.

셋째, 하나로 묶으세요. 세 이미지를 ICO 컨테이너에 넣고 헤더에 각 항목을 기록합니다. 결과를 favicon.ico라는 이름으로 사이트 루트에 두면 HTML 태그가 없어도 브라우저가 찾을 수 있습니다.

대부분의 PNG ICO 변환기는 파일을 서버로 업로드한 뒤 처리 결과를 돌려줍니다. 아직 공개되지 않은 로고가 관리할 수 없는 컴퓨터에 저장되고, 읽어보지 않은 보관 정책의 적용을 받을 수 있습니다.

최신 브라우저는 PNG 디코딩, canvas에서 크기 조정, 각 크기 인코딩, ICO 컨테이너 조립까지 모두 직접 수행할 수 있습니다. LFFavicon도 이 방식으로 작동합니다. 이미지가 네트워크 요청으로 전송되지 않으며 탭을 닫으면 모두 사라집니다.

실제 사용에서도 이점이 있습니다. 변환이 즉시 이루어지고 페이지를 불러온 뒤에는 오프라인에서도 사용할 수 있으며 대기열이나 일일 제한도 없습니다.

PNG를 ICO로 변환하면 탭과 구형 클라이언트는 지원하지만 세 환경이 남습니다. 최신 브라우저는 모든 크기에서 선명한 SVG를 선호하고, iOS 홈 화면은 불투명한 180×180 PNG를 사용하며, Android는 웹 매니페스트를 읽습니다.

이미지를 처리하는 김에 전체 구성을 한 번에 만드세요. 생성기는 하나의 원본으로 .ico, SVG, Apple Touch 아이콘, 매니페스트 아이콘을 만들고 다운로드 전에 각 환경의 미리보기를 제공합니다.