티스토리 블로그 파비콘(favicon) 만들기와 적용

인터넷을 돌아다니다 보면 지금은 당연스러워 보이는 

즐겨찾기나 북마크 이름앞에 붙는 아이콘 모양들

각자 기업이나 단체 혹은 개인들의 특징을 아주 간단하게 살려

심플한 아이콘 형태로 보여주는 이것

이것의 이름은 파비콘(favicon) 이라고 합니다

파비콘...이름이 참 생소할수 있는데

이 파비콘이라는 이름은 즐겨찾기(Favorite)과 아이콘(Icon)의 합성어라고 보시면 됩니다

인터넷익스플로러든 크롬이든 즐겨찾기나 북마크를 하게되면

해당 홈페이지의 이름앞에 붙어 있는 작은 아이콘입니다

파비콘파일을 만들때는 확장자가 무조건 ico 로 만들어져야 합니다

똥강아지의 블로그 이름은 

돼지김치찌개를 좋아하는 똥강아지 입니다

워낙 돼지김치찌개를 좋아하다보니 그냥 깊은 의미없이 단순하게 만든 블로그 이름

그래서 똥강아지의 티스토리 블로그에 파비콘도 

돼지김치찌개 라고 이름붙여서 만들어 쓰고자 했습니다

그런데 만들다보니 6자로 하기엔 좀 이상한듯 싶어서

그냥 돼지를 뺀 김치찌개라는 단어만 가지고 파비콘을 만들게 되었습니다

똥강아지는 그냥 포토샵에서 김치찌개라는 단어를 쓰고 폰트를 변화시켜주고 

색깔만 입혀서 기본 이미지를 만들었습니다

이미지 파일을 준비한뒤에

파비콘을 만들어주는 홈페이지인 

http://www.degraeve.com/favicon 으로 이동합니다

아래 이미지에서 보시는것처럼 준비한 파일을 열어주신뒤

우측편에 있는 upload image 를 클릭해줍니다

그럼 아래처럼 나오는데 박스안에 있는 점선 사각형을 이동하고 사이즈를 조절하여

원하는 이미지를 선택해준뒤

Crop picture를 클릭해줍니다

그럼 파비콘의 형식에 맞는 이미지로 뭉개져보이듯이 이미지가 변환됩니다

Clear All 아이콘 옆에 있는

Make Favicon! 버튼을 클릭해줍니다

그럼 잠시동안 파비콘이미지를 변환뒤에 아래처럼 창이 바뀝니다

마우스 오른쪽 버튼을 클릭해서

이미지를 다른이름으로 저장해줍니다

이렇게 만들어진 파비콘 아이콘을 티스토리블로그에 적용하기 위해

블로그의 관리페이지 화면으로 이동합니다

좌측 하단의 기본정보를 클릭해서 나오는 화면에서 

아이콘 부분에 있는 파비콘에서 

찾아보기 버튼을 클릭하여 준비된 파비콘을 찾아옵니다

이렇게 파비콘 불러오기가 끝났다면 하단의 저장버튼을 클릭하시면 작업은 끝~

근데 변화가 없어보입니다...

어찌된걸까요

문제는 인터넷 임시파일들

인터넷익스플로러의 경우 도구 - 인터넷 옵션에서

일반 - 검색기록 삭제를 클릭해서

인터넷 검색기록을 삭제를 해줍니다

크롬의 경우 아래 사진처럼 주소창 맨 오른쪽에 있는 설정 버튼을 클릭하고

설정으로 들어가줍니다

살짝 스크롤을 내려서

개인정보 - 인터넷 사용정보 삭제 를 클릭해줍니다

인터넷 사용정보 삭제 창이 떴는데요

우측하단의 인터넷 사용정보 삭제를 클릭해

인터넷임시파일들을 삭제해줍니다

이제 새로고침을 해보시거나

인터넷 창을 닫았다가 다시 켜보시면

블로그 이름 옆에 파비콘이

떡~ 하니 자리잡고 있는 모습을 보실수가 있습니다

나만의 파비콘 만들기와 적용하기

직접 따라해보시면 간단하게 개성있는 파비콘을 만들수 있습니다~^^

postes by 

공감♥ 은 블로거에 대한 작은 배려입니다

좀더 좋은 정보를 위해 노력하라는 격려의 의미로 눌러주셔도 됩니다

로그인은 안하셔도 됩니다~^^