티스토리 초보팁 Vol.9 블로그에 파비콘 달기

2007.07.04 15:59블로거팁닷컴/블로그 만들기

파비콘이 뭔가요?
 

"파비콘은 웹 브라우저의 즐겨찾기나 주소 입력줄에 보이는 그림입니다." 라고 티스토리 환경설정 창에 나와있다. 한때 영어를 전공했던 인문학도로서 추측해 보건데 파비콘은 아마도 Favorite(즐겨찾기) 과 Icon(아이콘) 의 합성어일듯 싶다. 아님말고! 쉽게 말하면 아래의 그림에서 보면 주소창에 보이는 아이팟 U2 그림이 바로 파비콘이다. (빨간색 밑줄, V자 표시된 그림 =>파비콘)
 

사용자 삽입 이미지

※ 여기서 짚고 넘어가야 할것이 하나 있는데 이 파비콘이 인터넷 익스플로러에선 잘 작동을 하지 않는다는것이다. 하지만 시대는 바야흐로 구글 파이어폭스의 시대. 파이어폭스를 사용해 보지 않은 사람은 파폭의 편리함을 알지 못한다. 파이어 폭스에서는 다행히도 이 파비콘이 아주 잘 나온다.


파비콘을 직접 그려야 하나요?
 

Are You Crazy? 저 정교한 그림을 나같은 컴초보가 어떻게 그린다는 말인가! 우린 그냥 평범한 누리꾼일 뿐이다. 그렇다면 방법은 없는가? "구하면 얻으리라" 는 그 누군가의 말처럼 무료로 파비콘과 아이콘을 제공하는 사이트들이 도처에 널려있다. 필자가 직접 다녀보고 예쁜 파비콘이 가장 많았던 사이트 세곳을 소개하겠다. 회원가입의 절차도 필요없이 무식하게 다운로드 받으면 만사 OK!

1. http://www.freeiconsweb.com
2. http://iconbase.com
3. http://fasticon.com


파비콘을 다는 방법을 알려 주셔야죠?
 

이제 파비콘을 다운로드 하고 드뎌 웹브라우져에 노출시킬 마지막 단계로 왔다. 맘에 드는 파비콘들을 충분히 다운로드 받았는가? 아니라면 다시 위에서 소개한 사이트로 돌아가서 더 골라보고 다음의 단계로 넘어가길 바란다. 자~ 준비됐나요?


첫번째☞ 티스토리의 관리자 메뉴로 들어가면 아래의 화면이 나오는데 여기서 빨간밑줄이 그어진 환경설정 탭을 클릭한다.
 

사용자 삽입 이미지


두번째☞ 환경설정 탭을 누르면 아래의 화면이 나오는데 여기에서 상단 우측의 기타설정 탭을 클릭한다! (빨간색 밑줄로 그어진 부분을 클릭!)
 

사용자 삽입 이미지


세번째☞ 아래에 보이는 화면이 바로 기타설정 창이다. 여기서 빨간색으로 밑줄친 곳에 있는 찾아보기 버튼을 눌러서 저장해 놓은 파비콘을 지정해 주고 저장하기 버튼을 누르면 끝!
 

사용자 삽입 이미지
  • 이전 댓글 더보기
  • 프로필사진
    lufian2007.12.07 17:20

    안녕하세요^^
    네이버에서 티스토리로 옮기려고 스킨도 만들어보고 여러가지 준비중입니다...ㅋㅋ
    개인적으로 이곳에서 정말 도움 많이 받았어요, 감사드립니다^^
    한가지 궁금한 것이 있는데요..
    저는 댓글이나 방명록에서 아이콘과 파비콘의 크기가 다르게 나타나더군요.
    아이콘은 32의 중간 사이즈, 파비콘은 16사이즈로 나타납니다.
    환경설정에서 아이콘 설정을 중간사이즈로 해두긴 했는데...
    다른분들 블로그는 아이콘 사이즈가 크면 큰대로, 작으면 작은대로
    파비콘 크기와 아이콘 크기가 동일하게 나타나던데요.... 이곳처럼 말이죠...
    게다가 제트님의 블로그는 환경설정에서 선택하는 16,32,48 사이즈가 아닌....
    20픽셀 사이즈로 사용중이시네요.
    스킨편집에서 정해야하는건지, 아직 초보라 제가 모르는 기능이 더 있는건지 궁금합니다.
    저도 아이콘 파비콘 모두 동일하게 20픽셀 전후 사이즈로 보이게 하고 싶어요..^^;

    • 프로필사진
      Favicon of https://bloggertip.com BlogIcon 블로그의 신 Zet2008.01.06 08:18 신고

      스킨에서 설정을 해주어야 합니다.
      즉 여러 블로그에 갈때마다 내 아이콘이 달리 보인다고 보시면 되요. ^^

  • 프로필사진
    Favicon of http://dingga.tistory.com BlogIcon 딩가2007.12.23 19:54

    와.. 파비콘이 뭔가 했더니, 그런거였군요...

    벌써 적용완료.. <-

    좋은거 배워갑니다~

  • 프로필사진
    Favicon of https://blutom.tistory.com BlogIcon 파란토마토2008.01.16 03:18 신고

    작년 7월까지만 해도 초보를 위한 팁이 많고, 또한 경어체를 안쓰셨네요^^;;
    뭔가 지금의 ZET님과는 좀 다른 느낌이 많이 드네요. 폴더도 좀 바뀐 것 같습니다.
    블로그비기너들을 위한 팁들도 필요한데 지금 제가 보면 기본으로 보이겠지만
    그분들한테는 꼭 핑료한 것이겠죠.

  • 프로필사진
    Favicon of http://tomak.tistory.com BlogIcon 부정승차2008.01.24 02:22

    남들 다 쓰는것 같길래 한번 만들어볼려고 검색했더니 블로거팁이 딱! 걸리네요
    티스토리 사용한지 꽤 됐지만.. 초보를 위한 팁에 많은 위로를 받고[ㅠ.ㅜ]갑니다.
    추천버튼이 있으면 꾹 눌러주고 싶은 포스트네요 :)

  • 프로필사진
    Favicon of http://mugoo.tistory.com BlogIcon 수리마수리2008.02.12 20:12 신고

    우와 이거 정말 고맙습니다 ㅋㅋ

  • 프로필사진
    Favicon of http://jihoonsblog.tistory.com/ BlogIcon 차가운소다2008.02.17 13:10

    저는 등록이 안되네요...
    이미지 확장자도 확인했고 정확히 올렸는데..... ㅠ.ㅠ
    이쁘게 구경했어요~

  • 프로필사진
    Favicon of http://jinc24.tistory.com BlogIcon 초우2008.07.17 13:02

    흐음, 파비콘 잘 바뀌네요. 그런데 파폭에선 역시 말씀하신 것처럼 잘 반영되는데 비해
    다른 브라우저는 안되네요...

  • 프로필사진
    Favicon of http://wiessen.tistory.com BlogIcon 애기_똥풀2008.12.24 22:14

    잘 보고 갑니다 '-'
    한 마디 덧붙이자면, Mozilla Firefox, Google Chrome 입니다. 혼동하셨나봐요 '-'

    그리고 말씀하신 대로 했는데, FF에서는 정상적으로 출력됩니다만 크롬에서는 영 말을 안 들으니 -_-;
    이 블로그 파비콘은 크롬에서도 잘 출력되는데 말이지요 ㅠ

  • 프로필사진
    bluesoda2009.05.10 21:51

    좋은 팁 감사합니다. ^^

  • 프로필사진
    손현기2009.05.22 08:32

    EP달렷나?

  • 프로필사진
    봉봉2009.05.22 22:08

    이번엔 달렸나?

  • 프로필사진
    Favicon of http://coro.tistory.com BlogIcon 코로2009.06.05 11:16

    좋은 팁 감사합니다^^
    파비콘이 먼지 지금 알았네요^^
    환경설정에 있어서 먼가 했는데

  • 프로필사진
    Favicon of https://lonajoo.tistory.com BlogIcon 로나쥬2009.07.04 22:53 신고

    자세히 설명해주신 덕분에 파비콘을 처음으로 만들어 봤어요

    감사합니다^-^

  • 프로필사진
    Favicon of http://sheishere.tistory.com BlogIcon 나풀나풀2009.08.05 16:11

    좋은 정보 감사합니다 ^^

  • 프로필사진
    Favicon of http://grian.tistory.com BlogIcon 그리안2009.08.06 09:01

    와우~ 정말 좋은 팁입니다~ ㅋ;; 잘보고가요^^ 근데 적용이 안되고있다는 ㅠ.ㅠ; 흑

  • 프로필사진
    Favicon of https://dohyunchung.tistory.com BlogIcon 막도2009.12.26 13:05 신고

    감사합니다!!

  • 프로필사진
    별인간2010.02.24 18:12

    시도해 봣는데 재밋네요 ^^

  • 프로필사진
    Favicon of http://becomingdr.tistory.com BlogIcon 나르시엘2010.04.12 00:33

    재미있네요 ㅎㅎ 좋은 정보 감사합니다.

  • 프로필사진
    Favicon of https://mark-blog.tistory.com BlogIcon Malk2010.06.30 19:37 신고

    좋은 정보 감사합니다^^

  • 프로필사진
    Favicon of http://sunlifestory.tistory.com BlogIcon 베라드Yo2010.10.25 00:19

    방금만들어 봤는데... 좋은글 잘보고 갑니다.^0^