블로그 스킨을 myBlack으로 변경합니다!

myBlack은?

myBlack은 화이트보드를 기반으로 디자인을 바꾼 스킨입니다. 일부 디자인을 제가 바꾸기는 했지만 스킨의 구조와 디자인의 상당 부분이 화이트보드 스킨을 그대로 사용합니다. 그런데 이름을 바꾼 이유는 외형적 차이가 크기 때문입니다. 아울러 모두 제가 만든 스킨이 아니라 따로 공개할 생각은 없습니다. 예전 스킨에 비해 어떤지 소감을 댓글로 남겨 주시기 바랍니다.

목차

whiteBoard 스킨

꽤 오래 동안 제가 사용한 스킨은 whiteBoard입니다. 당시 '화이트보드'(whiteBoard)로 바꾸면서 올린 글이 스킨을 whiteBoard로 바꿨습니다이고 올린 날짜가 2008년 11월 14일입니다. 따라서 오늘 스킨을 바꾸면 무려 '3년'만에 블로그 스킨을 바꾼 셈입니다. 원래 좋다 싶으면 바로 바꾸지만 또 한번 좋아한 것은 어지간 하면 바꾸지 않는 성격입니다. 이 때문에 '화이트보드'는 블로그 스킨 중에는 가장 오랜 기간동안 사용한 것 같습니다.

그런데 이제 스킨을 'myBlack'으로 변경합니다. 'myBlack'은 공개 스킨이 아니고 제가 쓰기위해 만든 스킨입니다. 아마 제 블로그를 자주 방문하는 분은 이미 바뀐 스킨을 알 것이라고 생각합니다. 오늘 바꾼 것이 아니라 계속해서 스킨을 바꿔왔기 때문입니다. 지난 달 9월 21일에 트위터에 블로그 스킨을 바꾸고 있다고 올렸기 때문에 약 20일간 틈틈이 작업한 셈입니다. 물론 앞으로도 계속 이런 저런 변경 작업을 계속할 예정입니다. 그러나 이전 스킨의 흔적을 어느 정도 지웠기 때문에 스킨 변경을 알리게됐습니다.

whiteBoard+fotowall

이번 스킨은 화이트보드 기반에 과거 스킨으로 사용한 fotowall의 디자인을 입힌 것입니다. 'fotowall'은 2006년 부터 Moving Box로 바꾸기 전까지 약 2년간 사용한 스킨입니다. 즉, 제 블로그에서 화이트보드 다음으로 오래 사용한 스킨인 셈입니다. 그외에도 사용한 스킨이 더 있지만 기억에 남는 스킨은 이 정도인 것 같습니다. 두 스킨을 블로그에 적용한 모습은 다음 그림을 참조하면 될 것 같습니다.

fotowall

2006년부터 2008년까지 사용한 스킨. 전체적으로 검은색 디자인이고 그림이 별로 없다. fotowall 오리지날은 아니고 역시 변경해서 사용한 스킨이다.

whiteBoard

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단으로 바꿔야 하는 이유!를 읽어 보면 됩니다.

바뀐 스킨에 대한 느낌을 적어 주세요.

관련 글타래


  1. 하루에 3~5개씩 글을 올리고 피드를 5개로 해두니 놓치는 글이 많다는 분이 많아 10개로 올렸습니다. 그러나 최근에는 글을 이렇게 올리지 못하기 때문에 5개로 줄였습니다. 
  2. 로그인을 해야 나타납니다. 따라서 일반인은 보지 못하는 메뉴입니다. 
글쓴이
author image
운영체제의 모든 것을 운영하고 있는 IT 블로거. IT 블로거라는 이름은 현재 시국때문에 시사 블로거로 바뀐 상태다. 그러나 나는 아직도 시사와 사회에 관심이 많은 IT 블로거일 뿐이다. 컴퓨터, 운영체제, 시사, 가족, 여행, 맛집, 리뷰등과 살면서 느끼는 소소한 일상이 블로그의 주제이다. 왼쪽의 아이콘은 둘째 딸 다예가 그린 내 모습이다.
2011/10/08 13:01 2011/10/08 13:01
오늘의 글
인기있는 글
조회수 많은 글 | 베오베
댓글 많은 글 | 베오베

Trackback

Trackback Address :: https://offree.net/trackback/3510

Facebook

Comments

  1. 진아랑 2011/10/08 13:26

    깔끔하고 보기 좋아요.
    Simple is Best !

    perm. |  mod/del. reply.
  2. 진모씨 2011/10/08 17:02

    지금까지 바꾸신 스킨들과 비교가 안될 정도입니다...
    정말 깔끔하고 보기가 좋다고 생각합니다.

    perm. |  mod/del. reply.
  3. 세릭 2011/10/15 12:11

    흑백이 잘 어울려 한결 깔끔해보이네요. ^^

    블로그 포스트 요약도 사용자를 배려한 부분이라서 맘에 듭니다.!

    perm. |  mod/del. reply.
    • 도아 2011/10/15 14:52

      감사합니다. 그런데 블로그 아이콘을 가져오지 못하는군요.

    • 세릭 2011/10/15 19:55

      아. 제가 블로그 아이콘이 맘에 안들어서 삭제하고 방치를 해서. ㅜ.ㅜ 어떻게 만들까 생각중이에요. 저도 스킨은 수정 못하고.
      ㅜ.ㅜ 그냥 사이드바만 수정중이에요.
      700px이상으로 본문을 수정하고 싶은데. 기본 사진이 전부 600px이라 좀 더 고민을 해봐야 할 것 같아요. ^^

  4. Artur 2011/10/23 23:51

    순수 글 내용이 1분정도 있다가 뜨네요;;

    perm. |  mod/del. reply.

(옵션: 없으면 생략)

글을 올릴 때 [b], [i], [url], [img]와 같은 BBCode를 사용할 수 있습니다.