'100인'에 해당되는 글 1건

  1. 2010.03.30 제가 구성해본 블로그 첫화면을 여러분에게 알려드릴께요! (41)
티스토리 블로그의 첫화면을 꾸미는 방법에는 다양한 방법이 있습니다.
가장 기본적으로 누구든 쉽게 적용할수 있는 추천세트를 이용하는 방법입니다. 그러나 정해진 틀에서 남들과 같을수밖에 없는 첫화면은 아마도 자신만의 블로그의 컨셉을 살릴수는 없을것 같습니다.

최대한 자유도가 높으면서 완성도 높은 마법사 형식을 이용하여 서로 다르게 만들어 낼수 있다면 좋겠지만, 아쉽게도 현재는 완성도가 높은편은 아닙니다... 하지만, 현재 첫화면 꾸미기의 아이템을 가지고 해볼수 있는 최대한의 방법으로 진행 해볼까 합니다.

저의 블로그는 IT를 기반으로 하고 있는 블로그이긴 하나, 제가 하고 싶은 리뷰나, 혹은 영화 기타 일기, 사진, 여행등 다양한 부분에서 글을 생산하고 있기 때문에, 각 해당 글에 맞는 아이템을 사용하여 첫화면을 만들어 낼것입니다.

다음은 현재 적용하고 있는 제 블로그의 첫화면입니다....
이게 현재 저의 블로그에 적용된 첫화면입니다. 위에서 보고 계시는 첫화면 구성은 어떤식으로 구도를 잡고 또, 어떤식으로 만들어졌는지 하나씩 알려드리겠습니다.

이 방법을 통하여 여러분도 원하는 첫화면을 구성하시길 바랍니다.

블로그의 첫화면은 블로거 본인이 이용하는게 아니라, 검색사이트나 메타사이트를 통하여 접근하는 손님이 이용하는 공간입니다..

일반적으로 블로그는 첫페이지를 통하여 접근하지 않습니다.
이 말은 블로그는 일반 포털사이트나 홈페이처럼 첫페이지를 통하여 접근하는 방식을 취하지 않습니다.
다시말해서, 다음이나 네이버처럼 포털 메인주소로 접속후에 카페, 메일, 기타, 뉴스등을 이용하지만, 블로그는 검색사이트나 메타사이트에서 해당글을 통하여 바로 다이렉트로 접근하기 때문에 첫페이지를 통하여 접근하지 않습니다.

그러나 접근후에는 첫페이지를 접근하게 됩니다. 이것은 그동안 해오던 포털 사이트에서의 습관적인 이용방법과 비슷합니다. 카페나 홈페이지처럼 메인페이지를 찾기 마련이라는것입니다. 어떤 정보를 찾다가 몾찾으면 대부분 홈으로 많이들 갑니다. 홈으로 가면 큰 카테고리부터 요점이 정리되어 있다는걸 네티즌은 알고 있기 때문입니다.

그렇다면 첫페이지는 손님의 입장에서 보기 쉽게 정리가 잘 되어 있으면서 많은 양은 아니지만 이 블로그에 어떤것들이 있는지를 보여줘야 하기 때문입니다.

그럼으로 블로그의 첫페이지는 해당 블로그가 하는일을 보여준다거나, 그동안 힛트했던 글을 보여준다거나 하는게 바로 블로그 첫화면이 해야할 일이라고 생각합니다.

그렇다면 본격적으로 한번 진행 해보겠습니다.





첫번째 타이틀을 이용해서, 각 아이템을 분류를 하는 방법입니다.

아이템을 구분하는 방법으로 티스토리 첫화면 꾸미기 방법중에 구분선을 주는 방법이 있습니다.  이 방법을 통하여 해당 아이템의 상하단으로 구분선을 주어서 아이템을 구분하여 정리할수 있지만, 사이가 너무 많이 벌어지더군요!! 아래를 보시면 아시겠지만 상하단 구분선을 꼭 주지 않더라도, 충분히 아이템 타이틀바를 통하여 구분을 할수 있습니다.

좌측은 구분선을 이용하지 않고, 타이틀바를 이용하여 각 아이템을 분류한 방식이며, 우측은 타이틀바를 사용하지 않고, 각 아이템을 구분하기 위해 구분선을 이용한 방식입니다.

좌측은 구분선을 주지 않고 타이틀바를 이용하여 각 아이템을 구분하였습니다. 또한 우측은 타이틀바가 없는 상태로 구분선만으로 각 아이템을 구분하지만  타이틀바를 이용하는것보다 아이템의 간격이 더 벌어졌다는것을 알수 있습니다.

좌측을 선택하겠습니까? 우측을 선택하겠습니까??

위에서 적용된 타이틀바를 꼭 저렇게 배경을 넣고 만들어야할 이유는 없습니다.

위처럼 다양하게 타이틀바를 만들수 있습니다.
그러나 보시는것처럼, 라인을 이용하는것보다 타이틀바의 배경색상을 이용하는게 전체적으로 구분이 쉽게 되는것을 알수 있습니다..







각 아이템에는 타이틀을 만들수 있습니다 .타이틀 맨 앞에는 아이콘을 넣을수 있으며, 해당 아이콘으로 글에 대한 분류를 간접적으로 표현 할수가 있습니다.
타이틀바는 [리모콘->디자인]에서 쉽게 꾸밀수 있으며, 해당 아이콘을 클릭하여 어울리는 아이콘을 넣어도 되고, 넣기 싫으면 안넣으셔도 됩니다.  (아이콘을 클릭하여 해당 글에 맞는 아이콘을 선택하여 봅니다.)

저는 이렇게 했습니다.


이렇게 하나의 영화 아이템이 완성 되었습니다.

이런식으로 하나의 색상과 테마를 정하고 그 테마에 맞는 통일성을 갖추도록 해주는게 좋습니다. 그래야 읽어보지 않아도, 쉽게 해당 아이템을 구분할수 있습니다.

  • 소스
  • 아이템 -> 갤러리 -> 4번선택 (3:4 사진비율)
  • 디자인 -> 타이틀[V] -> 글제목[V] 20자






여러분이 생각하기에 아이템은 원하는 글을 보여주고자 하는 방식으로 설정하는게 기본일것입니다. 또 다르게, 아이템은 html로도 이용가능 하다는 것을 아마 알고 계실것입니다.
바로 이 부분이죠!


현재 제 블로그에 적용된 방식입니다...
아이템 두개를 이용하는것입니다.
1. 현재 보여주고자 하는 아이템을 선택한후에 상단에 아이템 추가 버튼을 눌러 해당 아이템 바로 위에 아이템을 하나 더 추가 합니다.
2. 해당 아이템을 html으로 이용하여 원하는 타이틀바를 만듭니다.
포토샵이나 그림판등으로 이미지를 만들고, 그 이미지를 스킨에 파일 업로드 시킨후에 해당 이미지 주소를 불러와서 위처럼 넣는 방식입니다.


이 방법으로 하나의 아이템은 타이틀이 되고, 하나의 아이템은 내용이 되어 보는것입니다. 현재 제 블로그 첫화면의 메인 상단에 적용을 해보고 있습니다.


  • 소스
  • 아이템 -> 갤러리 -> 2번선택 (4:3 사진비율)
  • 디자인 -> 타이틀[V] -> 글제목[V] 40자 -> 글요약[V] 200자
  • 카테고리명[V] -> 작성자[V] -> 댓글수[V] -> 작성일[V]




이번 첫화면꾸미기 옵션중에 개인적으로 가장 마음에 드는 부분입니다.

원하는글을 선택할수도 있지만, 예전에 인기 있었던글인 바로 조회수 많은글, 댓글수 많은글, 트랙백수 많은글, VIEW추천수 많은글을 보여줄수 있다는것입니다.제블로그에는 다음과 같이 만들어봤습니다....

이렇게 묻어둔 글을 다시 끄집어 내시길 바랍니다.

또한 태그로도 지정이 가능하니, 블로그에 관련된 글이나, 요리에 관련된 글만 모아서 첫화면을 꾸밀수도 있겠습니다,

  • 소스
  • 아이템 -> 목록형 -> 7번선택 (4:3 사진비율)
  • 디자인 -> 타이틀[V] -> 글제목[V] 50자 -> 글요약[V] 50자






제 블로그는 사진 블로그가 아닙니다. 그러나 가끔 여행을 갑니다. 그렇게 멋진 풍경과 사진 먹거리, 볼꺼리를 디카에 담아서 블로그에 올립니다. 아주 가끔 올리다 보니, 사실 묻혀 버려서 다시 보여주기 힘든 부분이기도 하지만, 이번 첫화면의 기능을 통하여 자랑을 해볼까 합니다.

저는 여행이라는 컨셉으로 계획을 잡고, 어떻게 해야지 깔끔하게 잘 보여줄것인가를 생각해보고, 다음과 같이 정리를 해봤습니다.
사진을 기준으로 운영하시는 블로그에게는 위와 같은 방식의 깔끔한 정렬이 좋아보입니다.
물론 갤러리의 방식중에 사진만 크게 나오는 방식인 헤드라인 방식도 나쁘지는 않습니다.. 여러분이 원하는 스타일로 선택하여 보세요!! 저는 아무래도 사진 블로그는 아니다 보니, 위처럼 갤러리 방식으로 선택하여 보았습니다.

어떠신가요? 한번 써보심이요^^//

플래쉬 갤러리 방식도 도입되면 좋겠다라는 생각이 드네요!

  • 소스
  • 아이템 -> 갤러리 -> 4번선택 (4:3 사진비율)
  • 디자인 -> 타이틀[V] -> 글제목[V] 20자





아이템중에 조합형이라는게 있습니다. 조합형은 홈페이지로 예를들면 프레임을 이용하는 방법입니다. 하나의 아이템의 공간에 두개의 아이템을 이용하여 조합을 시키는 방법입니다.

예를들어 30평짜리 공간을, 20평과 10평으로 나누어 20평은 갤러리로 10평은 목록형으로 쓰는 다세대 복합 주거 방식을 체택하는것입니다. ;; ㅋㅋ 말하고도 웃기네요/// 쉽게 설명하자니 그렇습니다..--

아무튼 다음을 보시죠!

조합형의 특징은 하나의 아이템공간에 두개를 이용하여 조합이 가능하며 좌측과 우측에 다른 아이템을 별개로 작업이 가능하다는게 큰 특징입니다.

좌측은 헤드라인형으로 준비를 하고, 오른쪽은 목록형으로 준비를 하면 2:1의 비율을 적절하게 이용할수 있지 않을까 합니다.


  • 좌측 소스
  • 아이템 -> 6번선택 (7:4 사진비율)
  • 디자인 -> 타이틀[V] -> 글제목[V] 120자
  • 글요약[V] 225

  • 우측 소스
  • 아이템 -> 10번선택
  • 디자인 -> 타이틀[V] -> 글제목[V] 22자





티스토리는 기본적으로 다음에서 제공하는 동영상을 업로드 할수가 있습니다. 검색을 통하여서도 가능합니다. 동영상이 퍼가기가 가능하다면 해당 동영상을 첫화면에서도 넣을수가 있습니다. 사실 HTML을 이용하는거라 특별한 방법은 아니지만, 다음과 같이 이용할수도 있겠쬬^^

정말 재미있는 동영상이 있다면 첫화면 상단이든 하단이든 부분적으로 한번 넣어본다거나, 혹은 기대되는 영화 예고편이 있다면 넣어보고, 내가 만든 UCC동영상이 있다면 자랑 하셔도 좋을듯 싶습니다. 첫화면이 아니라면, 이런 좋은 영상이 최신글에 의하여 묻혀 버리기 마련입니다. 이젠 다시 끄집어 내 자랑해보세요!

저는 아래처럼 한번 해봤습니다.!!
제 블로그에서는 2007년 티스토리 오픈당시에 만들어졌던 동영상을 준비 해봤습니다.
소스는 JW플레이어를 이용하였습니다.





html은 다른 아이템과 다르게 완전 쌩뚱맞게 다르게 이용이 됩니다. 다른 아이템과 다르게 기본적으로 특성과 속성이 없는 상태로 이용이 됩니다. 그럼으로써 기존의 속성을 가진 아이템과 전혀 다른 디자인이 나오거나 구분이 안됩니다.

그래서 적어도 이렇게는 할수 있어야 하겠습니다.

결론은 이렇습니다.
html도 타이틀바와 상하단의 구분선을 이용하여 html소스를 감싸고 있어야 한다는겁니다. 지금처럼 고정이 아닌, 옵션 체크 여부로 말입니다...

이렇게 되어야 다른 아이템과의 차별화가 없이, 자연스럽게 html을 이용하면서도 디자인은 같이 묶어갈수 있을것 같습니다. 물론 티스토리의 장점인 자유도를 주기 위하여 강제가 아닌 지금의 다른 아이템처럼 타이틀바를 켜거나 끌수 있어야 합니다...
그러나 현상태는 html을 선택하게되면 모든 디자인 옵션들이 작동 불가하도록 되어 있다는건 수정되었으면 합니다.

이렇게 만들어진 첫화면은 제 블로그 메인 화면에서 확인 가능합니다.
http://www.jaea.net


2010/03/22 - [리뷰/티스토리] - [티스토리] "첫화면 꾸미기" 각종 아이템의 쓰임새는 이렇게...
2010/03/22 - [리뷰/티스토리] - [티스토리] "첫화면 꾸미기" 설정부터 해봅시다^^

Post by : 친절한 재아

댓글을 달아 주세요!

  1. 첫화면 편집의 매력에 빠져 워드프레스 공부를 하고있던 중인데 조만간 티스토리 첫화면 편집도 시도해봐야겠네요^^

  2. 첫화면 들어와서 깜짝놀랬습니다! 왜이리 이뻐졌나요~ ㅋㅋㅋ
    재아님 첫화면 탐납니다.

  3. 티스토리도 네이버처럼 디자인이 좀 쉬웠으면 좋겠어요...
    그리고,,
    댓글창의 요 넘의 벌레 좀 빨라졌죠?? 그쳐???

    • 티스토리는 디자인보다 기능적으로 좀더 우월하게 보입니다...//

      댓글창의 벌레는 전혀 빨라지지 않았습니다.
      다만, 금드리댁님 컴퓨터가 빨라진게 아닐까요??

  4. 재아님~ 첫화면이벤트 당첨 축하드려요~~
    역시 꼼꼼하고 세밀한 리뷰 때문에 되신것 같아요..
    1등이 조금 아쉽네요..^^

  5. 어제 제 블로그 디자인으로 칭찬해주시더니...
    더 멋지게 해놓으셨는걸요~

    거기에 첫화면 꾸미기 입상까지~~~
    완전 부럽네요^^ㅋ

    근데 저 벌레좀 없애주심 안되요 ㅋㅋㅋㅋ

  6. 블로그 참 이뻐요..
    전 컴맹이라...ㅋ

  7. 티에디션 나와서 이 글 다시한번 정독하고 갑니다. 좋은 정보 감사해요!

  8. 블로그 운영에 많은 도움이 되겠습니다.
    그나저나 전 제컴에 벌레가 있는줄 착각을 ..ㅎㅎ
    즐거운 주말 보내세요.^^

  9. 귀차니즘도 귀차니즘이지만, 포스팅 버릇상
    처음 상단에 600x400이미지를 삽입중이라
    당분간 테터데스크를 이용할듯 싶네요 ㅎ

  10. 재아님, 북극곰 입니다. 그거 아세요?
    재아님이 이렇게 자세하게 티에디션 꾸미기 글 올리셔서,
    저 그냥, 신청 안하려고요~ ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

    • 저는.../// 앞전에 첫화면꾸미기(티에디션)에서
      입상을 하여서 외장형 하드를 받았습니다.

      그것도 첫화면꾸미기 부분에서요 --

      이번꺼 역시 마찬가지의 과제인데 이번에는 도전하지 않을껍니다...// 그러니 마음것 도전하시길 바래요^^;

      사실 넷북이 탐나긴 하지만요;;

  11. ㅎㅎ아 벌레 ㅎㅎ;;
    반갑습니다 아주 요약을 쏘옥 끄집어내서 잘 정리 해 주셨네요^^

  12. 리뷰에서 엄청난 내공이 느껴지는데요 ^^;;
    (불끈~!) 저도 트랙백 보낸 산만한 리뷰도 수정하고
    티에디션도 좀더 꾸며서 재발행해봐야겠어요 !!!

  13. 와우 대단히 깔끔하고 디테일하게 정리 포스팅 하셨네요 정말 대단하십니다.ㅋㅋ^^

  14. 이야~~ 정말 정성스러운 포스팅이네요.
    자세하게 나와 있어 블로그 첫화면 꾸미시는 분들께 도움이 많이 될 거 같네요.
    잘 보고 갑니다. 즐거운 하루 되시구요. ^^

  15. 정성그런 포스팅이 넘 놀랐어요..

    제 블로그에도 적용을 했음에도 불구하고

    오류가 저만 발생하네요...ㅠ.ㅠ.

    티에디션에서 포스팅된 글에서 포스팅에 있는 이미지를 썸네일을
    해야하는데 엉뚱한 사진이 썸네일로 나오고, 이미 다른 곳에도
    발행이 되었던데요.. 이런 현상이 나올까요?

    • 다른글을 선택을 한번 해보시고

      제대로 표시가 되면 다시 한번 원래의 글을 선택하여 보시고요.... 아이테을 지웠다가.

      아이템을 다시 추가하여 다시 한번 해보세요!

    • 그렇게 해봤어요.. 그래도 동일한 증상입니다

      그래서 고객센터에 문의를 했는데요

      아직까지 무응답이랍니다.ㅎㅎ

      그냥 어쩔수없이 썸네일을 제가 직접 변경을 하는
      방법밖에 없는거 같아요...ㅠ.ㅠ.

    • 고객센터에서 답이 하루정도 걸리더군요!!;;

      아무튼 곧 수정되겠죠 머

  16. 저도 새로운 기능이라 좀 만져보긴했습니다만..
    왠지 지저분해보여서 포기^^;;
    재아님은 성공적으로 잘 꾸미셨군요!

    • 제가 워낙 다방면으로 글을 쓰다보니, 모하나 뺄께 없네요 ㅋ//

      다들 그러시겠지만요^^;
      아무튼 잘 활용하면 오히려 득이 될수도 있답니다..

  17. 엄마야~~ 저 버러지 잡으려고 몇 번 왔다갔다 했어요.
    ㅎㅎㅎ 바부탱이 경빈엄마 입니다.

    글을 나눠 올려주셨으면 촌닭 엄마 찬찬히 읽어봤을것을
    나름대로 정독하여 읽다가 너무 어려워 중간에 포기했어요.

    그런데 배워야 할게 너무 많아 답답한 엄마랍니다.

    • 하하하!! ^^;

      제 블로그에 처음 오면 대부분 그렇게 말씀하십니다.

      모니터 작살낼뻔 했다고 ㅋㅋ;///

      어렵게 생각하지 마시고 하나만 티에디션은 하나만 이해하면 나머진 ^^; 요령입니다~

      너무 어렵게 생각하지마시고 드리데세용

  18. 크~ 단순하게만 생각했었는데 오늘 많은걸 배우고 갑니다.
    첫페이지 뿐만 아니라 다른 글들도 틈나면 살펴볼게 많아서요~
    저도 맞구독~ 종종 들릴께요 ^^

  19. 아이콘 기능이 있군요... 이걸 잘 활용하면 각자 포스팅 주제에 맞춰 꾸밀수 있겠군요 ...

티스토리 툴바