얼마 전부터 해야겠다고 마음만 먹다가 드디어 제 블로그에 파비콘을 등록했습니다. 파비콘은 간단하게 말하면 웹페이지 주소창에 대표 이미지를 표시해주는 아이콘이라고 생각하면 됩니다.
위 이미지처럼 네이버, 구글, 티스토리 주소창 앞에 붙은 이미지를 말합니다. 가장 왼쪽에 있는 아이콘은 파비콘이 없을 때 보이는 이미지입니다. 지구 모양처럼 생겼어요. 티스토리 같은 경우는 따로 파비콘을 등록하지 않으면 티스토리 시그니쳐 T 이미지가 표시됩니다. 보통 기업 브랜드 이미지와 비슷하게 파비콘을 설정하는 경우가 많습니다.
티스토리 블로그 하는 입장에서도 남들과 다르게 나만의 아이콘으로 주소창을 표시해 주고 싶다면 파비콘을 적용하세요. 파비콘 만들고 적용하는 것까지 한 번에 알려드리겠습니다.
관련글 - 티스토리에 이모티콘 사용하기
# 파비콘 만들기
파비콘 만드는 방법은 여러가지가 있습니다. 직접 제작을 할 수도 있고, 기존에 있던 이미지 파일을 ico 파일로 변환할 수도 있습니다. 저는 간단하게 저의 블로그 대표 이미지 파일을 형 변환해서 만들어 보도록 하겠습니다. 포토샵과 같은 그래픽 편집기 프로그램에서도 ico 형 변환이 가능하지만, 저는 파비콘 생성 사이트를 이용해서 만들었습니다.
1. 파비콘 생성 사이트에 접속하여 Import Image를 선택합니다.
2. 파일 선택하여 이미지 파일을 등록하고 Upload 버튼을 누릅니다.
3. 하단 Download Favicon을 눌러줍니다.
보시는 것 처럼 제가 등록한 고양이 이미지가 도트 이미지처럼 보이는 것을 확인할 수 있습니다. Use Animation이 있으니 움직이는 파비콘도 만들 수 있을 것 같습니다. Color Picker를 이용해서 색상 변경도 가능할 것 같아요. 고양이 얼굴이 부각되도록 배경색을 변경했습니다.
여기까지 하면 파비콘 만들기는 끝이났습니다. 이제 티스토리에 적용만 하면 되는데요. 적용하기 전에 생성된 파비콘을 한번 확인해 보겠습니다. 폴더에서 보면 이미지가 보이고 유형도 아이콘으로 표시됩니다. 크기를 확인해 보니 16*16으로 굉장히 작은 이미지로 생성되었어요.
# 티스토리에 적용하기
원래 파비콘은 html로 적용을 해주는게 일반적이지만 티스토리는 관리자 메뉴에서 간단하게 파비콘을 등록할 수 있도록 되어있습니다.
1. 티스토리 관리자모드에서 관리 > 블로그로 이동합니다. 중간에 보이는 파비콘에서 불러오기를 눌러 방금 전에 제작한 파비콘 파일을 등록하고 변경사항 저장 버튼을 눌러줍니다.
2. 웹페이지를 새로고침 하거나 단축키 F5를 눌러 확인합니다.
정상적으로 표시되는 것을 확인할 수 있습니다. html 코드 변경까지 해야 되겠다고 생각하고 있었는데 관리자 메뉴에 있어서 너무 쉽게 등록할 수 있었습니다. 고양이 이미지라 그런지 너무 귀엽네요. 와이프가 옆에서 매우 좋아합니다. 고양이 관련 블로그인지 착각할 수 있겠습니다.
이제 티스토리에도 나만의 블로그 이미지인 파비콘을 적용해 보세요!
'IT > 블로그' 카테고리의 다른 글
티스토리 광고 최적화 - 불필요한 광고 차단하기 (2) | 2020.05.09 |
---|---|
검색 최적화를 위한 사이트맵 생성 및 사이트맵 주소 알아내기 (0) | 2020.04.23 |
웹마스터도구에 사이트맵 제출하는 방법 (0) | 2020.04.23 |
티스토리 하위 카테고리 만들고 글 이동시키는 방법 (0) | 2020.04.19 |
티스토리 방문자수 보는 방법 (0) | 2020.04.09 |
크롬에서 티스토리 방문통계 오류 잡는 방법 (0) | 2020.04.04 |
티스토리 에드센스 ads.txt 관련 문제. 마냥 기다려야만 하는건가 (2) | 2020.04.03 |
티스토리 반응형 스킨 #1 카테고리 CSS 변경하기 (6) | 2020.03.24 |