투명배경으로 파비콘 만들기와 티스토리 적용 하기(블로그 꾸미기)


파비콘 만들기와 설정 방법


블로그를 시작하면서 애착을 갖게 되면 내 집을 꾸미는 것과 마찬가지로 이런 저런 변화를 주고 싶어지기 마련이다. 


그리고 이러한 변화를 주는 방법에는 블로그의 전체적인 인터페이스에 영향을 주는 스킨편집도 있겠지만, 간단하게 파비콘 및 블로그 로고를 만들어주는 방법도 있다. 

파비콘 만들기와 티스토리설정방법




파비콘이란?



파비콘이란 즐겨찾기 아이콘을 뜻한다. 티스토리의 경우 기본 파비콘은 오랜지색 원에 하얀색 T라는 글씨인데, 이 부분을 자신이 원하는 모양으로 차별화 주는 것이 오늘의 이 포스팅의 목적이다. 



포토스케이프로 파비콘 만들기 방법

포토스케이프로 파비콘 만들기



설명하기에앞서 '포토스케이프'에 대한 소개와 사용법에 대해 먼저 이야기 했어야 하는데 순서가 바뀌어버렸다. 블로그를 하면서 포토샵등의 사진편집 프로그램은 필수라 할 수 있는데 포토샵은 구하기 어렵고 사용하기 위해서 기본적인 지식이 있어야 하는 것에 비해, 포토스케이프는 프로그램이 가볍고 사용법도 간단하면서 네이버에서 검색하는 것으로 쉽게 받을 수 있다는 장점이 있다.



포토스케이프를 받았다면 위의 자료에 체크해둔 사진편집에 들어가자.



투명배경 만들기


C드라이브 → 프로그램파일 → 포토스케이프 → 아이콘 →  카툰


트리에서 위와 같은 순서로 들어가면 아이콘들이 있는데 저기서 아무거나 선택한다.



투명배경 만드는 방법



하단콘솔의 '자르기'를 선택한 후 하얀색 배경 부분만 잘라낸다. 이렇게 하는 이유는 이 아이콘의 배경은 하얀색으로 보이지만 투명한 부분이기 때문인데, 이 것에 대한 설명은 뒤에서 하도록 하겠다.



포토스케이프 크기조절



'기본'에서 크기조절을통해 자신이 편집하기 쉬운 크기로 조절해준다. 너무 작게 해버리면 만들때 자신도 잘 안보일 수 있으니 크게한 뒤 나중에 줄이는 것이 좋다. 파비콘을 만들때 팁은 너무 많은 그림을 넣는 것은 좋지 않다는 것인데, 네이버나 페이스북등의 파비콘처럼 직관적인게 좋다. '개체'에서 그림이나 글자등을 이용해 만들어주자.



*마지막에 저장하기전에 꼭 16x16 사이즈로 저장해주어야 한다.



파비콘 투명배경으로 만드는 이유


1번은 일반적인 하얀 화면을 캡쳐해서 사용했을때와의 비교이다. 똑같이 원형으로 만들어주었음에도 투명배경을 이용하지 않으면 저렇게 하얀 부분이 남아버린다. 2번 예시를 통해 아이콘의 배경은 하얗게 보였음에도 사실은 투명했다는 것을 알 수 있다.



마지막으로 3번은 위에서 직관적인게 좋다는 말의 예시로서, 16x16의 작은 사이즈로 적용되기 때문에 심플한게 가장 좋다는 것을 보여주고 있다.



PNG 저장하는법



작업을 마쳤다면 '다른 이름으로 저장'을 선택한 뒤 png로 저장해준다.


png파일 ico로 변환하기

png ico 변환 파일 만들기


png파일 ico로 변환하는 곳


파비콘을 등록하기 위해서는 ICO파일로 변환해줘야 하는데 이를 위해 png파일로 저장한 것이다.



위의 사이트에 접속한 뒤 파일을 업로드해주면 왼쪽과 같이 나타나게 되고, 변환된 파일을 저장해주면 끝이다. 



티스토리 파비콘 적용하기

티스토리 홈페이지 아이콘표시 설정



파비콘을 등록하기전 티스토리 설정에 들어가 '플러그인 → 홈페이지 아이콘 표시'에서 적용을 눌러주자.



티스토리 파비콘 설정법



마지막으로 '관리 → 블로그'에서 파비콘 등록을 해주면 모든 작업이 완료된다.


마무리


하스텐의 리뷰창고 아이콘



저도 파비콘 만들기 포스팅을 하면서 겸사겸사 하나 만들어보았는데, 막상 적용하니 그냥 검정색 덩어리처럼 보여서 헛수고가 되어버렸습니다. 그래서 결과적으로는 심플한 파란색 H글자로 마무리 했는데, 위의 이미지는 아까우니 블로그 프로필 및 로고로 사용해야겠습니다. 하하하.



예쁘게 만드는건 개인적인 스킬적인 부분이라 도와드릴 수 없으나, 네이버, 페이스북, 구글 등을 보면 알 수 있듯 복잡한 것 보다 심플한게 베스트 입니다. 즉 글자 한개로도 글씨체를 이용하여 예쁘게 만들면 된다는 것이죠. 나중에 포토스케이프 사용법에 관한 포스트도 작성해보도록 하겠습니다. 



그럼 지금 까지 꿀팁 요정 하스텐이었습니다. 혹시 궁금한게 있다면 댓글로 남겨주시기 바랍니다. ^^



*다른글보기

 [블로그팁] 구글,빙,줌,다음, 사이트 검색 등록하기 종합편


반응형

댓글

Designed by JB FACTORY