Favicon(파비콘) 안보이는 경우 해결하기(최종)
제 블로그부터 이사하면서 새로 도메인을을 바꿨더니 갑자기 파비콘이 제대로 표시가 안되는 것이었습니다.
그래서 이번 참에 "파비콘 너를 제대로 분석해보겠다~!"라는 각오로 차근차근 문제해결을 해나가는 기회를 가져보도록 하겠습니다.
| 사이트 방문자 측면 |
▲ 증상1: 인터넷 익스플러어에서 방문한 사이트의 파비콘이 표시가 안된다.
▲ 증상2: 잘 보이던 파비콘이 어느 날 갑자기 표시가 안된다.
▲ 원인
1) 위 증상들이 파이어폭스나 오페라, 사파리 등의 타 브라우저에서는 잘 나타나지 않습니다.
2) 대부분의 원인이 인터넷 익스플러어의 파비콘 처리 방식과 버그 때문이라고 알려져 있습니다.1
인터넷 익스플러어는 파비콘 이미지를 임시 인터넷 폴더에 기본적으로 저장하게 되는데 이 폴더의 캐시가 제대로 반영이 안되거나 백신 프로그램 등에 의해 삭제가 되어서 위와 같은 증상이 나타나게 됩니다.
그래서 파비콘이 출력되어야 할 사이트를 방문해도 파비콘이 안보이거나 즐겨찾기를 해도 바로 반영이 안되는 경우에는 인터넷 익스플러어를 다시 시작하거나 컴퓨터를 다시 시작하면 대부분은 해결이 됩니다.
대신 캐시가 삭제된 경우에는 어쩔 수 없이 해당 사이트를 다시 방문해서 새로 즐겨찾기를 해야 즐겨찾기 목록에 파비콘이 반영이 됩니다.2
| 사이트 운영자 측면 |
자 만약 당신이 블로그나 사이트 운영자라면 좀 더 심각하게 고민이 생깁니다.
사이트를 방문자에게 어필하기 위해 수고스러움을 무릅쓰고 파비콘을 만들었는데 방문자 브라우저3에 제대로 표시가 안되면 낭패이죠.
이런 경우의 원인은 앞서 언급한 문제요인들을 포함한 여러가지의 경우일 확율이 높습니다.
따라서, 하나의 정답이 있을 수가 없고 문제가능성이 있는 부분부터 차근차근 제거해나가야 합니다.
1. 표시여부 확인
우선 내 컴퓨터에서 내 사이트(또는 블로그)의 파비콘이 안보인다고 해서 다른 방문자들까지도 안보이는 게 아닐 수도 있습니다.
정상적으로 파비콘 아이콘이 올라가 있고 다른 사람들에게는 보여지는데, 단지 내 컴퓨터의 익스플러어 문제로 안보일 수도 있기 때문에 사이트에 이상없이 등록되어 있는지 체크를 먼저 하는 게 좋습니다.
체크하는 방법은 단순히 자기 사이트 URL 다음에 "/favicon.ico"를 붙인 주소를 접속해서 제대로 이미지가 보이는 지 보는 겁니다.
이 방법으로 의심이 쉬이 가시지 않는다면 별도로 체크해주는 사이트에 방문하셔도 됩니다.
▶ http://www.make-a-favicon.com/favicon_test.php
2. 아이콘 확인
다음 순서로는 파비콘의 이미지 즉 아이콘이 형식에 맞는 제대로 된 것이냐를 체크해봐야 합니다.
우리의 익스플러어는 너무 멍청해서 이미지가 조금이라도 잘못되어 있거나 크기가 좀 크면 제대로 소화를 하지 못한다고 하네요.
크기는 16x16 사이즈나 32x32 사이즈가 가능한데 가급적이면 작은 크기가 좀 더 유리하다고 합니다.
특히 요즘에는 이런 파비콘을 만들어주는 사이트들도 많습니다.
포토샵이나 이미지뷰어에서도 저장이 가능하지만, 가급적이면 이런 사이트를 이용하는 것을 권장합니다.
제 경우가 그랬던 경우인데, 이미지뷰어로 만든 파비콘이 확장자만 ico 였지, 실제로는 뭔가 문제가 있었던 것이었죠.
아래 그림을 한번 볼까요?
윈도우즈 탐색기에서 관련 이미지들을 본 상태입니다.
같은 ico 파일인데 위에 아이콘("파비콘_투명_소1.ico")은 썸네일이 표시가 되고 아래 아이콘("파비콘_투명_소.ico")은 표시가 안됩니다.
차이점은 위에 아이콘은 별도 사이트에서 만든 것이고 아래 것은 이미지뷰어에서 만든 것입니다.(소스 이미지는 동일하게 "파비콘_투명_소.gif"입니다.)
처음부터 뭔가 문제가 있는 아이콘을 사이트에 올려두고 파비콘으로 지정하면 그만큼 제대로 안될 확률이 높다고 보입니다.
참고로 제가 이용한 파비콘 사이트입니다. ▶ http://tools.dynamicdrive.com/favicon/
3. HTML 설정
파비콘이 정상적으로 사이트에 올라가 있다면 이제 그걸 제대로 호출을 해줘야 됩니다.
보통 티스토리 계정을 이용하시는 분이라면 아래와 같은 html 소스로 되어 있을 겁니다.
혹은 절대 주소를 바로 지정해주는 경우도 있죠.
일반적으로 이렇게 해서 제대로 표시가 되면 문제가 없는데, 표시가 안된다면 아래와 같이 html을 수정해보세요.
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
중요한 것은 favicon 앞에 슬래시(/)가 붙은 것입니다. 이렇게 하면 브라우저에게 좀 더 강제성(?)을 줄 수 있다고 합니다.
추가로 인터넷 익스플러어가 한 번 말해서 못 알아들을까봐 2번 호출해주는 센스를 보여줍니다~
4. Favicon refresher
이럴 때는 위에 방문자 측면에서 설명드렸던 favicon refresher라는 프로그램을 통해 강제로 파비콘을 refresh 해주면 속썩이던 컴퓨터에서도 파비콘이 제대로 출력이 되는 기적(?)을 목격하실 수 있습니다. :)
이상으로 단계별로 차근차근 살펴보았는데요, 제 경우에는 파비콘을 전문 사이트에서 새로 만들고 3번 단계에서와 같이 html 수정을 해서 파비콘 출력에 성공했습니다.
혹시 파비콘 때문에 고생하시고 계신 분들은 한 번 따라서 해보시고 계속 문제가 생기시면 답글이나 트랙백을 보내주세요.
'IT·Computer > 유용한 팁' 카테고리의 다른 글
| 업무용 PC에서 윈도우즈 사용자정보 수정하는 방법 (0) | 2009/11/27 |
|---|---|
| 오페라 브라우저의 트레이 아이콘 없애는 방법 (7) | 2009/05/05 |
| 오페라 설정 자료 (0) | 2009/05/05 |
| Favicon(파비콘) 안보이는 경우 해결하기(최종) (28) | 2009/05/01 |
| 오페라 한글입력 오류 해결방법 (0) | 2009/04/20 |
| Favicon (파비콘) 안보이는 경우 해결하기 (8) | 2009/04/07 |
favicon.zip
CSS
2009/05/01 07:44
오 좋은 정보네요. 차근히 읽어보고. 제 블로그에도 파비콘 적용해봐야겠네요.
파비콘 업로드가안되더라고요. 티스토리에 ㅎㄷㄷ
2009/05/01 09:34
피아랑님 이른 아침부터 방문해주셔서 감사해요^^
전 바보짓하고 오느라 이제야 댓글 답니다 ㅠ
2009/05/01 11:50
흐흐.. 드디어 성공~
저의 문제는 ICO 파일 변환에 있었던거 같습니다..
위에 알려주신 사이트에서 변환하니
ICO파일이 미리보기 이미지가 나오네요..
제가 변환 한 사이트에서는 미리보기 이미지가 안 나왔었거든요..
여기에 리플래쉬 프로그램도 돌리고 재시작 했더니..
안되는 겁니다..
아~ 일이나 해야겠다 하고 블로그 서브로 들어갔더니만
파비콘이 쨘~
기분 좋네요..
너무 감사합니다~
==========================
이렇게 신경쓰고 계셨다니 ^^;
2009/05/01 09:36
오 성공하셨다니 다행입니다^^
사실은 저도 걱정이 돼서 텍사스양님 블로그 가서 파비콘 다운받아서 제 블로그 서브에 적용도 해봤답니다. ㅎㅎ
고생한 보람이 있어서 기분이 좋네요~
즐거운 하루 되세요.
2009/07/23 00:03
안녕하세요?
저도 파비콘때문에 블로그 개설후 굉장히 고생했는데요~
아이헌터님의 블로그를 늦게나마 접하게 되어 해봤습니다~
아이헌터님께서 하라는대로 다해본 결과~~
절반의 성공만이 돌아왔네요..ㅠ
즐겨찾기로 설정해놓은 제 블로그명 앞에만 파비콘이 들어가있고
주소 옆에는 그대로이네요..ㅜ
이건 어떤 문제일지..
참 풀기 힘든 숙제네요..ㅠ
몇번 실수해서 파비콘 재설정이라도 하게되면 설정시키는데
시간도 오래걸리고..
혹시라도 제 문제 해결방법 아시면 좀 알려주세요~
감사드리고 부탁드립니다~
2009/07/23 21:17
superVisor님 블로그에 IE, 파이어폭스, 오페라, 크롬 4가지 브라우저로 접속해봤는데 오페라만 제외하고는 모두 정상적으로 파비콘이 보이고 있습니다.
아마 superVisor님 컴에서만 안보일 확률이 높은데, 이런 경우 해결을 위해서 "사이트 운영자 측면"의 내용을 순서대로 한번 따라해보시구요..(소스 보니까 완전히 똑같게 하시지는 않은 것 같더군요.^^;)
가급적이면 파비콘 크기를 16x16으로 전문 사이트에서 만들어 보실 것을 권합니다.
(현재는 48x48이십니다)
2009/07/24 21:13
아이헌터님 말씀하신대로 하고 이것저것 하다보니
오늘 좀전에 다시 접속해 보니 완벽히 되네요,ㅎㅎ
막히는거 았으면 아무것도 못하는 성격이라 정말 답답했었는데
도움주셔서 너무 감사합니다~
항상건강하세요~~
2009/07/24 23:06
해결되었다니 축하드립니다^^
2009/10/10 14:47
wow 파비콘 때문에 검색하다가 들어왔네요.
결국은 저 favicon 프로그램을 이용해서 강제로 즐겨찾기에 있던 사이트들의
파비콘을 전부 불러오게 됐네요. 기적(?)을 맛봤습니다 :-)
제꺼 보니 바탕이 검은색으로 되어있네요. 투명이라 그런가? 얼른 수정해야겠어요
방법 감사합니다
2009/10/13 11:36
댓글이 늦어 죄송합니다.
저도 파비콘 때문에 고생을 많이 했던 터라 다른 분들에게 조금이나마 도움이 되었으면하는 마음으로 작성한 글입니다.
도움이 되었다고 하니까 저도 너무 흐뭇하네요.^^
즐거운 하루 보내세요~
2009/11/09 21:57
비밀댓글 입니다
2009/11/11 03:30
안녕하세요? 답글이 늦어 죄송합니다.
블로그에 방문을 해봤는데, 처음에는 파비콘이 뜨지않다가(IE8 사용중입니다.) 파비콘 URL로 강제로 한번 더 방문했더니 그제서야 파비콘이 캐시가 됐는지 표시가 되기 시작했습니다.
아무래도 파비콘 이미지 자체에 문제가 있는 것 같습니다.
우선 위에 글대로 차근차근 따라해보시되, 특히 2번의 아이콘 확인 부분을 잘 확인해보세요.
블로그아이콘을 그대로 사용하지 마시고, 가급적 작은 크기로 별도 사이트에서 따로 만들어서 이용해보세요~
2009/11/11 03:52
감사합니다 'ㅅ'乃
Mr.Pro
2010/01/01 20:47
저는 refresh 프로그램 돌리니깐 바로 되네요 ^^
트랙백보고 달려왔는데 되서 다행이에요 ^^
감사합니다.
2010/01/02 00:08
된다니까 다행이네요^^
다른 브라우저에 비해서 인터넷 익스플러어만 유독 문제있는 거 보면 MS에서 조금 더 신경써야할 문제인 것 같습니다.
새해 복 많이 받으세요~
2010/01/13 13:49
전 잘보이는데 친구컴에선
안보이면 무슨경우죠 ㅋㅋㅋ
친구컴이 잘못있는건가요?
2010/01/13 22:26
아무래도 친구분 컴퓨터에 문제가 있는 것 같긴 합니다.
제 컴퓨터에서는 yabawi님 블로그 파비콘이 잘 보이네요^^
아무튼 인터넷익스플러어는 이상하게 다른 브라우저에 비해 파비콘 표시가 문제가 많은 편이라 불만이긴 합니다. ㅠ
2010/01/14 23:33
감사합니다 ^^
HL
2010/03/04 10:01
좋은정보 감사합니다! 이제 해결됐습니다 ㅠ_-
2010/03/04 18:08
도움이 되어서 기쁩니다 ^.^
2010/03/26 04:32
파비콘에 대한 정말 자세한 설명이군여, 잘 읽었네여
2010/03/29 17:01
방문해주셔서 감사합니다.^^
2010/06/07 23:38
제 웹사이트의 파비콘이 안떠서 엄청 속상했는데, 여기 올려주신 favicon refresher 프로그램으로 해결했습니다. 이제야 속이 시원하네요. 자세한 설명 감사드립니다.
2010/06/11 10:49
해결하셨다니 다행입니다~
2010/07/22 21:56
아.. 몇년전 부터 궁금하던 것이었는데..해결이 되었네요~ 좋은 정보 감사합니다.
2010/08/31 12:48
인사가 늦었지만 방문 감사 드립니다.^^
p.s. 블로그가 너무 멋집니다~ 충격인데요^^
^^
2010/07/23 14:23
감사합니다.~~ 컴 다시 미는 바람에 파이콘이 안보였는데..해결됐어요..^^
2010/08/31 12:48
방문 감사 드립니다.^^