티스토리 파비콘 만들기(주소창 옆에 마크)

블로그를 시작한지 3개월차 이다. 그동안 블로그를 키우고 싶어 이것저것 해본것이 있다. 요 T 티스토리 마크를 여기저기 너무 많이 보이기 때문에 특별함이 없는것 같아서 한참을 해매다가 결국 알아냈다. 오늘은 주소창 옆에 마크를 교체해 보려합니다.

 

주소창옆의 마크의 이름은 파비콘(favicon)이다. 즐겨찾기의 'favorites'의 'fav'와 아이콘의 'icon'을 합성하여 붙인 말로 연결해서 말하게되면 즐겨찾기 아이콘이란 뜻을 가지고 있다. 아래와 같이 사이트의 개성을 한장에 그림조각으로 표현할 수 있다.

 

원래 일반 사이트에서 파비콘 파일은 이름을 반드시 favicon.ico 으로 해서 루트 디렉토리에 넣으면 자동으로 적용되었다. 하지만 티스토리는 루트 디렉토리가 없기 때문에 블로그 설정에서 해야하는데 오늘 그 과정들을 확인해 보겠다.

미리 말하지만 테스트용으로 후다닥 먼저 해보고 두번째로 예쁘게 다시 만들길 권장한다.

 

 

1. 파비콘 이미지 파일 준비

테스트용으로 정사각형,원형 형태로 만들면된다. 크기는 가능한 작게 만들고 그림파일로 만들어두라(단, 파워포인트, 캡쳐도구를 사용해야 그림파일이 깨지지 않는다)

 

원래 크기를 픽셀기준 16 * 16으로 준비해야 한다. 그래야 이미지가 깨짐없이 예쁘게 만들어 지는데, 일단 처음 하는것 일테니 일반 작은 모양으로 준비를 해둔다. 디자이너가 아니기 때문에 30분만에 생각해 내고 그냥 해봤는데 언젠간 다시 시간내서 고칠 것 같다. 왠지 맨날 볼텐데 내맘에 쏙들어야 하지 않을까 싶다.
16 * 16, 32 * 32, 64 * 64 크기에 이미지 확장자는 jpg, gif, png 중 하나로 저장한다.

 

 

2. 이미지를 파비콘 으로 만들기

 

여기서 두개의 사이트를 소개해볼 예정이다.

첫번째는 https://www.converticon.com/ 로 정말 간단하게 만들 수 있다.
테스트 용으로 좋다. 개인적으로 딱 원하는 사이즈로 만들어지지 않아서 결국 다른 사이트를 이용했다.

 

두번째로 http://www.xiconeditor.com/ 로 해서 괜찮게 만들 수 있었다.
파일을 넣게 되면 사이즈를 정할 수 있는 화면이 나온다. 거기에 64x64, 32x32, 16x16에 짤리지 않게 표시하고 적용 누른 후 Export 하면된다.

먼저 [Import] 버튼을 누른다.

 

 

다음 [Upload] 버튼을 누르고 이미지를 첨부한다.
그리고 사이즈를 딱 맞게 조절한 뒤

 

 

 

[Export]를 눌러 ico 확장자로 파일을 저장한다.

 

 

 

3. 티스토리에 파비콘 적용하기

 

[블로그관리] - [본인아이콘] - [파비콘]

 

 

 

4. 파비콘을 적용하면 곧바로 보여지지 않을 수 있다.

 

파비콘이 안 보일 경우 : [인터넷옵션] - [일반] - [검색 기록] - [삭제]  인터넷파일과 쿠키등을 삭제한다.

 

 

 

 - - 이 블로그의 다른이야기 - -

2018/02/05 - [운영자 수입/(3) 주식] - 해외주식을 해야하는 이유

2018/02/02 - [운영자 수입/(1) 티스토리 애드센스 운영] - 티스토리, 애드센스 2개월차 수익 공개

2018/01/28 - [1. 초보투자자] - 워런버핏이 추천한 주식을 산 결과

2018/01/23 - [1. 초보투자자] - 워렌버핏은 코카콜라 주식을 왜 팔지 않을까

2017/12/30 - [MONEY/자수성가(한국)] - 도깨비,태양의후예 김은숙 작가 - 수입

2017/12/19 - [MONEY/자수성가(한국)] - 사랑받는 가수 아이유 - 수입