본문 바로가기
생활/꿀팁

티스토리 블로그 아이콘 파비콘 만드는 방법

by 개성공장 2023. 4. 20.
반응형

블로그는 개인이 각자의 개성에 따라 글을 쓰고 발행하기 위한 서비스입니다. 그래서 고유의 이름을 사용하고, 프로필 사진도 등록합니다. 블로그의 브랜딩을 위해 자신만의 아이덴티티를 더하는 것이죠. 여기에 블로그 아이콘블로그 파비콘도 등록할 수 있습니다. 아이콘과 파비콘이 무엇이고, 어떻게 만들어서 설정할 수 있는지 살펴봅니다.

 

목차

     

    아이콘, 파비콘

     

    티스토리 블로그 설정

     

    먼저 티스토리 블로그 설정에 대해 살펴봅니다.

     

    블로그 관리 페이지

     

    블로그 우측 상단의 아이콘을 선택하면 블로그 관리 페이지로 들어갈 수 있습니다. 

     

    블로그 관리

     

    좌측 메뉴바에서 가장 하단에 위치한 관리>블로그로 들어갑니다.

     

    블로그 설정

     

    블로그 설정에서 프로필 사진, 블로그 이름, 닉네임, 블로그 설명, 아이콘, 파비콘을 설정할 수 있습니다. 블로그 이름, 닉네임, 블로그 설명은 헤더의 메타데이터에 들어가는 내용이므로 원활한 검색노출을 위해 꼭 작성해야 합니다.

     

     

     

    블로그 아이콘

    블로그 이름, 닉네임, 블로그 설명은 글로 적으면 되니까 어렵지 않습니다. 프로필 사진의 경우에도 파워포인트 등의 프로그램을 사용해서 작성하면 됩니다. 따로 양식이나 파일형식의 제한은 없습니다. 그런데 아이콘과 파비콘은 제한이 있습니다.

     

    아이콘의 경우 사이즈가 32x32 혹은 64x64이고, 파일 형식은 JPG, PNG여야 합니다. 이미지 편집 프로그램을 이용하면 쉽게 변환할 수 있습니다. 여기서는 꿀뷰 프로그램을 이용했습니다.

     

    ※ 참고글 : 이미지파일 용량 줄이는 프로그램, 꿀뷰로 사진 일괄 변환하기

     

    이미지파일 용량 줄이는 프로그램, 꿀뷰로 사진 일괄 변환하기

    압축 프로그램의 대명사 하면 반디집이 있습니다. 그렇다면 사진, 이미지 파일을 편집하는 좋은 프로그램은 무엇이 있을까요? 같은 반디소프트에서 제작한 꿀뷰라는 프로그램이 있습니다. 특히

    gaesung.tistory.com

     

    아이콘으로 사용할 이미지 파일을 꿀뷰로 변환합니다. 변환 조건은 아래와 같이 설정하면 됩니다. 프로필 사진 이미지를 그대로 사용해도 되고, 가독성이 너무 떨어진다면 아이콘에 맞춰서 간단한 이미지를 만들어도 좋습니다.

     

    이미지 변환

     

    크기 조절을 꽉차게 늘리기, 64x64로 설정합니다. 사용하는 이미지가 정사각형이면 비율 유지나 다른 설정을 사용해도 무방하지만 직사각형이라면 꽉차게 늘리기로 64x64 정사각형 사이즈에 맞춰주는 게 좋습니다.

     

    저장 이미지 포맷은 PNG를 선택합니다. JPG도 좋지만 PNG가 더 선명한 편입니다.

     

    아이콘 불러오기

     

    이렇게 생성한 아이콘 이미지 파일을 불러오기로 업로드합니다. 그러면 정상적으로 아이콘이 등록된 것을 확인할 수 있습니다.

     

     

     

    블로그 파비콘

    다음으로 파비콘을 등록해보겠습니다. 파비콘은 아래 사진처럼 웹페이지의 대표 이미지를 말합니다.

     

    블로그의 파비콘

     

    ICO 변환사이트 사용하지 마세요. 참고로 다른 블로그에서는 ICO 변환 웹사이트를 이용하라고 합니다. 그런데 괜히 모르는 사이트에 파일 업로드하고 파일을 다운로드하는 것이 찝찝하기도 하고, 강제로 광고까지 봐야 합니다. 그런 불편함을 감수할 필요가 없습니다.

     

    아이콘과 달리 파비콘은 ICO 파일형식으로만 등록할 수 있습니다. 일반적으로 사용하는 이미지 확장자가 아니라서 당황할 수 있지만 요즘 웹브라우저들은 ICO 외의 이미지 형식들도 인식하므로 확장자만 ICO로 바꿔줘도 됩니다.

     

    이미지 변환

     

    마찬가지로 꿀뷰에서 이미지 변환을 합니다. 조건은 위와 같이 설정합니다. 꽉차게 늘리기, 16x16, PNG입니다. 파비콘은 아이콘보다 해상도가 더 낮습니다. 16x16이라 단순한 이미지가 아니라면 매우 흐르게 보이죠.

     

    확장자 변경

     

    이렇게 변환된 PNG 파일의 확장자를 ico로 변경합니다. 파일 이름 바꾸기로 수기로 바꾸면 됩니다.

     

    "파일의 확장자명을 변경하면 사용할 수 없게 될 수도 있습니다. 변경하시겠습니까?"라는 메시지는 무시하고 "예"를 선택하면 됩니다. 그리고 이 ico 파일을 티스토리에 등록하면 됩니다.

     

    파비콘 불러오기

     

    이렇게 등록하면 됩니다. 파비콘이 정상적으로 등록되고, 블로그 페이지를 새로고침 해보면 상단 탭에 파비콘 이미지가 정상적으로 로드되는 것을 확인할 수 있습니다.

     

     

    ※ 티스토리 설정 꿀팁 모음

    블로그와 트위터 연동해서 자동으로 글 올리는 방법(feat. IFTTT 애플릿)

    티스토리 블로그 글 백업하는 방법 알아보기

    티스토리 블로그 목차 부드러운 스크롤 적용 방법(문서 내부 링크 이동)

    티스토리 복사 붙여넣기 &nbsp 태그 제거방법

     

    ※ 티스토리 블로그 SEO 검색엔진 최적화 모음

    "<H1> 요소가 2개 이상 발견되었습니다." 티스토리 블로그 SEO 문제해결 방법

    티스토리 성능 개선, jQuery 사용하지 않는 자바스크립트 줄이기

    티스토리 사진에 alt 태그 다는 방법, 구글 SEO 최적화

    티스토리 검색엔진 최적화 100점 만드는 방법

     

     

     

     

    반응형

    댓글