김프를 사용하여 티스토리 블로그와 홈페이지에 사용할 파비콘favicon을 만들어서 적용하였습니다. 사실 기존에 사용하던 것이 있었는데 새로 만들려다가 결국은 조금 손보는 수준이 되었습니다.

패비콘(영어: favicon, 'favorites + icon') 또는 파비콘이란 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다. 아이콘 크기은 16x16, 32x32, 48x48, 64x64픽셀이 될 수 있고, 8비트, 24비트, 32비트 색상이 가능하다.위키백과, 패비콘

위키에 간단 명료하게 잘 설명 되어 있네요! 아래 코드도 딱! 나와있네요~ㅎ 아래 한줄을 html head태그안에 넣어주면 됩니다.

<link rel="shortcut icon" href="http://www.example.com/myicon.ico"/>

어떤 포맷으로 할까?

ico, jpg, gif, png 포맷들을 대부분의 브라우저에서 지원하지만, ico가 제일 좋습니다. 왜냐하면 2가지 이상의 해상도를 하나의 파일안에 넣을 수 있기 때문입니다!

ICO 파일 포맷은 마이크로소프트 윈도의 아이콘에 쓰이는 그림 파일 포맷이다. 헤더의 인증 바이트가 다른 것만 제외하고는 컴퓨터 커서에 쓰이는 CUR 파일 포맷과 비슷하다. ICO 파일은 여러 크기와 색 깊이를 가진, 하나 이상의 작은 그림을 담고 있다.위키백과, ICO(파일포맷)

PC브라우저에서는 대부분 16x16를 사용하지만 간혹 더 높은 해상도를 사용할 때가 있기 때문에 ico로 만드는 것을 추천합니다.

예를 들면, 즐겨찾기 목록에서 favicon의 이미지를 가져와서 쓰는데 16x16보다 높은 이미지를 사용하기도 하죠. 특히 모바일 브라우저들은 더욱! 제 블로그 16x16만 올려놨었는데, 즐겨찾기 목록에서 이상하게 제 블로그만 favicon 해상도가 떨어지더라구요.ㅠ

얼마나 많은 해상도를 넣을까?

페북이랑 구글을 확인해보니 16x16 하고 32x32 사이즈만 들어있더라구요. 더 많이 넣으면 아무래도 불필요하게 사이즈가 커지니까~ㅎ 그래서 저도 2개의 사이즈 이미지만 ico 파일로 만들었습니다.

ico 파일 만드는 방법

여러가지 방법이 있는데, 저는 김프gimp를 사용했습니다. 사용하면 할수록 빠져드는 아주 매력적인 툴입니다! 강력하고 무료임!!!

잘 정리해둔 글이 있어서 링크를 걸어둡니다. 김프gimp를 모르시는 분이라면 먼저 김프gimp에 대해서 알아보셔야 할 것 같아요~ 그리고 다른 툴을 사용하실 줄 안다면, 그 툴로 만들어도 되고요~

김프로 ico파일 파비콘 만드는 간단한 방법, 같이 이미지를 레이어별로 만든 다음 ico로 내보내면 끝

GIMP 를 이용해서 아이콘(ico) 파일 만들기