WP에서 Favicon을 만들어봅니다

WordPress에서 Favicon을 만들어보자

사이트 아이콘 (흔히 페비콘 favicon, Favorite Icon의 약자)을 만들어 볼려고 합니다. 사이트 아이콘은 각 브라우져의 탭에 보이는 아이콘으로 북마크바등에도 보이는 사이트의 얼굴입니다. 모든 큰 사이트들 마다 고유의 사이트 아이콘을 가지고 브랜딩화를 하고 있습니다. 사이트를 만들으셨다면 사이트 아이콘을 만들어서 브랜딩화 해보세요.

사이트 아이콘은 예전에는 가로 16 픽셀에 세로 16픽셀의 정사각형으로 만들었습니다. 그러다보니 워낙 표현 공간이 작아 그래픽으로 만들기 어려웠습니다. 하지만 워드프레스에서는 최소 가로 512에 새로 512 이상의 정사각형에 그래픽을 담고 이를 워드프레스를 이용하여 올리면 자동으로 작게 수정하여 줌으로 favicon을 쉽게 만들 수 있도록 도와줍니다.

그럼 차례대로 알아봅니다.
포토샵으로 만들어 봅니다. 먼저 포토샵을 열고 fIle – new로 가서 가로 512픽셀, 세로 512픽셀에 해상도(resolution)을 72로 하여 새로운 파일을 만듭니다. 배경은 흰색으로 하셔도 무방합니다.

이제 그 공간에 원하시는 글자나 모양을 넣어 아이콘을 만들고 저장을 합니다. 저장을 할때 화일종류는 jpg, gif 혹은 png로 하셔야 합니다.

이제 사이트의 WordPress의 dashboard(관리창)를 엽니다.
Appearance – site Identity로 갑니다. 가장 아래부분을 보면 Site icon이란 부분이 보입니다. 그곳에서 Change Image를 누르시면 Select Image가 나옵니다. Upload Files 탭를 선택하시고 Select Files을 누르시고 만들어진 화일을 찾아 서버에 올리시고 그 화일을 선택하시면 됩니다.

자, 이제 잘 올라갔나 확인하실 차례입니다. 브라우저(크롬, 화이어폭스등)를 여시고 사이트로 가시면 브라우져탭에 만들은 Favicon이 올라가있습니다. 물론 모양에 작게 보이다보니 생각과 다르게 보일 수 있습니다. 걱정하실 필요는 없습니다. 처음이 어렵지 수정하는 것은 쉽습니다.

해보시면 아시겠지만, 사이트아이콘은 복잡합 그래픽보다는 심플한 그래픽이 잘보이고 강한 이미지를 줍니다.

백문이 불여일견이라 했습니다. 만들어보시고, 수정해보시다보면 원하시는 결과를 얻으실 것입니다.

 

Good Sam Travel Assist for $59.99 – Save $30

Leave a Reply

Your email address will not be published. Required fields are marked *