본문 바로가기

홈페이지만들기/워드프레스

워드프레스 Vantage무료테마 사이트아이덴티티

반응형

워드프레스 Vantage무료테마 사이트아이덴티티



사이트아이덴티티에 대해 알아보겠습니다. 무료테마인 Vantage에도 홈페이지제작시에 즐겨찾기에 들어가는 아이콘 파비콘(favicon)을 설정할수 있습니다. 작은 수정이지만 아이콘 하나로 방문자가 쉽게 기억되는 사이트를 만들수 있습니다.



사용자정의에 가셔서 사이트아이덴티티에 들어가서 전체를 한번 읽어보시면 됩니다.



우선 포토샵에서 1:1사이즈 512이상으로 파이콘이나 아이콘을 만드는데 저는 600*600사이즈로 만듭니다. 

포토샵에서 로고는 다른 프로그램으로 만들거나 아니면 포토샵에서도 만드는데 포토샵에서 만드면 픽셀단위로 되어 있기 때문에 될수 있으면 크기를 최대한 크기로 하여 저장하시는것이 좋습니다. 추천하는 사이즈는 600*600입니다. 




로고를 만들고 나서 저장할때에는 꼭 png로 저장하시는게 좋습니다. 여러 브라우저와 안드로이드앱 호환에 잘 적용 되도록 하기 위해서입니다.



png로 저장하셨다면 로고를 불러와서 적용하시면 됩니다.



사이트 제목란과 태그라인에는 말그대로 사이트 제목을 적어주시면 되는데 검색에 있어 아주 중요한 부분이기도 합니다. 홈페이지의 특성을 잘 전달 할 수 있게 하기위해서 입니다. 예를 들어 이 사이트는 it관련해 정보를 교류하기 위함이니 it information school이런식으로 정해주는 것도 괜찮겠습니다.




모두 완료되면 저장을 누르고 사이트에 접속하시면 아래와 같이 적용이 됩니다. 핸드폰에서도 즐겨찾기를 적용하면 아이콘이 같이 적용됩니다.



참고로 워드프레스가아닌 홈페이지html코딩에서 하는 방법을 가르쳐 드리겠습니다.

웹브라우저 주소줄옆에 표시되는 파비콘!

파비콘(favicon) 만들기 및 적용


포토샵에서 png 이미지를 만들어 줍니다.


1. 작업사이즈 : 16*16픽셀 

 

- 파비콘 웹에 노출되는 사이즈가 16*16입니다.

하지만 저는 개인적으로 정사각형이라 120*120까지도 작업합니다. 요즘 핸드폰 해상도가 워낙 그게 나오기도하고 나중에 다른쪽에 쓰기에도 유용하기 때문입니다.


2. 해상도 : 300

3. 배경색상 : 투명(png파일로 저장)

적용 : <link rel="shortcut icon" href="/img/favicon/favicon.ico">






[홈페이지만들기/워드프레스] - 워드프레스 Vantage무료테마 Social/General 기능둘러보기

[홈페이지만들기/워드프레스] - 워드프레스 vantage무료테마 기능 - Blog

[홈페이지만들기/워드프레스] - 워드프레스 무료테마 Vantage기능 둘러보기 -Icons

[홈페이지만들기/워드프레스] - 워드프레스 Vantage테마 Navigation

[홈페이지만들기/워드프레스] - Vantage무료테마 기능 Home - Home Page Slider


반응형