블로그 스킨을 myBlack으로 변경합니다! by 도아
myBlack은?
myBlack은 화이트보드를 기반으로 디자인을 바꾼 스킨입니다. 일부 디자인을 제가 바꾸기는 했지만 스킨의 구조와 디자인의 상당 부분이 화이트보드 스킨을 그대로 사용합니다. 그런데 이름을 바꾼 이유는 외형적 차이가 크기 때문입니다. 아울러 모두 제가 만든 스킨이 아니라 따로 공개할 생각은 없습니다. 예전 스킨에 비해 어떤지 소감을 댓글로 남겨 주시기 바랍니다.
whiteBoard 스킨
꽤 오래 동안 제가 사용한 스킨은 whiteBoard입니다. 당시 '화이트보드'(whiteBoard)로 바꾸면서 올린 글이 스킨을 whiteBoard로 바꿨습니다이고 올린 날짜가 2008년 11월 14일입니다. 따라서 오늘 스킨을 바꾸면 무려 '3년'만에 블로그 스킨을 바꾼 셈입니다. 원래 좋다 싶으면 바로 바꾸지만 또 한번 좋아한 것은 어지간 하면 바꾸지 않는 성격입니다. 이 때문에 '화이트보드'는 블로그 스킨 중에는 가장 오랜 기간동안 사용한 것 같습니다.
그런데 이제 스킨을 'myBlack'으로 변경합니다. 'myBlack'은 공개 스킨이 아니고 제가 쓰기위해 만든 스킨입니다. 아마 제 블로그를 자주 방문하는 분은 이미 바뀐 스킨을 알 것이라고 생각합니다. 오늘 바꾼 것이 아니라 계속해서 스킨을 바꿔왔기 때문입니다. 지난 달 9월 21일에 트위터에 블로그 스킨을 바꾸고 있다고 올렸기 때문에 약 20일간 틈틈이 작업한 셈입니다. 물론 앞으로도 계속 이런 저런 변경 작업을 계속할 예정입니다. 그러나 이전 스킨의 흔적을 어느 정도 지웠기 때문에 스킨 변경을 알리게됐습니다.
whiteBoard+fotowall
이번 스킨은 화이트보드 기반에 과거 스킨으로 사용한 fotowall의 디자인을 입힌 것입니다. 'fotowall'은 2006년 부터 Moving Box로 바꾸기 전까지 약 2년간 사용한 스킨입니다. 즉, 제 블로그에서 화이트보드 다음으로 오래 사용한 스킨인 셈입니다. 그외에도 사용한 스킨이 더 있지만 기억에 남는 스킨은 이 정도인 것 같습니다. 두 스킨을 블로그에 적용한 모습은 다음 그림을 참조하면 될 것 같습니다.
2006년부터 2008년까지 사용한 스킨. 전체적으로 검은색 디자인이고 그림이 별로 없다. fotowall 오리지날은 아니고 역시 변경해서 사용한 스킨이다.
2008년 부터 지난 달까지 사용한 스킨. 워낙 유명한 스킨이라 따로 설명할 필요가 없다. 실제 이 스킨을 사용하는 사람은 정말 많다.
myBlack 스킨
화이트보드는 아주 잘 설계된 스킨입니다. 따라서 스킨을 변경하는 것도 상당히 쉽습니다. 참조 URL 때문에 방문한 Shar's Atelier님 블로그의 스킨이 깔끔해서 확인해 보니 역시 기반은 '화이트보드' 더군요. 아무튼 원래 검은색 계열을 좋아하기 때문에 'fotowall' 스킨이 계속 생각났습니다. 앞에서 이야기했지만 화이트보드가 구조적으로 설계가 잘되고 바꾸기 쉽습니다. 따라서 조금만 노력하면 'fotowall'의 느낌의 스킨을 만들 수 있을 것 같았습니다.
일단 화이트보드에서 사용되는 그림의 대부분을 제거했습니다. 또 RSS 피드를 과거 10개에 5개로 줄였습니다[1]. 이 덕에 페이지당 평균 전송량이 20K 정도에서 현재 10K 정도로 준 상태입니다. 화이트보드 스킨이 무겁다기 보다는 RSS 피드 전송량 때문인 것으로 생각됩니다. 아무튼 설치형 블로거의 고민 중 하나가 전송량이기 때문에 반가운 현상입니다.
전체 배치와 디자인 모두 'fotowall'과 비슷하게 만들었습니다. 화이트보드(whiteBoard)에서는 윤곽을 잡기 위해 그림을 사용하지만 'myBlakc'에서는 모두 DIV를 사용합니다. 따라서 외형적으로는 fotowall과 상당히 비슷합니다. 그러나 느낌이 조금 다릅니다. 모서리가 둥글기 때문입니다. CSS가 발전하니 예전에는 그림으로나 가능한 부분까지 CSS로 해결되는 셈입니다. 전체적으로 모서리는 둥글게 하고 그림자를 주었습니다. 물론 가장 떨어지는 브라우저인 Internet Explorer에서는 다르게 보일 수도 있습니다.
추가된 기능
이외에 스킨을 바꾸며 블로그 요약 기능도 추가했습니다. 블로그 요약 기능은 위 그림처럼 블로그 시작 부분에 글 요약을 표시해 주는 기능입니다. 또 이 요약이 결국 메타 태그 설명으로 들어갑니다. 따라서 결과적으로는 검색 엔진(Search Engine)을 고려한 기능 추가인 셈입니다. 참고로 이 기능을 추가하니 구글+에 링크를 올릴 때 예전처럼 깨지는 것이 아니라 정확하게 요약을 가져와서 훨씬 좋더군요. 플러그인으로 만든 것이지만 귀찮아서 공개하는 하지 않을 생각입니다.
아무튼 스킨을 'fotowall 디자인'으로 바꾸니 상당히 깔끔하다는 느낌이 듭니다. 물론 이런 느낌은 사람에 따라 다릅니다. 또 이번 스킨 역시 1단입니다. 오른쪽에 블로그 이동 메뉴가 있고 왼쪽에 블로그 관리메뉴[2]가 있기 때문에 3단으로 만들까 하는 생각도 했습니다. 그러나 저한테는 역시 1단이 어울리는 것 같아 1단을 고수하기로 했습니다. 또 예전에 글로 올렸 듯 1단만의 장점도 많습니다. 이 부분은 블로그 스킨을 1단으로 바꿔야 하는 이유!를 읽어 보면 됩니다.
바뀐 스킨에 대한 느낌을 적어 주세요.