반응형
파비콘이란?
파비콘은 아래 그림처럼 웹사이트 타이틀 앞에 오는 작은 그림입니다.



파비콘 태그
<link rel="SHORTCUT ICON" href="favicon.ico">
밑줄친 부분에 그림파일 경로를 적어주면 됩니다.

Firefox와 IE에서 적용하기
IE외의 브라우저에서는 .ico 파일 대신 일반 그림파일인 jpg, gif, png을 파비콘으로 사용할 수 있지만
IE에서만은 꼭 .ico 파일을 사용해야 하는 것 같습니다.
.ico 파일은 윈도우에서 사용되는 아이콘 그림 파일입니다.

파비콘 만들기
1. jpg, gif, png 파일로 만든다.
16X16 크기의 그림파일로 만들어 주면됩니다만... 위에서 말한 것처럼 IE에선 적용 안됩니다.

2. .ico를 만들어주는 프로그램을 이용한다.
오픈 캡처라는 프로그램이 있습니다.
그 프로그램으로 만들 수는 있지만 배경 투명이 지원되지 않습니다.
배경투명 지원되는 다른 프로그램 아시면 좀 알려주세요~

참고로 오픈캡처 다운은 아래에서
http://openproject.nazzim.net/

3. 포토샵 플러그 인을 사용한다.
http://rusk.tistory.com/108
위 블로그에서 알아낸 방법입니다.

위 파일을 다운 받고
C:\program files\adobe\photoshop cs3\plug-ins 에 COformat8b 라는 폴더를 만들어 파일을 넣은 뒤
포토샵을 실행시키면 '다른 이름 저장(save as)' 시에 .ico 파일로 저장 가능합니다.

배경 투명 지원 됩니다. 저도 이 방법으로 사용중입니다.

참고로 적용이 안된다 싶을 땐 브라우저의 임시파일을 삭제 후 다시 접속해 보세여~

제로보드(XpressEngine)에서 파비콘 적용하기
요즘은 제로보드의 오픈소스 버전인 XpressEngine 이라는 프로그램을 사용중인데요...
XpressEngine으로 만든 사이트에 적용하기 위해선 레아아웃 스킨인 layout.html 파일에 넣어주는 방법이 가장 쉬운 방법입니다.
하지만 모든 페이지에서 적용하려면 다음 파일에 넣어주어야 합니다.
/common/tpl/common_layout.html

저처럼 모든 페이지에 적용한다고 루트에 있는 index.php 파일에는 절대 적용하지 마시기 바랍니다.
IE이외의 모든 브라우저에서는 문제가 없지만...
IE6에서는 화면이 깨지거나 내용이 잘 나오지 않고,
IE7에서는 아예 '웹 사이트를 표시할 수 없습니다'라는 문구가 나옵니다.
이 버그 찾느라 고생 좀 했어요... ㅜㅜ;;


파비콘은 있으면 당연하고 없으면 참~ 없어보입니다~ ^^;
블로그 운영하시는 분들은 간단한거라도 하나만들어서 적용해 보세요~
반응형

+ Recent posts