파비콘(Favicon) 설정하기
2023. 1. 6. 15:47ㆍ기술/HTML,CSS
728x90
파비콘(Favicon) 이란?
파비콘이란 즐겨찾기(favorites)와 아이콘(icon)의 합성어로
특정 웹사이트에 방문했을 때 웹 사이트 주소 옆이나 브라우저 탭에 나타나는 작은 로고이다.
HTML에 파비콘 추가하기
파비콘 생성하기
*파비콘 파일
확장자 : ico, png
사이즈 : 16x16 기본규격이나 32x32 이미지 사이즈로 해도 정상표현 됨.
*파비콘 생성 홈페이지
https://www.favicon-generator.org/
Favicon & App Icon Generator
Upload an image (PNG to ICO, JPG to ICO, GIF to ICO) and convert it to a Windows favicon (.ico) and App Icons. Learn more about favicons.
www.favicon-generator.org
파비콘으로 설정할 이미지 선택 후,
Create Favicon을 클릭해 주세요
Download the generated favicon 파란 글씨를 클릭해 원하는 폴더에 압축을 풀어줍니다.
HTML 파일에 적용하기
<head> </head> 안에 적용시켜 준다.
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
완료되면, 안녕소프트 홈페이지 옆에 파비콘으로 설정한 이미지가 들어가게 된다.
728x90
'기술 > HTML,CSS' 카테고리의 다른 글
| [HTML/CSS] 리스트 마크 디자인 정하기 list-style 종류 (0) | 2023.01.25 |
|---|---|
| [HTML,CSS] 글자와 이미지 디자인 속성 알아보기 (0) | 2023.01.20 |
| [HTML/CSS] 링크 박스 만들기 (0) | 2022.12.29 |
| [HTML/CSS] 토글 버튼 만들기 (0) | 2022.12.29 |
| [HTML] 헤더 내비게이션 메뉴 만들기 (0) | 2022.12.27 |