이 글은 이온디 마이노트 레이아웃을 제작 배포하기 전에 XpressEngine 오픈UI 라운지에 올렸던 글입니다.
보관용도로 가져와 포스팅합니다.
티스토리 용으로 만들어 썼던 레이아웃입니다.
만들 당시 상당히 애를 먹었습니다.
첫째는 이미지 없이 둥근 곡선을 만드는 것이었고, 이걸 크로스브라우징이 한참 대세일 때라서
파이어폭스, IE6 왔다 갔다 하면서 어렵게 만들었던 기억이 납니다.
둘째는 미니홈피에서 디자인을 차용한 것이지만 미니홈피의 답답함에서 벗어나고자 브라우저의 크기에 따라
컨텐츠 영역의 너비가 변하기 때문에 이를 맞추느라 애를 먹었고요.
셋째는 배경을 기본 배경+여자이미지 배경 이렇게 한 영역에 2개의 배경을 넣느라 약간 고생했습니다.
지금 생각해보면 별거 아니지만 만들려고 하는 당시에는 어떻게 해야하는지 꽤 끙끙댔습니다.;;
그리고 notice, recent ectries, comments, calendar, tags 등 이 부분을 클릭하면 아래로 스스륵 하고 닫히고 열리고
이를 또 쿠키로 구워서 다음 접속시에도 이를 유지하게 만들었고요.
마지막으로 글 본문의 tags 나타내는 부분 역시 점선의 곡선, 이미지를 사용했지만 각 브라우저 간의 1픽셀의 오차에도 어긋나지 않도록 유념하여 만들었기 때문에 당시에는 IE6 이라는 대적으로 인해 상당히 애를 먹었습니다. ㅡ_ㅜ;;
사실 이 스킨을 만들 적에 정찬명님께도 몇 번이나 여쭤가면서 만들었던 기억이 나네요.
현재 이와 얼핏 비슷하게 사이트 레이아웃 스킨으로 만들어 사용 중이기도 합니다.
http://mynote.eond.com
한다고 했는데. ㅡ_ㅜ 손이 잘 가질 않는군요. 하악..;;
혹시나 블로그용으로 만들어 사용하면 괜찮겠다 싶어서 이렇게 오픈UI라운지에 올리게 되었습니다.
디자인이나 실용성이 있다고 판단되시면 현재 사용하고 있는 이온디 마이노트 레이아웃 스킨을 올려서 검수를 해주십사 부탁드리고 싶습니다. 커밋터분들의 보완 과정을 거치면 더욱 완성된 스킨이 되지 않을까 생각됩니다.
설명이 빠뜨린 부분이 있는데 이 스킨의 초창기 모델이 미니홈피 라서 보시면 아시다 시피 프로필 영역은 미니홈피의 그것과 동일합니다. 현재 이 영역은 게시판을 이용해 사용하고 있고, 새로운 이미지를 올리지 않으면 이전에 올렸던 그림이 최신 이미지로 보여지게 되는 원리입니다.
왼쪽에 프레임이 나뉘어져 있는데 실제 frame 태그는 아니고 div로 나누었는데,
기본 사이트와 블로그와의 이동을 위해 만들었다고 보시면 됩니다. 그 외에 사용자의 재량에 따라 맘껏 편집, 삭제가 될 수 있겠죠.
왼쪽에 두어도 되고, 상단에 두어도 되고, 하단 등 사용자의 입맛에 맞게 위,아래, 우, 좌 선택하여 사용할 수 있게 제작되면 좋을 것 같습니다.
왼쪽 프레임의 흰색 위에 네모난 점들은 사용자들이 관리자가 설정해둔 블로그의 배경 그림을 선택해서 사용할 수 있는 기능입니다.
css를 활용해 전체적인 형태는 동일하지만 가볍게 스킨의 색상을 조절한다거나 유저의 취향에 따라(저는 거무틱틱한 색을 좋아해서 저랬지만;;) 밝고 유치찬란한 미니홈피 스타일의 스킨으로도 간편하게 조절할 수 있을 것입니다.
