파비콘(Favicon.ico)을 활용하자
페이지 정보
조회
25,159
본문
Shortcut Icon의 생성
웹페이지에 태그 만들기
웹페이지에 즐겨찾기 버튼 삽입하기
1. Shortcut Icon의 생성
Shortcut Icon에 사용되는 Icon의 사이즈는 얼마나 되고 어떻게 만들까요?
Internet Explorer 5.0 이상의 사용자가 웹페이지를 즐겨찾기에 등록할 경우 Internet Explorer는 16x16 픽셀의 Shortcut Icon을 웹서버에 요구하게 됩니다. Internet Explorer의 요청을 받은 웹서버는 Internet Explorer가 요청한 16x16 픽셀의 Shortcut Icon만 웹서버에 저장해 두고 서비스해 주면 됩니다.
Shortcut Icon의 생성은 Microsoft Visual Studio®를 사용해서 생성하거나 별도의 Icon 생성 프로그램을 사용하면 됩니다. 이러한 S/W가 없을 경우 www.favicon.com에 접속하여 온라인에서 Icon을 생성하시면 됩니다.
2. 웹페이지에 태그 만들기
Shortcut Icon을 생성하였으면 사용자가 즐겨찾기에 등록할 때에 Icon을 다운받아 등록할 수 있도록 웹페이지에 태그를 만들어 보도록 하겠습니다.
물론 이러한 과정은 Internet Explorer가 알아서 다해 주니까 여러분은 신경 쓸 필요가 없겠지요.
먼저 생성한 Icon을 "favicon.ico" 이름으로 웹서버의 루트 디렉토리나 특정 디렉토리에 저장합니다. 가능하다면 루트 디렉토리에 저장할 것을 권장합니다. [ 만약, Shortcut Icon을 어디에서 참조하라는 태그가 없을 경우 기본적으로 웹서버의 루트 디렉토리에서 "favicon.ico"을 요청하기 때문입니다. ]
자! 이제 웹페이지(HTML)에 Shortcut Icon의 참조 링크를 만들어 보도록 하겠습니다.
먼저 웹페이지의 HEAD 태그에 LINK 태그를 포함시키고, 이 LINK 태그에 참조할 Shortcut Icon의 주소를 입력합니다.
아래 예는 LINK 태그를 삽입하는 예를 보여준 것이며, 모든 웹페이지에 LINK 태그를 삽입해 주어야 합니다.
<HEAD>
<LINK REL="SHORTCUT ICON" HREF="http://www.mydomain.com/favicon.ico">
<TITLE>My Title</TITLE>
</HEAD>
3. 웹페이지에 즐겨찾기 버튼 삽입하기
즐겨찾기에 등록하는 방법으로 즐겨찾기 메뉴를 선택하여 등록하는 경우도 있지만, 웹페이지에 즐겨찾기 메뉴(버튼)를 삽입하여 즐겨찾기에 등록하는 방법도 있습니다. 이 경우에는 Netscape 브라우저를 쓰는 사용자의 경우에도 이를 탐지하여 서버에 정보를 전달할 수 있습니다.
아래 예는 웹페이지의 버튼을 클릭하였을 경우 즐겨찾기 등록창이 나타나도록 하는 스크립트입니다. 이 스크립트 또한 모든 페이지에 삽입해 주는 것이 좋습니다.
<SCRIPT>
<!--
if ((navigator.appVersion.indexOf("MSIE") > 0)
&& (parseInt(navigator.appVersion) >= 4)) {
var sText = "<U><SPAN STYLE='color:blue;cursor:hand;'";
sText += "onclick='window.external.AddFavorite(location.href,";
sText += "document.title);'>Add this page to your favorites</SPAN></U>";
document.write(sText);
}
//-->
</SCRIPT>
관련자료
-
링크
-
첨부
등록된 댓글이 없습니다.
