728x90
🐾 티스토리 블로그에 파비콘 적용하는 방법 완벽 가이드
티스토리 블로그를 운영하다 보면, 브라우저 탭에 나만의 작은 아이콘, 즉 **파비콘(Favicon)**을 적용하고 싶을 때가 있습니다. 이 아이콘은 블로그의 정체성을 강조하고, 방문자에게 기억에 남는 인상을 줄 수 있는 중요한 요소입니다. 이 글에서는 티스토리 블로그에 파비콘을 설정하는 가장 쉬운 방법을 상세하게 안내드릴게요.
🧩 파비콘이란 무엇인가요?
**파비콘(Favicon)**은 웹사이트의 '즐겨찾기 아이콘' 또는 '탭 아이콘'을 의미합니다.
보통 브라우저 상단의 탭 왼쪽, 북마크 바, 또는 모바일 즐겨찾기 아이콘으로 표시되며, 사이트의 로고나 상징적인 이미지를 작게 표현한 형태입니다.
🛠️ 파비콘 이미지는 어떻게 준비하나요?
- 권장 크기: 32×32px, 48×48px, 64×64px(추천) (최소 16×16px 이상)
- 파일 형식: .png, .jpg 모두 사용 가능 (권장: .png)
- 디자인 팁: 배경 없이 투명한 PNG 형태가 가장 깔끔하며, 단순한 실루엣이나 로고 스타일이 가장 잘 어울립니다.
🎨 무료 파비콘 제작 사이트 추천:
- Genfavicon. Free Online Favicon Generator. Icon Generator.
Genfavicon. Free Online Favicon Generator. Icon Generator.
What is favicon? A favicon (short for 'favorites icon'), are litle icons associated with a particular website or webpage, shown next to the site's name in the URL bar of most browsers. The most common sizes for favicons are: 16x16, 32x32, 48x48, 64x64, 128
genfavicon.com
✅ 사용 방법
- 이미지 파일 선택
- Upload Image 버튼 클릭
- 파비콘으로 생성될 이미지의 영역을 지정
- 사이즈 선택 64×64px(저는 해당 사이즈로 선택했습니다.)
- Capture & Preview 버튼 클릭
- Download Favicon 클릭(png 파일도 생성 가능하니 이용해 보세요!)
🖥️ 티스토리에 적용 하기
✅ STEP 1.
- 티스토리 블로그에 로그인합니다.
- 관리 > 블로그 메뉴로 이동하세요.
✅ STEP 2.
- 불러오기 버튼을 누르고 이미지(ICO)를 선택 후 변경상항 저장 버튼을 눌러 저장해주세요.
🔁 적용 후 확인 방법
- 블로그 메인 페이지를 열고 브라우저 탭을 확인해보세요.
- 변경 사항이 바로 보이지 않는다면, 브라우저 캐시를 지우거나 새로고침(Ctrl + F5)을 해보시길 추천드립니다.
🐱 고양이 다락방 팁
1. 최적 사이즈는 64x64 이상, 가로세로 같게
- 기본 최소 사이즈는 16x16px이지만, **고해상도 디스플레이(레티나, 4K)**를 고려하면 48x48, 64x64, 96x96으로 제작하는 것이 좋습니다.
- 정사각형 비율로 제작해야 이미지가 깨지지 않습니다.
2. 배경은 투명하게, 복잡한 요소는 피하기
- 단순한 도형, 아이콘, 글자 1~2개 정도가 가장 잘 보입니다.
- 복잡한 그림은 사이즈 축소 시 식별이 어렵기 때문에 피하세요.
- 배경이 투명하면 다양한 브라우저 배경색에서도 잘 어울립니다.
3. 브랜드 컬러, 블로그 아이덴티티 반영
- 예: ‘고양이다락방’이라면 귀여운 고양이 실루엣이나 발바닥, 책 모양 활용해보세요.
- 지속적인 블로그 운영 시, 다른 디자인 요소와 통일감을 줄 수 있어 좋습니다.
📌 마무리 요약
- 파비콘(Favicon)은 브라우저의 탭, 즐겨찾기, 검색 결과 옆에 표시되는 작은 아이콘으로, 블로그의 첫인상에 중요한 시각 요소입니다. 방문자가 여러 개의 탭을 열어둘경우에도 파비콘은 블로그를 직관적으로 식별할 수 있도록 하는 효과적인 역할을 합니다.
- 파비콘을 변경했음에도 불구하고 기존 아이콘이 계속 표시된다면, 이는 브라우저 캐시 때문일 수 있습니다. 이 경우에는 새로고침을 해보시기를 바랍니다.
- PC 환경에서는 주로 탭 상단, 북마크 바 등에서 보이며, 모바일에서는 홈 화면 아이콘 등 다양한 방식으로 활용 됩니다. 따라서 고해상도 아이콘으로 제작하고 브라우저 호환성이 좋은 포맷을 선택해 업로드하는 것을 추천드립니다.
- 파비콘 하나만 바꿔도 블로그 전체의 분위기가 달라 보일 수 있씁니다. 블로그를 기억에 남게 만드는 이작은 아이콘, 지금 바로 적용해 보세요!^^