dev/Next.js

Next.js 15 favicon 변경하기

wndud587 2024. 11. 8. 09:24
728x90

 

목차

1. 파비콘이란?

2. 파비콘 변경 방법

 


 

1 파비콘이란?

파비콘(Favicon)은 "Favorites Icon"의 줄임말로, 브라우저의 탭, 즐겨찾기 목록, 그리고 검색 엔진 결과에서 웹사이트를 대표하는 작은 아이콘을 의미합니다. 주로 웹사이트의 브랜드나 로고를 활용하며, 사용자가 사이트를 쉽게 식별할 수 있도록 돕습니다.

 

2. 파비콘 변경 방법

- Next.js에서 파비콘을 변경하기 이전에 파비콘은 다음과 같습니다.

기본 파비콘

 

- 파비콘의 위치는 /src/app/ 의 폴더에 있습니다.

/src/app/ 폴더

 

- 일반적으로 32x32 또는 16x16 크기의 .ico 파일을 사용하지만, PNG 형식도 지원됩니다. 파비콘 생성기를 사용해 다양한 크기의 파비콘을 만들 수 있습니다.

 

- 구글에서 설명하는 파비콘의 크기는 다음과 같습니다

 

 

- 파비콘을 /src/app/의 폴더에 덮어 씌우고 새로 고침 합니다

파비콘 적용 완료

 

 

 

 

* 이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

728x90