본문 바로가기

별을 찾는 아이/블로그관리하기

티스토리 파비콘(패비콘, favicon) & ico 변환하기



티스토리 파비콘(패비콘, favicon) & ico 변환하기

파비콘이란?

파비콘 혹은 패비콘(favicon)은 favorites + icon을 일컫는 말입니다.

웹 브라우저의 주소창 옆에 보이는 이미지를 파비콘 혹은 패비콘이라고 부릅니다.




티스토리 블로그는 기본적으로 티스토리마크가 기본 파비콘으로 설정되어 있습니다.

오늘 이전까지도, 제 패비콘 역시 티스토리 기본마크였습니다.

지금부터, 패비콘을 커스터마이징하는 과정을 순차적으로 보여드리겠습니다.


티스토리 파비콘 만들기

(1) 파비콘으로 사용할 이미지를 jpg 파일로 구해둡니다.

이 때, 굳이 파일의 해상도가 높을 이유는 없습니다.

어차피 티스토리에서는 파비콘으로 사용될 수 있는 ico 확장자 파일의 크기가 100kB를 넘을 수 없습니다.

괜히 고해상도의 이미지를 써도 어차피 파비콘으로 보이는 이미지에는 한계가 있기 때문입니다.


(2) jpg 파일을 ico 파일로 변환합니다.

파비콘으로 사용 될 수 있는 이미지는 ico 확장자를 가져야합니다.

따라서 우리가 가지고 있는 jpg 파일을 ico파일로 변환해야합니다.


<jpg to ico, bmp to ico, gif to ico, png to ico 추천 사이트>


제가 추천하는 jpg to ico 웹사이트는 https://www.icoconverter.com/ 입니다.

아래와 같이 직관적으로 jpg, bmp, gif, png 등 이미지 파일을 ico 확장자 파일로 변환하도록 도와줍니다.

각 브라우저마다 파비콘에 지원하는 이미지 사이즈에는 한계가 있습니다.

IE에서는 48*48 이하를, 크롬에서는 128*128 이하를 지원하고,

맥 같은 것에서는 그 이상을 지원하기도 한다는군요.


이 웹페이지에서 지원하는 정도면 파비콘으로 사용하는 것에 전혀 무리가 없도록 변환을 할 수 있습니다.

혹여 100kb를 넘게 되면 티스토리 블로그에서는 사용이 불가능하니,

100kb를 넘는다면 사이즈의 상한선을 낮추거나 Bit Depth를 8bit로 줄이는 것도 방법이겠습니다.

어차피, 작은 사이즈로 나오는 파비콘이기에 해상도나 색의 다양성이 크게 영향을 주지 않습니다.



혹여 위의 웹페이지가 먹통인 경우 사용 가능한 두 번째 사이트를 소개합니다.

https://convertio.co/kr/jpg-ico/

단 해당 사이트의 경우, 사이즈 등의 조절이 불가능하여, 티스토리에서 요구하는 100kb 이하로 조정하기가 쉽지 않습니다.

따라서 첫 사이트를 개인적으로는 더 권합니다.



(3) [블로그관리 - 관리 - 블로그] 경로로 들어갑니다.


해당 경로로 들어가면 아이콘 및 파비콘을 업로드 할 수 있습니다.


<파비콘 변경 전>


<파비콘 변경 후>


파비콘을 업로드하시면, 다음과 같이 나만의 파비콘이 적용된 모습을 확인할 수 있습니다.



재밌게 읽으셨다면 공감버튼을 눌러주세요 ♡