한글의 웹 글꼴 단위 및 크기 비교 : Comparing Korean Fonts sizes/units
HTML에서의 한글 글꼴의 단위와 크기 비교표를 만들어 보았습니다.
갑자기 Hooney님께서 한글 글꼴 크기에 대한 질문을 하셔서, 기존에 만들어둔 html 파일을 드렸지만 워낙 오래전에 만들어 둔데다가 em이나 %는 넣지도 않고, pt와 px만을 비교해 놓은 문서라서 마침 시간도 있고 해서 다시 정리를 해보았습니다.
크기만을 비교한 Approximate Conversion from Points to Pixels (via REEDDESIGN)를 참조하여 스크립트도 넣었어요;
크기 테이블 하단의 것은 윈도우windows와 매킨토시macintosh에서 글꼴군에 대한 예시표입니다.
예전 파일에 같이 있길래 함께 넣어뒀습니다. 하나의 OS만 사용해본 사람이라면 참고 할 만하지 않을까 합니다.
한글의 크기를 비교해보니 위에 참조한 표와는 달리 몇 몇 크기에서 서로 크기가 달랐고, 브라우저 종류에 따라서도 크기가 달라지는 것을 볼 수 있었습니다.
일부 수정을 하긴 했지만 완벽하지 않아서, 시간을 들여 각 브라우저에 따라서 수정을 더 해야할 것 같습니다.
pt와 px만 써보신 분들 이라면 해당 페이지에서 ctrl+휠스크롤 혹은 ctrl+(+), ctrl+(-)를 마구 연타해보도록 해BoA요.
사용자가 원하는 대로 글자 크기가 마구마구 커졌다 줄어들었다 하는 것을 알 수 있습니다.
(혹시나 주체할 수 없이 크기가 작아졌거나 커졌다면 살포시 ctrl+0(숫자0)을 눌러주는 센스.)
글씨가 마구 커지면 테이블이 깨진다고 싫어하는 사람도 있겠지만, 1px의 치밀함 보다는 사용자의 편의를 생각하는 것이 더 인간적이지 않을까하는 생각입니다.
물론 레이아웃도 유동적으로 제작한다면 폰트 크기에 따라 유동적으로 레이아웃이 변하게 됩니다.
(eg. yahoo.com)
June 2nd, 2005 at 7:30 pm
ㅎㅎ 감사합니다. 지금은 빈강시간이라 이렇게 글을 남길 수 있네요. 퇴근하면 관련글을 한번 적어보렵니다.
June 2nd, 2005 at 11:30 pm
흠… 맥에서 저 html파일을 보니까 역시 한글부분이 깨지네요..
이 블로그와 똑같이 UTF-8으로 했는데 왜 그럴까~ 신기~~!
이것저것 고쳐봤는데 안되어서.. 속편하게 euc-kr 로 바꿔놓았습니다.T^T
June 6th, 2005 at 6:42 am
ㅎㅎ UTF-8 VS EUC-KR 붙어 보아요
June 14th, 2005 at 2:00 pm
후후..유니코드 편집기로 손보니 제대로 나옵니다!!!단지 파일 자체의 인코딩 문제였음
September 12th, 2005 at 11:28 pm
폰트에 관한 포스트에 kukie님의 ‘한글의 웹글꼴 크기 비교’ 링크 걸어 놓았습니다. 좋은 자료 감사합니다^^ 트랙백 걸어도 되죠?
September 12th, 2005 at 11:31 pm
한글이 깨지는군요;; 위에 삭제하셔도 됩니다T^T 이거 이래저래 폐만 끼치네요; 죄송합니다;;
September 12th, 2005 at 11:39 pm
같은 wp에서 쏜건데 왜 깨지죠 @.,@ ㅎㅎ
September 12th, 2005 at 11:53 pm
하핫; 저 테터툴즈 랍니다^^;
스킨을 wp랑 비슷하게 꾸몄는데 성공했군요 +_+
September 13th, 2005 at 12:04 am
아.. 윗부분만 봤거든요 ㅎㅎ
어쩐지~~~~ㅎㅎ
November 2nd, 2006 at 4:16 pm
[...] 한글의 웹글꼴 크기 비교 이런 포스트를 했었는데, 저기 있는 em·%는 모두 브라우저의 기본 글꼴을 기준으로 em·% 처리가 된 크기입니다. 1em은 100%와 동일하고, 1em 이라는것은 브라우저의 기본글꼴의 100%크기 라는 뜻입니다. 브라우저의 기본글꼴 크기(1em·100%)를 기준으로 우리가 보통 사용하는 9pt·12px의 글꼴은 0.75em·75% 크기가 됩니다. 그리고 브라우저의 기본 글꼴 크기 (1em·100%)는 절대값으로 환산할 경우는 12pt·16px 크기 입니다. [...]
September 28th, 2007 at 1:56 pm
[...] 전에 썼던 한글의 웹 글꼴 단위 및 크기 비교의 표가 이제 많이 낙후 된 것 같아 기존 페이지를 업데이트 할까 하다가, [...]