[HTML 강좌] 파비콘 만들고 적용하기
파비콘(Favicon)
홈페이지에 방문하면 페이지 제목 옆에 작은 이미지가 있는 경우가 있습니다.
이를 파비콘(Favicon)이라고 합니다. (Favicon은 'favorites icon'의 약자입니다.)
홈페이지에 파비콘(Favicon)을 적용하려면 두가지 작업을 해야 합니다.
•파비콘 이미지 만들기
•HTML 문서에 코드 넣기
파비콘(Favicon) 만들기
파비콘은 16x16 크기의 이미지 파일로 확장자는 ico입니다. 포토샵이나 Gimp 같은 이미지 편집 소프트웨어로 만들 수도 있고, favicon.cc 같은 온라인 툴을 이용할 수도 있습니다.
파비콘은 그리 정교한 이미지가 아니므로, 온라인 툴을 사용하는 게 편합니다. 또한 공유되는 파비콘도 많아 원하는 모양을 찾아서 다운로드 받을 수도 있습니다.
HTML 문서에 코드 넣기
파비콘을 적용시키려면 서버에 아이콘 파일을 업로드하고, HTML 문서의 <head>와 </head> 사이에 다음과 같은 코드를 넣습니다.
<link rel="shortcut icon" href="/path/favicon.ico">
경로는 파일 위치에 맞게 수정해야 합니다.
블로그에 파비콘 달기
대부분의 블로그 서비스는 파비콘 기능을 포함하고 있습니다. 관리 메뉴를 잘 찾아보면 찾을 수 있습니다.
예를 들어 티스토리 블로그라면 [기본 정보]의 아이콘에서 설정할 수 있습니다.
'홈페이지제작 > HTML' 카테고리의 다른 글
[HTML] 홈페이지에 오디오 삽입 방법 (0) | 2018.02.06 |
---|---|
HTML은 무엇인가? (0) | 2018.02.06 |
html과 html5의 테이블 속성 알아보기 (0) | 2017.11.14 |
HTML5 텍스트 태그 (<strong>~</strong>, <b>~</b>, <em>~</em>, <i>~</i>) (0) | 2017.11.11 |
HTML5 텍스트 태그 (<pre>~</pre> 외 기타 텍스트 관련 태그들) (0) | 2017.11.11 |