이미지로 favicon 만드는 방법
업데이트
favicon은 브라우저 탭에 표시되는 작은 아이콘으로, .ico 파일로 저장됩니다. 만드는 방법은 정사각형 이미지를 준비해 변환하는 것입니다: EditItAll의 PNG를 ICO로 변환하는 도구를 열고, 로고를 넣은 다음 .ico 파일을 다운로드하세요. 브라우저 안에서 처리되므로 이미지가 업로드되는 일은 없습니다.
지금 바로 — 무료, 브라우저에서
Open the PNG → ICO converterfavicon이란, 그리고 필요한 형식
favicon은 브라우저가 탭, 북마크, 방문 기록에서 사이트 이름 옆에 표시하는 작은 이미지입니다. 전통적인 형식은 ICO로, 대부분의 브라우저가 별도 설정 없이 인식하는 작은 아이콘 파일입니다.
좋은 favicon에는 두 가지 조건이 있습니다. 거의 정사각형이어야 하고, 손톱만 한 크기로 줄어들어도 알아볼 수 있어야 합니다. 그래서 favicon은 정교한 사진보다 굵은 글자 하나, 로고 마크, 또는 단순한 도형으로 만드는 경우가 많습니다.
.ico로 이미지 변환하기
정사각형 로고가 이미 있다면, 변환은 한 단계로 끝납니다:
- PNG를 ICO로 변환하는 도구를 열고 이미지를 넣으세요.
- 변환이 끝나면
.ico파일을 다운로드하세요. - 사이트에
favicon.ico로 추가하거나 HTML에서 참조하세요.
다른 형식으로 시작하시나요? 사진이나 플랫한 로고에는 JPG를 ICO로 변환하는 도구를, 벡터 이미지라면 SVG를 ICO로 변환하는 도구를 사용하세요. 벡터 소스가 이상적인 이유는 아이콘에 필요한 어떤 크기로든 깔끔하게 그려지기 때문입니다. 모든 변환은 브라우저 안에서 이루어지므로 이미지가 업로드되는 일은 없습니다.
먼저 깨끗한 정사각형 원본 준비하기
아이콘의 품질은 원본 이미지의 품질을 넘어설 수 없습니다. 이미지가 정사각형이 아니라면 사진 편집기에서 먼저 정사각형으로 잘라, 변환 도구가 추측하지 않게 하세요: 중요한 부분을 가운데에 두고 나머지는 잘라내세요. 복잡한 그림은 하나의 강한 형태나 글자로 단순화하세요. favicon 크기에서는 세밀한 디테일이 뭉개져 버립니다.
로고가 벡터 형태로 존재한다면 가능한 한 오래 SVG 상태로 유지하다가 마지막에 ICO로 변환하세요: 벡터는 작은 비트맵을 확대하는 대신 정확한 픽셀 크기로 렌더링되기 때문에 선명함을 유지합니다. 벡터를 깔끔하게 래스터화하는 방법에 대한 관련 배경 지식은 품질 손실 없이 SVG를 PNG로 변환하는 방법을 참고하세요.
자주 묻는 질문
favicon 크기는 얼마나 되어야 하나요?+
favicon은 작고 정사각형이며, 브라우저가 탭에 표시하는 컴팩트한 아이콘입니다. 정사각형 원본 이미지로 시작하면 변환 도구가 사이트에 바로 사용할 수 있는 .ico 파일을 만들어 줍니다.
사진으로 favicon을 만들 수 있나요?+
가능하지만, 사진은 탭 크기에서는 잘 보이지 않는 경우가 많습니다. 정사각형으로 자르고 피사체가 뚜렷한 이미지를 선택하세요. 대개 단순한 로고나 글자가 정교한 사진보다 더 선명하게 보입니다.
.ico 형식이 꼭 필요한가요?+
ICO는 가장 널리 인식되는 favicon 형식이며 추가 설정 없이도 작동합니다. 이미지를 .ico로 변환하는 것이 폭넓은 브라우저 지원을 위한 가장 안전한 기본 선택입니다.
favicon을 만들 때 이미지가 업로드되나요?+
아니요. 변환 도구는 전적으로 브라우저 안에서 실행되므로 로고나 사진이 기기 밖으로 나가는 일이 없습니다. 페이지를 불러온 뒤에는 오프라인 상태에서도 작업할 수 있습니다.
왜 제 favicon이 흐릿하게 보이나요?+
흐릿함은 보통 원본 이미지가 작거나 디테일이 너무 많을 때 생깁니다. 더 크고 정사각형이며 대비가 뚜렷한 이미지나 벡터로 시작하세요. 그러면 아이콘 크기로 줄어들어도 충분한 선명함을 유지할 수 있습니다.