파비콘은 웹사이트를 대표하기 위해 웹브라우저에서 사용되는 16×16 픽셀의 작은 이미지(아이콘)입니다. 브라우저 탭, 브라우저 사용 기록, 검색 결과, 북마크 목록 및 주소 표시줄 등 다양한 곳에서 확인할 수 있습니다. 파비콘은 아래와 같은 이유로 꼭 적용이 필요한데요.

  • 검색 엔진 순위 및 클릭률(CTR) 향상
  • 브랜드 인지도 및 브랜드 아이덴티티 강화
  • 웹사이트를 보다 신뢰할 수 있는 공간으로 인식하는데 도움

일반적인 16×16 픽셀 외에도 디바이스나 사용 환경을 고려해 등록, 활용하게 되는데요. 오늘 소개할 서비스는 주요 사용 환경에 맞는 파비콘을 쉽게 생성할 수 있는 곳으로 우리가 해야할 일은 파비콘으로 사용할 이미지를 등록하는 것입니다.

파비콘을 생성하기 위해 꼭 거쳐야 할 메인 화면의 모습입니다. 사용방법도 함께 작성된 것을 알 수 있는데, 이미지를 업로드한 뒤 사이즈에 맞게 생성된 파비콘을 내려받아 적용하는 것이 전부입니다. 이미지는 이미지 업로드 영역을 클릭하거나 파일을 드래그해 등록할 수 있습니다.

파비콘을 생성해 주는 곳은 이전에도 있었지만, 비교적 최근에 오픈한 이곳만의 장점은 ‘빠르다는 점’입니다. 한 개의 사이즈가 아니라 여러 사이즈로 파비콘을 제작하는데 필요한 시간이 짧아 결과를 확인하기까지 다른 화면을 확인하거나 기다려야 할 필요가 없습니다. 또 파비콘 제작을 위해 등록하는 이미지의 포맷 역시 다양하게 지원합니다. PNG, JPEG는 물론 GIF, SVG, WEBP 등도 제공해 사용 확장자를 변경하는 등의 과정을 줄일 수 있습니다. 마지막으로 파일 등을 서버에 저장하지 않고 사용자의 브라우저 안에서만 처리하기 때문에 보안 이슈를 줄일 수 있다는 점 역시 눈에 띕니다.

이미지를 업로드한 뒤 파비콘이 생성된 모습입니다. 코드와 파일로 결과를 확인할 수 있으며, 파일은 ‘다운로드’ 버튼을 통해, 코드는 복사(copy) 버튼을 통해 각각 활용할 수 있습니다.

위 이미지는 제가 ‘팁스터 뉴스레터’ 아이콘을 이미지로 등록 후, 파비콘으로 생성해 파일로 내려받아 확인한 모습입니다. 16×16 픽셀은 물론, 192,512(워드프레스용 파비콘) 등 다양한 사이즈에 맞게 생성된 것을 알 수 있습니다. 자주 업데이트 되거나 변경해야 하는 파비콘은 아니지만 직접 사이즈에 맞게 편집하거나 별도로 생성하기엔 귀찮은 작업으로 느껴질 수 있는데요. 저 역시 이런 경우 파비콘 생성 서비스를 자주 활용하는 편입니다. 파비콘 생성과 관련된 더 자세한 내용은 ‘링크’를 참고해주세요.