문서의 이전 판입니다!


파비콘 (Favicon)

웹 브라우저에 따라 특정 사이트에서 이 익스플로러 마크의 아이콘이 나타나야 할 부분에 전혀 다른 아이콘이 나오는 경우가 있을것이다.

이것을 흔히 파비콘(Favicon)이라고 불리는 것들이다. 최신 웹브라우저에서는 다 지원한다.

아래 사이트에서 만들고 다운로드한 뒤 자신의 웹사이트 제일 상위 폴더에 넣으면 된다.

혹은 html 문서의 <header>… </header> 사이에 다음과 같은 문구를 넣으면 된다.

<link rel="shortcut icon" href="/favicon.ico" />

애플터치아이콘 (Apple touch icon)

애플의 iOS의 경우 사파리에서 웹페이지의 링크를 바탕화면에 만들면 앱 아이콘이 만들어지는데 이것을 지정할 수 있다. 다음과 같이 한다.

PNG 이지만, 투명도를 지원하지 않는다.

<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png">

도쿠위키 템플릿에서는 tpl_favicon함수를 이용하여 간단히 설정할 수 있다.

<?php echo tpl_favicon(array('favicon', 'mobile')) ?>

미디어 폴더 최상위에 favicon.ico, apple-touch-icon.png 파일을 올리면 된다.