블로그 디자인 리뉴얼

거의 2년만에 블로그 디자인을 손봤다.

예전에 네이버 블로그를 몇 년간 쓰다가 티스토리로 넘어왔는데 당시에 기본형 디자인을 몇달간 쓰다가 좀 심심한듯 해서 이것저것 스킨을 건드리면서 변화를 모색해 보았지만 기본 디자인에서 별반 나아진 것 없이 그냥 그렇게 2년을 넘게 써온 것이다.

스샷을 좀 떠놓을걸 그랬나... 그렇다고 이전 스킨을 복구해서 스샷만 건진 다음에 다시 원래대로 되돌리기는 무쟈게 귀찮다. firefox 에 남아있는 썸네일 정도밖에는 없는 듯..

보라색 좋아하면 싸이코 기질 있다는 낭설(?)에도 굴하지 않고 꿋꿋히 2년 넘게 입어왔는데 벗어버리자니 좀 아쉽기도 하다.

그나저나 이번 리뉴얼에서 가장 공을 들인 것은 메뉴를 접었다 폈다 할 수 있는 기능이다. 이 기능은 구글 안드로이드 페이지에서 영감을 얻었는데(사실 그냥 대놓고 베꼈지만), 막상 해놓고 보니 간지가 좀 좔좔 흐르는 듯하다.

클릭하면 메뉴가 접힌다.

몇달 전에 한 번 구현을 하려고 덤볐다가 무참히 실패했는데 이번에 다시 시간을 내서 설계를 새로 가다듬고 구현을 하긴 했는데 몇 번 해보니 재미가 없어진다.처음 완성하고나서는 뿌듯한 마음에 혼자 수십번을 접었다 폈다 했다는거..... -_-a

무엇보다도 이번 리뉴얼에서 도입한 가장 큰 성과라면 Syntax Highlighting 기능을 꼽을 수 있다.

자동으로 이쁘장하게 꾸며준다.

예전에 자바로 syntax highlighting 을 구핸해놓은게 있었는데 이건 뭐 서버 돌리고 url 찾아가서 코드 붙여놓고 결과를 다시 반환받는... 지루하고 자질구레하고 귀찮은 과정을 두어 번 경험해보면 자연스럽게 쓰지 않게 되어 하드 어느 구석에 쳐박혀 있었는데...

이번에 자바스크립트로 옮겨서 페이지 로드 시 자동으로 문자열을 파싱해서 키워드를 추출한 다음에 위와 같은 결과를 내놓는다.(만들어놓고 다른 문서를 하나 쓰는데 티스토리 글 작성 시 "pre" 태그 사이에 들어간 소스코드에 줄바꿈 태그 "BR"이 자동 삽입되어서 코드가 떨어져나가는 문제점이 발생... 어쩔 수 없이 파싱 전에 BR 태그 떼내는 모듈을 덧붙여서 문제를 해결했으나 티스토리에서 이것 좀 어떻게 안고쳐주나...ㅠ.ㅠ)

이렇게 기능적인 면에만 치중을 해서 그런지 디자인은 영 허무맹랑한 듯...

천성이 디자인... 같은 쪽과는 거리가 멀어서 최대한 미려하게, 단순, 심플, 간결하게 한다고 했으나 해놓고 보니 밍숭맹숭한게 소금 안뿌린 계란 후라이같다.

과도한 여백의 미

"동양적 여백의 미를 살린 간결함"이라고 애써 자위해보았지만 텅텅 빈듯한 느낌은 부정하기가 힘들다. 뭐 그래도 이전에 회색 바탕에 보라색 풍경보다는 낫긴 하지만 아이콘같은걸 메뉴 헤드라인에 좀 넣고 꾸며볼까... 생각하다가..

현란한 밤거리의 네온싸인을 연상시킨다.

이것저것 갖다 붙이다보면 어느순간  저렇게 되기 때문에 그냥 이정도로 마무리 짓기로 했다.

그나저나 블로그 제목은 언제 바뀔지.... 뭐가 좋을까 생각을 해보았으나 구관이 명관이라고 그냥 저것도 괜찮아 보인다. 특정 주제를 암시하는 제목으로 바꾸면 자꾸 얽매이게 되는 단점이 있기 때문에 당분간은 그대로 밀고 나가기로 결정.

설치형 블로그를 하고나서 css 와 자바스크립트 실력이 일취월장해버렸다. 의도한게 아니라 어쩌다보니... -_-;;

조만간 "가변폭"으로 디자인을 바꾸면 과도한 여백의 미가 좀 줄어들지 않을까 싶다.