리뷰/각종 웹 & 앱 리뷰

다음 블로그 더 넥스트, 레이아웃 기능의 변화

MIRiyA☆ 2010. 2. 5. 16:23

얼마전부터 다음 블로그의 꾸미기 기능 업데이트를 이것저것 만져보고있다. 더 넥스트 업데이트에서 가장 큰 변화는 바로 레이아웃의 변화다. 기존의 '기본형'에 더해 '와이드 갤러리', '심플 다이어리', '메모 다이어리', '커버 스토리', '웹진 스타일' 등의 형태가 새로 추가되었고, 4개를 새로 더 오픈할 예정이다. 기존에 비해 어떤게 바뀌었는지 상세하게 알아보자. 스크롤의 압박에 주의하시길.


자 일단 기본 화면부터 보자.



레이아웃에 들어가면 크게 글 보기 설정과 단 구성, 그리고 사이드바 3가지 항목이 있는데 그 중 글보기 설정이 핵심이다. 앞서 말했듯 '기본형', '와이드 갤러리', '심플 다이어리', '메모 다이어리', '커버 스토리', '웹진 스타일' +4의 형태중 하나를 고르자.



그 후 대표보기 항목을 '목록보기', '요약보기', '펼쳐보기' 세가지중 하나 고른 다음, 아래에서 각 항목을 보여줄 숫자를 정하면 된다. 


여기서 혼동될 수 있는 점이 있는데, 일단 대표보기를 요약보기로 지정을 하면, 그 아래 선택 항목에서 목록보기 3을 하나 펼쳐보기 1을 하나 요약보기만 보이기 때문에 저 숫자를 바꿔봐도 영 체감이 안되는 것이다. 해설하면, 대표보기는 블로그에 처음 접속했을때 보이는 화면이다. 지금 꾸미기 미리보기 화면에서는 내가 요약보기를 기본으로 해놔서 요약보기쪽 숫자 바꾼것만 눈에 보이고, 나머지 목록보기와 펼쳐보기쪽은 암만 숫자를 넣어도 변하는게 보이지 않는데, 그건 [관리] - [카테고리]에 가서 설정할 수 있는 '게시판형태'에 해당하는 부분이다. 따라서 당신이 어디 다른 카테고리의 '게시판형태'를 목록보기나 펼쳐보기로 설정했을 경우 거기 가서나 볼 수 있는 것이다. 내가 설명해놓고도 뭔 말인지 모르겠다. 정 이해가 안되면 블로그 카테고리중 하나는 목록보기로, 하나는 요약보기로, 하나는 펼쳐보기로 지정해놓고, 위 꾸미기 화면에서 숫자를 바꾸면 적용되는걸 볼 수 있을게다.





자 그럼 이제 현재까지 공개된 8개의 글보기 설정을 하나하나 뜯어보자. 여러분들이 직접 이것저것 다 적용해보면 시간도 오래걸리고 귀찮고 피곤하지 않나. 여러분들을 위해 내가 하나하나 다 적용해보고 스크린샷 탁탁 찍어서 정리해서 올려본다. 왜냐하면 나는 노가다를 잘하니까.



먼저 기본형. 기본형은 개편전 기존 다음 블로그와 동일하며, 목록보기를 15, 20, 30줄 중 하나를 지정할 수 있고, 요약보기를 5줄, 10줄, 15줄, 펼쳐보기를 1개, 2개, 3개까지 지정할 수 있다.



위는 참 진부해보이는 목록보기 화면. 뭔가 게시판 분위기 나게 쓰고 싶으면 위의 목록보기를 사용하자. 15줄, 20줄, 30줄까지 보여줄 수 있는데, 위는 30줄까지 최대로 보여준 모습이다.



이건 요약보기 화면이다. 내가 예전에 쓰던게 이거다. 5줄, 10줄, 15줄까지 보여줄 수 있다. 현재 위 스크린샷은 10줄을 찍어놓은 상태다. 나는 좀 더 많은 글을 보여주기 위해, 선택권을 많이 주기 위해 요약보기를 사용해왔다. 내 블로그는 아이폰 덕후도 오고, 카메라 덕후도 오고, 웹서비스 관련한 사람들도 오다가다 하니까 첫 화면에 영 아닌 글이 있으면 가버릴거 아닌가.



이건 펼쳐보기 화면이다. 그냥 글을 덩그라니 펼쳐서 보여주는건데, 대부분의 블로거들이 이런 방식을 사용한다. 1개, 2개, 3개를 줄줄이 보여줄 수 있다. 내 글은 항상 스크롤의 압박이 있기 때문에 항상 1개만 펼쳐놓는 편이다. 펼쳐보기 화면은 워낙 특성이 평이해서 심플 다이어리와 웹진 스타일을 빼곤 다 동일하다.





이번에는 와이드갤러리. 뭔가 사진 위주로 올리기 좋을것 같다.



와이드갤러리의 목록보기 화면이다. 이런식으로 세로 3열의 이미지를 보여준다. 3줄, 4줄, 5줄까지 설정할 수 있다. 5줄은 글 15개가 보이는 셈. 이미지를 와이드로 보여주는 점은 좋지만 각 이미지간 세로 간격이 보다 짧았으면 좋겠다. 너무 띄엄띄엄 떨어진 느낌. 그리고 여기서는 3단식 구성이지만, 1단식 구성을 할 경우 세로 4열까지 보여지니 참조하자.




이건 요약보기 화면인데, 오른쪽에는 그림, 왼쪽에는 글 제목과 간추린 내용을 보여준다. 요약보기는 5줄, 8줄, 10줄까지 가능하다. 위 스크린샷은 8줄을 적용한 상태. 스크린샷 짧게 찍기 위해서 8줄 적용했지만 쓴다면 아마 10줄짜리를 쓸 것 같다. 나는 많이 보여주고싶어하니까.


이거 외에 펼쳐보기 화면은 아까 앞에 나왔던 기본형과 완전히 동일하다. 당연히 스크린샷은 생략.





이번에는 그 자체적으로 개성있는 심플 다이어리입니다.



목록 보기 화면인데, 15줄, 20줄, 30줄까지 정할 수 있습니다. 월별로 하루도 빼먹지 않고 글 쓰는 분들은 정말 이쁘게 나올것 같네요. 저는 워낙에 포스팅이 적고 이미지 위주라 아쉽습니다. 제 생각에 이거 매니아분들 많이 생길것 같아요. 하루하루 적어가는 맛이 쏠쏠할듯. 에휴.. 블로그 메인은 펼쳐보기나 요약보기 쓰고, 다른 카테고리에 목록보기만이라도 이걸 적용할 수 있었으면 얼마나 좋을지 ㅠㅠ



이건 요약보기 화면입니다. 요것도 괜찮네요. 이번에는 월보다는 일이 강조되어 보입니다. 하루하루 적어나가면 참 좋을듯. 04일에 2개 올린건 2개 묶어서 보여주면 좋을텐데.. 만들기 힘들었나봅니다-_-; 아무래도 하나하나 도막도막 잘라놓으면 만들기는 편하니까요.



이건 펼쳐보기 화면입니다. 기존 다른것들과 다른 점이 왼쪽에 날짜가 나오는 부분이죠. 그리고 이 테마에선 잘 보면 제목 부분에 플래시 글꼴이 지정되어있습니다. 글꼴에 웹폰트 등을 사용할 수 있고, 큰 글꼴도 이쁘게 보여줄 수 있지요. 하지만 플래시 하나하나가 시스템 자원을 많이 차지하기 때문에 여러개는 못보여주고 이렇게 양이 적은 부분만 보여주고있습니다. 많아봐야 글 3개 정도 보여주는 화면에 적용해주고있네요.





이번에는 메모다이어리입니다. 이 형태는 목록보기와 펼쳐보기는 다른것과 거의 동일하고, 요약보기만 조금 다릅니다. 아래 스크린샷을 보시죠^^



이렇게 각 사진들을 축소해서 보여줍니다. 세로사진은 세로사진대로, 가로사진은 가로사진대로 보여주니 들쑥날쑥 나름대로 재미있습니다. 3줄, 4줄, 5줄까지 보여줄 수 있습니다. 뭔가 포스트잇으로 붙인것 같은 효과가 들어가면 좋겠지만 그러면 일이 너무 커지겠네요. 목록보기와 펼쳐보기는 다른 것들과 동일합니다.





이번에는 역시 특색 있는 커버스토리. 일부는 큰 사진으로 보여주고 일부는 작게 보여줍니다. 이것도 나름 인기 있을것 같아요.



목록 보기는 15, 20, 30개까지 보여주고, 위는 30개 켜놓은 상태입니다. 한쪽에 가장 최신의 글이 보이네요. 미관상 밑으로 몇개 더 보여주면 좋으련만 단 하나만 보여주니 약간 썰렁합니다. 그리고 여기도 제목에 플래시 폰트가 적용되는군요.



커버스토리의 핵심인 요약보기 화면입니다. 요약보기는 2줄, 3줄, 4줄까지 설정할 수 있고, 위는 4줄이 적용된 모습입니다. 여기도 플래시 폰트가 3개까지 적용되는건요. 상단에 3개를 저렇게 보여주고, 하단의 줄 수를 늘려줬으면 정말 좋을것 같은데 유감스럽게도 4줄이 다네요. 몇줄 더 늘려주면 정말 좋을것 같습니다 ㅠㅠ


커버스토리의 펼쳐보기 화면 역시 다른 펼쳐보기와 동일하니 이것도 패스합니다.





웹진 스타일은 큰 개성이 있어보이진 않지만 마치 기본 보기의 업그레이드형 같은 느낌을 줍니다. 



이건 목록보기인데, 잘 보시면 위에 썸네일 이미지가 8개 보이는게 보입니다. 이건 3단식일때 8개, 2단식일때 10개, 1단식일때 12개까지 보입니다. 최근에 글 쓴 순서대로 이미지를 하나씩 보여주는거고, 클릭하면 해당 글로 이동합니다. 목록보기는 15개, 20개, 30개까지 보여줄 수 있습니다.



이건 요약보기 화면. 대부분의 보기 설정에서 요약보기는 핵심적이더라구요. 기본보기에서 사진이 정사각형으로 변하고, 커진 느낌입니다. 칸칸마다 보이는 하늘색 테두리가 미묘하네요. 그리고 제목 크기좀 키워줬으면 좋겠습니다. 나머지 여백들이 너무 비어보이네요.. 요약보기는 5줄, 8줄, 10줄까지 보여줍니다.



이건 웹진 스타일의 펼쳐보기 화면입니다. 다른 펼쳐보기랑 비슷하지만 상단에 썸네일이 몇개 보이는 점이 유일하게 다른 부분입니다. 하지만 펼쳐보기에서 제목에 플래시를 넣어주지 않은 부분은 좀 안습입니다. 저는 딱 이거 하나 때문에 웹진 스타일을 쓰지 않습니다. 전 제목 글꼴이 예쁘게 나오게 플래시가 들어가는게 좋거든요.




글 보기 설정은 모두 다룬것 같고, 이제 단 구성에 대해 다뤄보겠습니다.



위의 화면이 단 구성 쪽인데, 왼쪽의 3개는 1단형, 가운데 2개는 2단형, 오른쪽의 3개는 3단형입니다. 여러분이 보시는 이 블로그는 3단형인거죠. 블로그를 쓰면 필연적으로 메뉴가 길어질 수 밖에 없어서 저는 3단형을 쓰고 있습니다. 


1단형일때는 글 너비를 '넓게', '보통', '좁게' 3가지로 설정할 수 있고, 2단형일때는 글 너비를 '보통', '좁게' 2가지만, 3단형일때는 오직 '좁게'만 설정할 수 있습니다. 전 3단형일때도 보통 너비로 써보고싶은데, 다음 블로그 스킨이 모두 가로 1024px 최소 기준으로 설정되어있어 어쩔 수 없었습니다. 아이참.



1단형은 3가지가 있는데, 하나는 메뉴들이 위에 오는거고, 두번째는 메뉴를 위아래에 배분할 수 있는것, 세번째는 메뉴를 아래에 몰아넣은것이 있습니다. 샘플로 메뉴를 아래에 몰아넣은 세번째걸 보지요.



이런 식으로 메뉴가 아래에 오고 글이 위에 옵니다. 1단형에 '보통'너비, 그리고 가운데 정렬을 적용했습니다. 다만 카테고리 부분이 저는 너무 길기 때문에 길이를 맞추는데 애를 먹었습니다. 카테고리를 반으로 잘라서 넣으면 참 좋으련만 참 번잡하지요. 사진형 블로그를 쓰실 분들은 1단형이 가로 사이즈를 최대로 이용할 수 있기 때문에 좋을것 같습니다. 저는 글 위주 블로그라 패스~





이번에는 2단형입니다. 2단형은 글의 우측이나 좌측에 메뉴를 몰아넣은 형태입니다. 메뉴가 옆에 오기 때문에 1단형보다는 가로 사이즈를 덜 사용하게 되지만 길쭉한 카테고리를 잘 보여줄 수 있네요. 다만 메뉴를 한줄로 쌓는 특성상 글이 짧을 경우 메뉴 부분만 엄청나게 길어져서 보기 흉할수도 있습니다.



위에 보이는 화면이 바로 2단형 좌측 사이드바입니다. 지금은 카테고리만 남겨놨지만 나중에 다른것들이 붙으면 엄청 길게 늘어지지요. 1단형과 마찬가지로 카테고리가 길면 쓰기 힘든 형태입니다 ㅠㅠ





이번에는 인기 많은 3단형 단 구성입니다. 각각 사이드바를 2개씩 넣을 수 있습니다. 하나는 왼쪽에 몰아넣기, 두번째는 양쪽에, 세번째는 오른쪽에 몰아넣기입니다. 샘플샷 세장 보지요.





위에서부터 차례로 왼쪽, 양쪽, 오른쪽이 되겠습니다. 저는 양쪽에 배분해서 쓰고있지만, 오른쪽이나 왼쪽에 몰아놓으면 티스토리나 텍스트큐브스러운 느낌을 줄 수 있겠네요. 역시나 아쉬운 부분은 3단형에선 본문 폭이 '좁게'밖에 지원되지 않는 점입니다. '중간'까지라도 되면 좋을텐데, '중간' 사이즈까지 지원하면 가로 1024px을 넘어설테니.. 가로 1024px은 아직 쓰는 분들이 많으니 어쩔 수 없겠네요.


여기까지 단 구성을 살펴봤고요, 추가로 단 구성에서는 영어와 한글로 메뉴 표기 방식을 정할 수 있습니다. 뭔가 양키 삘 내고 싶은 분은 영어로 한번 써보시길. 하지만 홈과 방명록 등의 상단 메뉴에는 영어가 적용되지 않는 부분은 버그인것 같으니 얼른 고쳐지길 빌어봅니다.





이번에는 마지막 항목인 사이드바에 대해 쭉 알아보고 넘어갑니다. 최근소식들, 부가서비스에 체크하면 해당 구성요소들이 블로그에 생기는데, 각각을 마우스로 끌어다가 원하는 위치에 편리하게 배치할 수 있습니다.



이렇게 구성요소 위에 마우스를 올리면 마우스 커서가 이동할 수 있게 바뀝니다. 그리고 위에 꾸미기 버튼과 삭제 버튼이 나타나는데, 꾸미기를 누르면 나중에 소개할 직접 꾸미기 기능으로 이동합니다. 그리고 삭제 버튼을 누르면 바로바로 없어지지요.



마우스로 클릭하고 이렇게 끌어당기면 구성요소의 위치를 옮길 수 있습니다.


이상 다음 블로그의 레이아웃 기능에 대해 완전히 훑어보았습니다. 다음 순서는 타이틀과 메뉴바 되겠습니다.



제 블로그에는 아이폰과 DSLR 카메라에 대한 정보와 팁,

웹서비스의 사용성과 UX에 대한 글이 올라옵니다.


이 글이 도움이 되었다면 RSS로 구독해보세요.

매번 블로그에 방문하지 않아도 새 글 소식을 받아보실 수 있습니다.

http://blog.daum.net/xml/rss/miriya



이 블로그의 모든 글은 자유롭게 링크할 수 있으며, 오픈캐스트 발행을 허용합니다. 

다른 블로그로 스크랩하거나, 출처와 함께라면 퍼가도 됩니다.