일상2019.01.01 10:28

포토샵없이 티스토리 블로그 아이콘과 파비콘 만들어 설정하기

자신의 홈페이지가 검색 될 때 대표이미지가 되는 아이콘과 파비콘은 검색 최적화가 되는 방법 중 하나라고 한다.

키워드니 검색이니 최적화니 하는 용어를 잘 모르지만 아이콘과 파비콘이 있으면 확실히 사이트 이미지가 달라지는 것 같다.


하지만 아이콘이나 파비콘은 포토샵과 같은 전문 프로그램을 사용하여 만들어야 하는데 대부분의 사람들은 포토샵 같은 디자인 소프트웨어가 익숙하지 않다.

그리고 조금 할 줄 아는 필자의 경우도 사실 좀 귀찮아서 안만들게 된다.

파비콘과 아이콘이 블로그 검색 최적화에 도움이 되는지 그런 건 모르고 살다보니 신경을 안쓰게 되는데 어쩌다보니 운영중인 블로그를 좀 더 좋은 모습으로 꾸미기 위해서 정성을 들이는 과정에서 포토샵 없이도 만들수 있다는 사실을 알게되었다.


방법이 쉬우니 아래로 간단히 살펴보자면,



우선 티스토리 관리자 페이지에서 플러그인 메뉴에 들어가면 아이콘과 파비콘을 홈페이지에 표시해주는 플러그인이 있으니 그 부분을 우선 설정 해준다.



위 와 같이 아이콘과 파비콘을 설정해주는 페이지이다.

지난 아이콘 만들기 포스팅을 한번 하긴 했는데 아래에 소개하는 홈페이지에서는 파비콘 파일은 물론 아이콘 파일도 생성되기 때문에 아이콘 부분은 중복일 수 있다.

하지만 오늘은 포토샵 없이 만든다는 것이 오늘의 포스팅 핵심이라는 사실!!!



위 이미지는 https://www.favicon-generator.org 로써 아이콘 파일과 파비콘 파일을 만들수 있다.

방법은 '파일 선택'을 클릭하여 해당 이미지를 업로드 한 후 'Create Favicon' 버튼을 클릭하면 압축파일을 다운로드 받을 수 있는 화면이 뜨고 바로 다운로드 받으면 된다.



다운로드 받은 압축 파일을 풀고 해당 폴더를 열어보면 위와 같이 이미지 파일(png) 뿐만 아니라 파비콘 파일(ico)도 같이 생성되어 있음을 알 수 있다.

위 파일 중 필요한 파일을 선택하면 포토샵이 없이도 아이콘과 파비콘 설정을 할 수 있게 된다.


먼저 티스토리에서는 아이콘 파일 사이즈를 32x32 또는 64x64로 요구하고 있는데 위 파일들 중에는 32x32 사이즈가 있으니 선택하여 설정을 완료한다.

다음으로 'favicon.ico'파일을 선택하여 파비콘 설정도 마무리 한다.


조금만 정보를 찾아보면 다양한 방법들이 있다는 것이 고맙기도 하고 놀랍기도 하다.

이렇게 해서 나의 블로그에도 그 동안 설정하지 않고 있던 파비콘을 설정할 수 있었다.


댓글을 달아 주세요