Favicon을 알아봅시다

Favicon의 특성을 알아보기

 

✔️ Favicon은 무엇인가요?

Favicon은 웹 페이지 상단의 탭에 보여지는 조그마한 아이콘입니다.

 

 

저의 구글 북마크 지정한 사이트들인데요

 

흔히 북마크를 지정하거나 즐겨찾기를 활용하면 같이 표시되는 작은 아이콘인데,

특정 웹 사이트를 방문할 때 브라우저가 웹 사이트의 루트 디렉토리에서

favicon.ico 파일을 찾아서 이 아이콘을 표시합니다.

 

 

✔️ Favicon을 HTML에서 사용하는 법

브라우저가 이것을 자동으로 찾기 때문에 우리는 루트 디렉토리에서 찾을 수 있도록

favicon.ico 파일만 잘 등록해주고, 따로 html에서 등록할 필요가 없습니다.

 

 

html에서 따로 등록할 필요는 없지만, 자신이 원하는 이미지 파일로 대체해서 올릴 수 있는 방식이 있습니다.

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

 

link 태그를 이용하여 href에 해당하는 곳에 자신이 원하는 사진을 경로를 이용해서 지정해주면 됩니다.

 

Favicon은 웹 사이트에서 자기 사이트의 브랜드를 나타내는 중요한 요소 중 하나이기 때문에,

프론트엔드 개발자라면 반드시 알아야 하는 목록 중 한가지로 꼽을 수 있겠습니다.