[Frontend-HTML] Favicon 홈페이지 적용 방법

HTML를 이용하여 홈페이지의 Favicon을 수정해보자.

---

  1   Favicon이란

파비콘이란 아래 첨부된 사진처럼 홈페이지를 대표하는 작은 아이콘이다.

---

  2   홈페이지에 Favicon 적용하는 방법

head 태그 안에 위와 같이 입력해주면 된다. 만약, Favicon 파일 확장자가 png라면 type을 image/png로 지정해줘야하고 ico이라면 image/x-ico로 지정해줘야한다.

---

  3   클론 코딩 시 Favicon 찾는 방법

1) 크롬으로 클론 코딩할 사이트로 접속한 후 개발자 도구(F12)를 킨다.
2) head 태그 안에 있는 favicon 파일 장소를 찾는다.

마우스를 위에 올려놓으면 파일 위치가 뜬다.

3) 웹 페이지도 결국은 디렉토리 구조이기 때문에 그대로 파일 장소를 웹 주소로 생각하고 입력한다.

위와 같이 favicon 이미지가 출력된다.

---

오늘도 긴 글 읽어주셔서 감사합니다.
공감 버튼 꼭 눌러주세요!