다음블로거뉴스블로그코리아 등을 통해 블로그로 들어가다보면 원래 이렇게 설정한게 아닐텐데 글씨의 크기가 굉장히 크게 나오는 경우를 볼 수 있습니다. 그렇게 되면 이미지와의 배치도 맞지않게 되고, 억지로 보이는 Text의 크기를 조절해도 라인이 변경되지 않아서 깨끗한 정렬이 되지 않습니다.

이런 블로그 대부분은 스킨의 스타일시트에 Text의 크기(font-size)를 pt 단위로 정의하지 않고, small이나 -1 또는 1.5 와 같이 상대적인 size로 설정했기 때문입니다. 티스토리의 경우, 제가 사용하는 것과 같이 심플한 구형 스킨이나 이 스킨을 바탕으로 제작한 스킨들에서 많이 나타나는 현상입니다.




원래 위와 같이 보여야 하는데 블로그코리아나 블로거뉴스를 통해 들어오면 아래와 같이 글씨의 크기가 변경되어 의도한 대로 보이지 않게됩니다.


스킨의 스타일시트에서 텍스트의 크기를 고정해두지 않으면 메타블로그에서 새창을 열때 기준한 해상도와 텍스트의 설정기준에 의해서 내 블로그의 Text-size는 수시로 변경되므로 가능하면 스킨파일을 아래와 같이 수정해 주는것이 좋습니다.

티스토리 --> 관리자 --> 스킨 --> HTML/CSS 편집 --> style.css

변경전 : body{ font: small/1.5 verdana;
변경후 : body{ font-family:돋움,굴림,verdana,Arial; font-size:10pt;

글꼴(Font)
우선적인 순서로 여러개 지정하면 되고, 크기(font-size)는 9~12 pt 사이가 보기에 가장 적절합니다. 그리 복잡하지 않으나 혹시 찾기 어렵다면 아래 그림을 참고하시면 됩니다.



대부분 스킨에서 윗쪽에 위치해 있으며 Body{ 로 시작되는 부분입니다.


스킨위자드에서는 게시글의 글꼴과 크기를 변경하면 해상도에 따라서 아래와 같이 엉뚱한 결과가 나올 수도 있으므로 위의 방법으로 수정해서 크기를 고정하는 것이 가장 좋은 듯합니다.



스킨위자드에서 Text의 크기를 10px로 변경하면 아래와 같이 본문은 특정해상도를 기준으로 고정되어 메타블로그를 통한 유입시 글씨가 깨알같이 작아집니다.


블로그가 좋은 정보를 담는것도 중요하지만 방문자를 위한 적절한 배려도 필요하다고 생각합니다.
HTML에 대한 어설픔으로 설명이 틀린 부분이 있을 수도 있으나 변경부분은 믿고하셔도 됩니다.


Posted by 외계인 마틴
무단전재 및 재배포금지 : 모든 포스트는 저자가 별도로 허용한 경우 외에는 무단전재 및 재배포를 허용하지 않으며, 복제시 저작권법 위반으로 처벌받을 수 있습니다.
태그 , , , , , , , ,
    이전 댓글 더보기
  1. 2008.02.21 02:54 신고
    댓글 주소 수정/삭제 댓글
    이런 경우가 있군요...^^
    저도 이런 경우는 없었던거 같아 잘 몰랐네요..^^

    항상 마틴님 블로그에는 좋은 정보가 너무 가득한거 같아요..^^
    • 2008.02.22 01:49 신고
      댓글 주소 수정/삭제
      스킨마다 기본 설정이 다른것 같더군요.
      저처럼 구형스킨에 잘 나타나는 증상같습니다.
  2. 2008.02.21 04:39 신고
    댓글 주소 수정/삭제 댓글
    역시나 마틴님 포스트는 어쩐지 무서워 ㅜㅜ
    와서 볼 때 마다, 기사가 하나씩 있어서 깜딱 깜딱 놀랜다니깐요 ~_~;;;
    • 2008.02.22 01:50 신고
      댓글 주소 수정/삭제
      컥... 무서울 필요는 없습니다 ^^
      하루 1~2개 겨우 올리는데요 뭘...
      댓글 감사합니다 ^^;
  3. 2008.02.21 06:30 신고
    댓글 주소 수정/삭제 댓글
    좋은 정보 감사합니다.
    근데 저는 글씨는 별 문제 없는데
    메타블로그에 발행시 이미지가 나오지 않는 경우가 많던데..ㅠ
    • 2008.02.22 01:51 신고
      댓글 주소 수정/삭제
      이미지가 나오지 않는 경우는 특이하네요.
      혹시 목록에 나오는 이미지한개를 말씀하는 거라면
      글쓸때 최초로 업로드한 이미지를 변경하지 않으면 나타납니다.
  4. 2008.02.21 07:53 신고
    댓글 주소 수정/삭제 댓글
    저도 pt와 px가 다르다는 것을 최근에 알았습니다.ㅎㅎ;
    • 2008.02.22 01:52 신고
      댓글 주소 수정/삭제
      저는 html까지는 자신이 있었는데
      2.0 환경에는 아직 적응이 안되는 편입니다 ^^
  5. 2008.02.21 09:20 신고
    댓글 주소 수정/삭제 댓글
    음 그렇게 하여도 되고요, 만약 외부 프레임으로 불려져서 내 페이지가 내가 원하는 대로 안 나올때는, 내 CSS에 강조와 순서를 정해주면 됩니다.

    단지 바뀌기 싫은 부분에 !important라는 CSS 강조어를 넣어주면 됩니다.

    예를 들어서
    #META-MAN{
    font: 12px verdana !important;
    font: 10px verdana;
    }

    위의 경우 보통 CSS는 맨 마지막것을 기준으로 돌아가게 되는데, 예문처럼 !important로 중요도를 설정해주면, 밑의 폰트 사이즈 10px로 지정하라는 명령어 대신 중요도가 정해진 12px로 브라우져가 해석하기 시작합니다.

    설명이 좀 이상한거 같은데, 암튼 !important를 사용하면 혹시나 있을지 모를 다른이의 CSS로 제 CSS가 망가지는 경우가 덜 하겠죠, 그런데 다른이가 또 !important설정을 한다면 대략 난감.....
    • 2008.02.22 01:54 신고
      댓글 주소 수정/삭제
      메소드(?)의 이름을 마음대로 지정할수 있는건가요?
      일단 저도 테스트를 해봐야겠네요
      역시 메타맨님은 모르는게 없으시네요
      도움 감사합니다 ^^
  6. 2008.02.21 09:42 신고
    댓글 주소 수정/삭제 댓글
    아~ 해야할일이 많군요~ ㅎ
    • 2008.02.22 01:54 신고
      댓글 주소 수정/삭제
      버그니님의 솜씨라면 저처럼하지 않아도 멋진 방법을 아실듯 합니다.
      다음에 도움부탁드립니다.
  7. 2008.02.21 09:52
    댓글 주소 수정/삭제 댓글
    구독자의 입장에서 IE의 설정을
    보기-택스트크기-보통
    으로 수정해도 되던데..
    관련있는건가요?
    • 2008.02.22 01:56 신고
      댓글 주소 수정/삭제
      그렇게 하면 몇가지 문제가 발생하더군요.
      이렇게 글자가 크게나오는 페이지를 정상정으로 조절하면
      다른페이지의 글자가 조그맣게 되어버립니다.
      그래서 이렇게 조절해주는게 편리할듯 합니다만..
      저도 잘 모르겠네요 ^^
  8. 2008.02.21 10:26 신고
    댓글 주소 수정/삭제 댓글
    어떤 블로그는 스크롤을 내리면 글씨가 막 번져버리기도 하더군요.
    알면 알수록 모르는 것 투성이인 블로그 세상...ㅎ
    • 2008.02.22 01:57 신고
      댓글 주소 수정/삭제
      아..저도 그런 곳을 가끔 봅니다.
      글씨가 서로 중첩되고 번져서 알아보지도 못하는 곳이 있더군요.
      역시 알수없는 블로그 세계입니다 ^^
  9. 2008.02.21 11:02 신고
    댓글 주소 수정/삭제 댓글
    이렇게 글자크기 지정할 경우, 눈이 나빠서 택스트크기->큰글씨로 설정해놓고 보는 사람은 보기가 힘들게 됩니다. 그래서 웹표준에서 글씨크기를 지정하지 말고 1.5em 같은 식으로 지정하라고 한다고 들었는데, 그게 이런 문제를 발생시켰다면, 잘못은 메타블로그 쪽에서 한 것 같네요.
    좋은글 잘 보고 갑니다. ^^
    • 2008.02.22 01:58 신고
      댓글 주소 수정/삭제
      아.. 원래의 스킨이 웹표준에 따른 설정이군요.
      다음블로거뉴스에서 특히 이런증상이 심하던데
      블로거뉴스가 고쳐지지 않는한 표준에 따르기에는 불편하겠네요.
      좋은 말씀 감사합니다.^^
  10. 2008.02.21 12:29 신고
    댓글 주소 수정/삭제 댓글
    메타로 들어오면 오류도자주나고
    버벅대기도 하는것같아요.
    이런부분 긁어주시니 시원합니다^^
    • 2008.02.22 01:59 신고
      댓글 주소 수정/삭제
      흐흐 브리드님이 간지럽다면 긁어 드려야죠 ^^
      아.. 요즘 새벽에 잠깐 들어오게 되네요.
  11. 2008.02.21 13:01 신고
    댓글 주소 수정/삭제 댓글
    그런데 피시방 와 보디 와이드 화면에서 좌측으로 쏠려있네요.
    님도 그러시고 저도 그런데요 ..
    이런것은 어떻게 수정하나요?
    • 2008.02.22 02:01 신고
      댓글 주소 수정/삭제
      고해상도에서 화면의 가운데로 보이게하려면
      스킨 상단에 정렬을 지정해야할 것같은데요.
  12. 2008.02.21 13:26
    댓글 주소 수정/삭제 댓글
    비밀댓글입니다
    • 2008.02.22 02:07 신고
      댓글 주소 수정/삭제
      정상적으로 나오는걸 방금 확인했습니다 ^^
      아마 다른 컴에서 그렇게 나오는건 웹설정에서 폰트크기를 조절해서 그런게 아닐까요?
  13. 2008.02.21 15:53 신고
    댓글 주소 수정/삭제 댓글
    저도 그런경우 있었는데~*^_^*
    마틴님 너무너무 좋은 정보 알려주셔서
    감사합니당!
    좋은하루 되셔용~^^
    • 2008.02.22 02:08 신고
      댓글 주소 수정/삭제
      긍정님 안녕하세요.
      지금은 그런일이 없나보군요. 그렇다면 다행입니다.
      ^^ 즐거운 하루 시작하세요.
  14. 2008.02.21 16:36 신고
    댓글 주소 수정/삭제 댓글
    음.. 확실히 주인 입장에서는 의도한 대로 보이는 게 가장 좋겠죠.
    그런데 한편으로는 위에 지민아빠님 말씀처럼 글씨 크기를 조절해서 보고 싶어하는 분들에게는 문제이기도 하네요 ^^; 메타블로그 쪽에서 신경을 좀 써줘야 할 듯해요.
    • 2008.02.22 02:09 신고
      댓글 주소 수정/삭제
      예 그러게요.
      일단 다음에 글시크기를 조절하는 스크립트라도 넣어야 겠네요.
      아무래도 9~10pt라면 눈아파하는 분도 있을겁니다.
  15. 2008.02.21 21:23
    댓글 주소 수정/삭제 댓글
    좋은 팁이네요..

    전 그대로일거에요 아마 -_- ㅋㅋ
    • 2008.02.22 02:12 신고
      댓글 주소 수정/삭제
      이런 증상이 일어나는 분이 그리 많지는 않더군요.^^
      아마 nob님을 비롯한 대부분의 블로그는 이상 없을듯 합니다.
  16. 2008.02.21 22:18 신고
    댓글 주소 수정/삭제 댓글
    전 주로 px로 설정하고 있는데..;
    메타블로그에서 들어올때 크게 보이는 경우도 있군요.
    그나저네 제 블로그는 그대로 보이는 것 같아요..헤헤~
    • 2008.02.22 02:13 신고
      댓글 주소 수정/삭제
      그렇다면 다행입니다 ^^
      저처럼 문제가 있음에도 귀찮아서 미루는 분들도 꽤 있는듯 합니다..
  17. 2008.02.21 23:15 신고
    댓글 주소 수정/삭제 댓글
    오홋...유용한 팁이네요..^^ 전 글씨가 좀 작은듯 해서 키우고 싶었는데..도움이 될듯 합니다.
    • 2008.02.22 02:16 신고
      댓글 주소 수정/삭제
      달룡님도 9pt정도 되시는것 같더군요.
      그리고 다음블로거뉴스에서도 정상으로 잘보이고요.
      모두가 만족하는 환경이란 없는가 봅니다 ^^
  18. 2008.02.22 22:17
    댓글 주소 수정/삭제 댓글
    헐 왜 이좋은 정보를 놓치고 있었을 까요.. 저번에 프레스블로그에 그런현상이 있었습니다..^^;
    • 2008.02.23 22:27 신고
      댓글 주소 수정/삭제
      의외로 이런 사실을 모르는 분들도 많더군요.
      물론 이 방법이 최선은 아니지만.. 불편한 경우에는 도움이 될 것같습니다 ^^
  19. 2008.02.24 06:13 신고
    댓글 주소 수정/삭제 댓글
    으악.. 이런 당연한 걸 왜 미처 생각을 못했을 까요.ㅠㅠ
    전 항상 제 블로그 글자체가 맘에 안들어서 verdana로 수정했는데..
    스타일 css에서 수정하면 될 것을...... 바보바보..ㅠㅠ
    • 2008.02.25 01:14 신고
      댓글 주소 수정/삭제
      앗... 블로그계의 초고수이신 파란토마토님께서도 실수가 있나보군요 ^^
  20. 2008.02.25 01:43 신고
    댓글 주소 수정/삭제 댓글
    저 고수 아니에요;; 웹맹에 가까워요.ㅋ
    어쨋든 이 글 보고 css에서 글자체 verdana로 수정했어요.
    본문은 그전부터 애써 수정해서 쓰는 중이었는데..
    이젠 그럴 필요가 없어졌네요.. :)
    • 2008.02.25 17:29 신고
      댓글 주소 수정/삭제
      파란토마토님이 웹맹에 가깝다니 매치가 안됩니다 ^^
      이런 사소한 부분에라도 도움이 되었다니 기쁘네요.


free counters
BLOG main image
樂,茶,Karma by 외계인 마틴

카테고리

전체 분류 (386)
비과학 상식 (162)
블로그 단상 (90)
이런저런 글 (69)
미디어 잡담 (26)
茶와 카르마 (39)
이어쓰는 글 (0)



 website stats



Total : 3,371,439
Today : 28 Yesterday : 62