[티스토리, 구글블로거] 파비콘 만들기 (그림판, ICO, Favicon)

안녕하세요?

파비콘 만들기에 대해서 포스팅을 합니다.

 

먼저 파비콘이 무엇인지 알아보고,

어떻게 생성하는지 방법에 대해서 대해서 알아보도록 하겠습니다.

 

 

 

1. 파비콘이란?

Favorite + Icon을 합친 단어입니다.

우리가 자주 보는 인터넷 사이트 옆에 나오는 작은 아이콘이죠.

위키백과 파비콘 검색결과

 

 

인터넷 익스플로러나 크롬 등의 브라우저로 인터넷 사이트에 들어가면,

작은 정사각형 모양으로 사이트를 대표하는 이미지를 볼 수 있는데요,

그게 바로 파비콘입니다.

 

티스토리와 구글 블로거는 사용자의 블로그에 파비콘을 커스터마이징 할 수 있습니다.

네이버 블로그 보다 커스터마이징에 조금 개방적이죠.

아무튼 파비콘을 잘 만든다면 본인 블로그를 대표하는 아이콘을 홈페이지에 내걸 수 있습니다.

 

 

파비콘들 (네이버, 구글, 애플)

 

 

 

 

2. 파비콘 만들기

이미지 소프트웨어를 다룰 줄 아시는 분이라면 이미지를 16x16, 32x32, 64x64, 128x128 의 정사각형 사이즈로 만들고,

icon으로 만들어주는 웹사이트에서 변경을 하여 쉽게 제작이 가능합니다.

 

여기서는 그림판을 이용해서 사진을 잘라 만드는 방법을 해보겠습니다.

 

 

2-1. 이미지를 준비합니다.

저는 픽사베이에서 falcon 이미지를 가져왔습니다.

출처: https://pixabay.com/images/id-4867117/

 

2-2. 그림판으로 이미지를 엽니다.

그림판을 열어서 (윈도우+R → "mspaint" 입력 후 엔터)

"선택"도구로 원하는 영역을 선택하고 "크기조정"을 눌러서 픽셀 64x64로 변경합니다.

 

가로세로 비율 유지를 풀고 해주세요

 

그럼 64x64 영역이 선택되어 있는 채로 이미지가 줄어드는데

선택을 풀지 말고 우클릭을 하여 "자르기"를 선택합니다.

그러면 64x64 영역만 남고 나머지는 없어집니다.

 

 

64x64영역이 선택되어 있습니다. 우클릭 합니다.

 

자르기 선택

 

 

 

2-3. 이미지를 저장합니다.

확장자는 PNG던 JPG던 상관없습니다.

원하는 이름으로 저장합니다.

 

 

 

 

2-4. 이미지 -> ICO 파일로 변환해주는 웹사이트를 이용합니다.

포토샵이나 전문 소프트웨어를 사용하면 쉽게 변경이 가능하나,

웹사이트에서 무료로 변경할 수 있습니다.

아래는 제가 자주 사용하는 변환 사이트입니다.

https://convertio.co/kr/

Convertio — 파일 변환기

 

 

Convertio 에서 로컬경로에서 이미지 파일을 선택하고

변환할 형태로 "영상 -> ICO"을 선택한 뒤 변환을 누릅니다.

조금 있으면 ICO파일을 다운로드 받을 수 있게됩니다.

convertio 변환 웹사이트

 

참고하시라고 위에서 만든 Falcon의 ico파일 업로드합니다.

제목-없음.ico

0.02MB

 

 

 

2-5. 블로그 설정에 파비콘을 업로드.

앞서 만든 ICO 확장자 파일을 블로그에 업로드 해주면 됩니다.

 

티스토리의 경우 "관리 -> 블로그 -> 파비콘 업로드" 의 경로로 수정합니다.

티스토리 파비콘 설정페이지

 

구글 블로거의 경우 "설정 -> 파비콘" 에서 변경합니다.

구글 블로거는 ico파일로 변경할 필요가 없이 100kb미만의 png파일을 올려도

바로 설정 변경이 가능합니다.

구글 블로거 파비콘 설정페이지

 

 

 

 

3. 파비콘 노출

각 검색엔진 마다 웹사이트의 파비콘을 노출하는 정책이 다릅니다.

블로그 주인이 고심해서 파비콘을 만들어도 노출을 안해주는 경우가 있습니다.

 

2021년 6월 기준으로 알아보자면,

구글은 데스크톱 PC와 모바일 환경에서 파비콘 정책이 다릅니다.

PC환경에서는 파비콘 노출이 없고.

모바일 환경에서는 파비콘 노출이 있습니다.

 

네이버는 파비콘 노출이 됩니다.

 

 

 

구글 모바일: 파비콘 노출 됨

 

구글 PC: 파비콘 노출 없음