파비콘(favicon) 만들기
CSS 24.02.08Favicon(파비콘)은 웹 페이지나 웹 사이트를 대표하는 아이콘입니다.
"파비콘"은 "Favorites Icon"의 줄임말로, 사용자가 웹 브라우저의 즐겨찾기에 웹 사이트를 추가할 때나 웹 페이지를 열 때 주소 표시줄에 나타나는 작은 이미지입니다.
일반적으로 파비콘은 16x16 픽셀 크기의 작은 이미지로 제작되며, ICO(Windows 아이콘) 형식이으로 쓰입니다.
파비콘은 웹 페이지의 브랜딩에 사용되며, 사용자에게 웹 사이트를 식별하고 기억하기 쉽게 도와줍니다.
일반적으로 파비콘은 16x16 픽셀 크기의 작은 이미지로 제작되며, ICO(Windows 아이콘) 형식이으로 쓰입니다.
파비콘은 웹 페이지의 브랜딩에 사용되며, 사용자에게 웹 사이트를 식별하고 기억하기 쉽게 도와줍니다.
1. png를 icon으로 변환
png를 icon으로 변환해주는 사이트에서 파일을 업로드하고 다운로드 받습니다.
2. <head> 파비콘 지정
웹 페이지의 HTML <head> 섹션에서 다음과 같은 방식으로 파비콘을 지정할 수 있습니다.
1 2 3 4 5 6 7 8 9 10 11 12 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="icon" href="/파일경로/favicon.ico" type="image/x-icon"> <title>Your Web Page</title> </head> <body> <!-- Your web page content goes here --> </body> </html> | cs |
위의 코드에서 link 요소의 rel 속성 값으로 "icon"을, href 속성에는 파비콘 이미지 파일의 경로를 지정합니다.