컴퓨터 엑셀 워드 포토숍 구글어스 WINDOWS JAVASCRIPT JAVA C++

 
Previous Post Excel/엑셀 VBA] 이번 주는, 올해 몇 번째 주? 구하기/출력; get WEEK O...Excel/엑셀 VBA] 날짜/시간 (년월일 시분초) 구하기; Date Time Leadi...배치 파일 안에서, EXE 파일 실행 법; Batch File에서 실행파일 호출HTML 태그] 다운로드 링크 만드는 법, 파일에 링크하는 방법; File Download...Excel/엑셀 VBA] 2진수 10진수 변환 함수; 이진수 십진수; Dec To Bin ...Excel/엑셀] 2진수 10진수 변환 함수; 이진수 십진수; DEC2BIN / BIN2D...옛날 구글 검색 화면 캡처(스냅샷) - Google 초창기 1998 년도 Capture S...일본어판 지식 검색: 教えて!goo (Oshiete goo); 일본의, 네이버 지식인에 해...Java/자바] 숫자 앞에 공(0), 제로(영) 붙이기-추가. Leading Zero to...Java/자바] 날짜/시간 타임 스탬프 출력; Print ISO Time Stamp

Favicon (파비콘;사이트 아이콘) 넣는 법, Site Icon HTML Tag(태그); favicon.ico

Saturday, January 27, 2007

브라우저 주소창의 URL 왼쪽에 16x16 픽셀의 조그마한 아이콘을 넣는 방법입니다. 이런 아이콘을 "파비콘(favicon; favorites icon)"이라고 합니다. 원래 MS가 IE 브라우저를 위해서 만든 것입니다. 그래서 웹 표준이 아니지만 파이어폭스에서도 잘 지원됩니다.

실은 몇 년 전부터 IE에서는 파비콘이 잘 보이지 않게 되었습니다. 이제는 오히려 파이어폭스에서 파비콘이 더 잘 보이더군요.


favicon.ico 파일 만들기


우선 favicon.ico 라는 파일명의 아이콘 파일을 만들어야 합니다.

마이크로안젤로 같은 아이콘 편집기를 사용하여 만들면 됩니다: ▶▶ 윈도우 아이콘/마우스 커서 편집 프로그램: Microangelo Toolset (마이크로안젤로)

되도록 16x16 픽셀의 소형 아이콘으로 저장해야 합니다.

그런 후 아이콘 파일을 서버에 올립니다. 지오시티(Geocities) 등의 서버에서는 .ico 확장자 파일을 거부하는데, 이때는 favicon.ico 를 favicon.zip 등으로 확장자를 변경하여 업로드한 후, 다시 이름을 favicon.ico 로 고쳐 주어야 합니다.



Favicon 추가 태그


웹페이지의 <head></head> 태그 사이에 다음의 코드를 삽입하면 됩니다.

<link rel="shortcut icon" type="image/x-icon" href="http://www.example.com/favicon.ico" />

위의 코드에서 www.example.com 이라고 된 부분을, 자신의 실제 주소로 바꾸어 주어야 합니다.



브라우저 주소창에 파비콘 (URL 아이콘) 넣기 예제


HTML 페이지의 최종적인 형태는 다음과 같습니다:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>페이지 제목</title>
<link rel="shortcut icon" type="image/x-icon" href="http://www.example.com/favicon.ico" />
</head>

<body>
... 여기서 부터 본문 시작 ...


헤드 태그 속의 맨 마지막에 넣으면 적당합니다. 별로 중요한 요소가 아닌 것은 되도록 아래쪽에 넣는 것이 좋습니다.


만약 파일명을 favicon.ico 로 할 수 없는 경우에는 다른 파일명을 지정해도 괜찮습니다.

그런데 favicon.ico 파일은 서버의 루트 디렉토리(최상위 디렉토리)에 있어야 합니다. 그렇지 않고 하위 디렉토리 속에 있으면 IE에서 인식을 못하더군요.



IE 6 브라우저에서 Favicon 이 보이지 않는 문제


파이어폭스에서는 Favicon 이 항상 잘 보입니다. 그렇지만 IE 에서는 좀 문제가 있습니다. 해당 사이트의 파비콘을 보기 위해서는, 우선 Ctrl+D키를 눌러 그 사이트에 대한 북마크를 만든 후, IE를 닫고 다시 실행하여 그 사이트를 재방문해야, 주소창에 파비콘이 보이는 문제가 있습니다. 그렇지만 이 방법도 확실하게 잘 되는 것은 아닙니다.




▶▶ HTML-CSS] 메타 태그 종류; META TAG 목록

▶▶ IE 6의 '이미지 도구 모음' 상자를, 완전히 제거하는 메타 태그; (meta Tag) [HTML-CSS]

0 Comments:

Post a Comment

<< Home RSS 2.0 feed

구글 Google 에서 제공하는 무료 블로그 서비스인 블로거 Blogger 의 인터넷 주소는 www.blogger.com 입니다. Blogger 에 블로그를 만들면, blogspot.com 이라는 주소에 블로그가 생성됩니다.
블로그를 직접 방문하지 않고도 최신 게시물을 구독하려면 RSS 2.0 feed 주소를 리더기에 등록하시면 됩니다.
Categories
Previous Posts
Monthly Archives
Top