- sTUDY pAGE -
Main page My page DC Life Study Link Guest Book

338   1/17

http://oinho.cafe24.com

즐겨찾기 버튼을 웹페이지에 추가하는 방법
Shortcut Icon은 1999년 4월 18일에 출시된 Microsoft® Internet Explorer 5.0에 새롭게 추가된 기능으로 즐겨찾기 메뉴와 주소줄에 조그만 아이콘을 이용하여 로고를 나타내 주는 것으로 웹서버에는 추가적인 기능이 필요없으며, Internet Explorer 5.0 이상의 사용자에게 웹사이트에 대한 브랜드 인식의 좋은 방법 중의 하나로 활용될 수 있습니다.

아래 그림은 Internet Explorer 5.0의 즐겨찾기 메뉴와 주소줄에 Shortcut Icon이 나타난 예이다.




이제 Shortcut Icon을 웹페이지에 나타내는 방법을 알아보도록 하겠습니다.


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>
Prev
 javascript로 이미지 크기에 맞게 새창 띄우기
2003/05/10 5392
Next
 URL 포워딩 방법
2003/05/10 5392
Copyright 1999-2022 Zeroboard / skin by Telles / modify by 키르