브라우저를 사용하며, 각 탭의 앞에 자리 잡은 작은 아이콘을 한 번씩 보셨을 것 같은데요! 우리에겐 파비콘으로 알려진 아이콘의 하나로(영어: favicon, ‘favorites + icon’) 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 역할을 합니다. 위의 이미지를 보면 모두 작은 아이콘들이 자리 잡고 있고, 이는 한 번 인식되면 페이지 이름을 보지 않더라도 어떤 탭인지 쉽게 확인할 수 있습니다. 사파리, 익스플로러, 엣지, 크롬 등 우리가 활용할 수 있는 브라우저의 종류는 많아졌지만 여러개의 창을 띄워 놓고 확인하는 패턴은 유사하기에 ‘파비콘’의 역할은 더욱 중요하다는 생각이 드네요.
이런 파비콘은 브라우저 종류에 따라 적용 가능한 확장자가 다르기도 하고 (출처 : 위키피디아)
브라우저 및 사용 목적에 따라 사이즈가 달라지기도 합니다. (출처 : Emerge)
원본 이미지를 등록하면, 필요한 사이즈에 맞춰 자동으로 파비콘을 생성해주는 웹서비스들도 종종 확인할 수 있죠. 다만, 제작한 파비콘이 브라우저에 따라 어떻게 보일지 미리 확인하는게 번거롭게 느껴졌던 것이 사실입니다. 자주 생성하는 것은 아니지만 저는 워드프레스용 파비콘 제작 후 위와 같이 파비콘 미리보기 서비스를 이용해 빠르게 도움을 받을 수 있었는데요! ‘favicon-checker’라는 이름의 이 서비스는 파비콘 이미지를 직접 업로드하거나 이미지 URL을 입력해 파이어폭스, 사파리, 크롬 등의 탭에서 파비콘이 어떻게 보이는지 한 눈에 확인할 수 있도록 도와줍니다.
실제 제가 활용하는 파비콘은 아니지만, 임시로 이미지를 하나 등록해봤는데 위와 같이 실제와 동일하게 확인할 수 있었습니다. 무수히 많은 탭 속에서, 우리 웹페이지를 가장 먼저 눈에 띄게 만들어주는 역할을, 즐겨찾기 폴더에서 다시 한 번 클릭, 방문할 수 있도록 유도하는 역할을, 그 외에도 작지만 서비스와 관련된 유효한 역할을 하는 파비콘! 브라우저에 따라 한 눈에 미리볼 수 있는 ‘favicon-checker‘가 반가운 이유가 아닐까 싶습니다.
