본문 바로가기
WEB CODING/OPEN SOURCE

웹사이트 파비콘(favicon) 만드는 방법

by uioweb 2020. 8. 11.

파비콘( favicon )이란?

웹브라우저 상단 탭에 웹사이트의 이름 옆 아이콘을 파비콘이라고 한다.

대부분 해당 웹사이트의 로고를 파비콘으로 나타낸다.

 

파비콘( favicon )을 만드는 방법

파비콘을 만드는 방법을 검색하면 대부분 어느 사이트에 가서 이미지 파일 형식을 .ico로 변환 시켜야 한다는 내용들이 대부분이지만 굳이 .ico 파일로 변환하지 않고 .png파일로 작업해서 적용시켜도 된다.

 

- 파비콘 작업 사이즈는 가로 : 16px / 세로 : 16px 가로, 세로 각각 16픽셀로 만들어서 디자인 작업을 한다.

- 디자인 작업이 완료 되면 해당 폴더에 업로드 한 후, HTML 파일 head 태그에 아래 소스를 삽입한다.

 

<!doctype html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Document</title>
   <link rel="shortcut icon" href="img/favicon.png"> <!-- 파비콘 소스 -->
</head>

<body>

</body>
</html>

 

댓글0