브라우저 탭과 북마크에 표시되는 사이트 아이콘을 연결합니다.
파비콘은 head 안의 link 요소로 지정합니다. PNG, ICO, SVG 등을 사용할 수 있고 정사각형 이미지를 준비하는 것이 일반적입니다. 실습 결과 iframe에서는 탭 아이콘을 직접 보기 어려워 연결 문법을 화면에 표시합니다.
예제에서는 <link rel="icon" href="/favicon.ico"> 부분부터 찾으세요. 태그 이름만 외우기보다 부모·자식 관계와 속성이 어느 요소에 붙는지를 한 덩어리로 읽으면 구조를 고치기 쉬워집니다.
먼저 현재 결과를 확인한 뒤 favicon.ico를 /images/favicon.png 경로로 사용하는 문법으로 바꿔보세요. 수정 전에는 예상한 변화를 한 문장으로 적고, 실행 뒤에는 정보 순서와 키보드 접근까지 그대로인지 살펴보세요.
파일 경로와 MIME type이 실제 아이콘 형식과 맞는지 확인하세요.
직접 바꿔보세요favicon.ico를 /images/favicon.png 경로로 사용하는 문법으로 바꿔보세요.