본문 바로가기

Life/yourjune blog

역시 심플함이 최고! 블로그 스킨수정 (Basic 2008)

반응형
오랜만에 블로그 스킨을 바꿔봤습니다. 원래 스킨을 수정할 생각은 없었는데;;; 어떻게 하다가 수정하고 있더군요;; 역시 만만치 않은 작업이네요. 대략 반나절은 다 까먹은 거 같습니다. 어디서 버그가 튀어나올지 모르지만 대충 거의 끝마친것 같습니다.

아래 이미지는 기존에 사용하던 스킨입니다. 퓨어블랙을 수정해서 사용하던 스킨입니다. 다 좋은데 콘텐츠 프레임의 왼쪽에 테두리가 없어서 레이아웃이 퍼지는면이 있었습니다.



그래서 이번에 선택한 스킨은 티스토리에서 배포하는 2단 스킨인 BASIC 2008을 이용했습니다. 제가 심플한 레이아웃을 좋아하다보니 자꾸 기본스킨만 골라서 쓰게 되네요. 


다만 티스토리에서 배포하는 대부분의 스킨이 콘텐츠, 사이드바의 좌우폭이 너무 좁다는 단점이 있습니다. 그래서 좌우폭을 조금 조정했습니다. 기존에 사용하던 스킨과 레이아웃은 완전히 동일합니다.



스킨 수정사항을 적어볼께요.

1. 전체 좌우폭 970픽셀로 조정
전체폭을 970픽셀로 조정하고 원래스킨에서 과도하게 남던 좌우 여백도 조정하였습니다. 이번에도 1024x768해상도에서 좌우스크롤바가 생기지 않도록 1000픽셀 안에서 짤랐습니다.

당신의 6월 블로그 방문자의 해상도 분석 (다음 웹인사이드)


왜냐하면 아직도 20%에 가까운 방문자분들이 1024*768을 사용하시기 때문입니다. 제 노트북도 위 해상도를 사용하고 있는데 좌우 스크롤바가 생기는 블로그는 사용이 불편하더군요. 아마도 넷북사용자들이 많아져서 오히려 그 비율이 늘은 것 같습니다. 그래서 저도 별다른 불편이 없으면 항상 1000픽셀 안으로 맞춥니다.

그래서 작업할때도 항상 노트북을 켜놓고 합니다. (가끔은 드라마도 틀어놓고 작업합니다. 내여친구미호 재밌드만요;;)


아래는 1024x768에서 봤을때의 모습입니다.

1024x768에서 본 모습



2. 사이드바 사이즈를 230픽셀로 조정 (여백까지 포함하면 250픽셀)
사이드바가 너무 좁으면 댓글, 트랙백에서 너무 짧게 끊기는 단점이 있더군요. 원래는 150픽셀인데 저는 230픽셀까지 늘렸습니다.

3. 상단 폭 조정. 배경이미지, 블로그 이미지 대체
상단의 이미지가 들어가는 부분도 블로그 아이덴티티가 드러날 수 있도록 약200픽셀정도로 늘려줬습니다. 원래 있던 이미지 대신 제가 찍은 사진과 제 블로그 이미지가 들어가도록 수정했습니다.

4. 검색창이 블로그메뉴 옆쪽에 오도록 배치
원래 스킨에서는 검색창이 사이드바에 나오는데 저는 전통적으로 저 위치가 편하기 때문에 블로그메뉴 옆쪽에 배치하였습니다. 예전에는 span으로 floating시켰는데 이번에는 그냥 블로그메뉴 옆으로 배치 시켰습니다. 

5. 블로그메뉴 높이조정 (검색창의 여백을 생각하여)
검색창의 높이를 감안하여 블로그메뉴 높이도 약45픽셀정도로 조정하였습니다.

6. 블로그 기본폰트를 맑은고딕으로 설정


블로그 레이아웃부분을 간단하게 정리하면 상단배경부분 200px, 콘텐츠 630px, 사이드바 230px입니다.

그외 자잘한 부분은 저도 잘 기억이 안나네요;; 아무튼 제가 심플한 것을 좋아하는지라 블로그 상단은 심플하게 꾸며봤습니다. 이것 저것 해봐도 역시 심플한 스킨이 제일 보기가 좋네요.

혹시 이 스킨을 사용하고 싶으신 분들은 따로 댓글 적어주시기 바랍니다. 제가 배포를 염두해두고 수정을 한게 아니라서 주석처리는 안되어 있습니다. 그래도 사용하고 싶으신 분들은 댓글에 의견 남겨주세요. (쓰실분들이 계시려나,,,)

스킨을 사용하고자 하시는 분은 아래 링크를 따라가시기 바랍니다.
티스토리2008 yourjune ver. 스킨 배포합니다.

덧글) 티스토리 스킨을 조건없이 배포해주시는 분이 계십니다. 스킨 수정/제작이 어려운 분들은 아래 링크로 들어가보세요~ http://juostory.tistory.com/

반응형