HTML Favicon
HTML favicon은 웹 사이트의 브라우저 탭에 표시되는 작은 아이콘입니다.
"파비콘"은 "Favorites Icon"의 줄임말로 알려져 있으며, 브라우저 북마크 목록이나 웹사이트를 탭으로 열었을 때 아이콘으로 표시됩니다.
이 아이콘은 사용자에게 웹 사이트의 식별성을 제공하고 브랜딩을 강화하는 데 도움이 됩니다.
HTML favicon은 일반적으로 ICO 형식의 이미지 파일로 제공됩니다.
그러나 최근에는 PNG, GIF, JPEG 등 다른 이미지 형식도 지원됩니다.
일반적으로 웹 사이트 루트 디렉토리에 "favicon.ico"라는 이름으로 파일을 배치하면 브라우저가 이를 자동으로 인식합니다.
또는 HTML 문서의 <head> 섹션에 <link> 요소를 사용하여 다른 파일 이름을 지정할 수도 있습니다.
아이콘은 일반적으로 16x16 픽셀 크기의 작은 이미지로 제작됩니다.
브라우저에 따라 다양한 크기의 아이콘을 지원할 수도 있습니다.
대부분의 브라우저는 웹 사이트 루트 디렉토리에 배치된 favicon.ico 파일을 자동으로 로드하며,
지원하는 다른 크기의 아이콘도 찾을 수 있습니다.
Favicon은 웹 사이트의 브랜드 이미지, 로고 또는 다른 시각적 요소를 나타내는 데 사용될 수 있습니다.
웹 사이트의 아이콘이 브라우저 탭이나 북마크 목록에서 잘 인식되고 구별되도록 선택하는 것이 좋습니다.
How To Add a Favicon in HTML
<!-- 예시 -->
<!DOCTYPE html>
<html>
<head>
<title>My Page Title</title>
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>파비콘 만들 수 있는 사이트 : https://www.favicon.cc/
favicon.ico Generator
Preview Favicon in original size:
www.favicon.cc
'FRONTEND > HTML' 카테고리의 다른 글
| HTML 튜토리얼 - HTML Tables (0) | 2023.07.19 |
|---|---|
| HTML 튜토리얼 - HTML Page Title (0) | 2023.07.17 |
| HTML 튜토리얼 - HTML Images (0) | 2023.07.14 |
| HTML 튜토리얼 - HTML Links & URL 구조 (0) | 2023.07.13 |
| HTML 튜토리얼 - CSS (0) | 2023.07.12 |