[HTML] Spring boot 프로젝트에서 favicon 설정

🙌잘못된 설명에 대한 지적이나 조언의 댓글을 환영합니다🙌

 

favicon이란

웹 브라우저의 탭 영역에 표시되는 홈페이지의 대표 아이콘

favicon.ico 라는 파일명과 확장자로 이미지를 변환시켜 사용한다.

 

favicon 설정을 하게 된 이유

항상 시간에 쫓기는 개발을 할수밖에 없었던 업무 특성상 기능을 붙이는 게 더 중요했기 때문에 홈페이지의 favicon 설정은 뒷전이었다. 하지만 미팅때 실제 유저들을 만나면 해당 웹페이지에 쉽게 접근하고, 구분하기 위해 아이콘을 넣어달라는 요청이 많았다. 간단한 작업이었지만 우선순위가 긴급한 안건들을 처리하고 이제야 시간이 나 프로젝트에 favicon 설정을 시도했고, 간단한 설정이었지만 프로젝트 구조에 따라 해당 파일을 넣어야하는 위치가 달라지기 때문에 시행착오를 겪었다. 구글링을 해도 spring 프로젝트에서 어디에 favicon 파일을 넣고 설정해야하는지 알려주는 글이 없어서 아쉬워서 남겨보는 글이니 누군가에게는 도움이 되길 바란다.

 

프로젝트 폴더구조

어떤 환경설정을 하는지에 따라 달라질 수 있지만, 우리는 src/main/webapp 하위에 resources 폴더가 있고 css, js, font, img 등 웹페이지에서 사용하는 코드들을 폴더별로 분리하여 관리한다. tiles도 사용중이기 때문에 웹페이지의 기본 틀이 되는 classic.jsp 파일의 head 태그 안에 link 태그를 넣어 favicon 설정을 한 뒤 src/main/webapp/resources 폴더 바로 아래에 favicon.ico 파일을 추가하여 설정을 완료했다. 

폴더구조

<link rel="shortcut icon" href="favicon.ico">