[자바스크립트] 가운뎃점 폭 넓히기

  • 안양·여주·평택 / 홍천·정선 / 영덕·봉화 / 완주·부안·김제 / 함평·광양 / 거창·영천·함양
  • 국회의원 김갑돌·이을순, 시의원 박병조·신정화·차무열, 구의원 허기봉·우경석
  • 3·1 운동, 4·19 혁명, 8·15 광복절/정부수립일

  가운뎃점(·)은 빗금(/)과 함께 쉼표(,)를 도와 여러 항목들을 한눈에 알아보기 좋게 늘어놓을 때에 쓰인다. 한글맞춤법에도 올라 있는 긴요한 문장 부호이지만, 흔히 쓰이는 표준 두벌식 자판에는 가운뎃점이 들어 있지 않다. 표준 자판을 쓰는 많은 사람들은 가운뎃점을 바로 찾지 못하고, 문자표를 찾거나 윈도에서 'ㄱ + 한자 글쇠'를 눌러 찾아 넣는 방법을 자주 쓴다. 아니면 ᄒᆞᆫ글(아래아한글) 같은 문서 편집기를 통하여 넣기도 한다.주1 가운뎃점이 기본 배열에 들어 있는 세벌식 자판이 몇몇 있지만,주2 쓰는 이가 매우 드물어서 가운뎃점을 간단히 바로 넣는 사람은 보기 어렵다. 그래서 '서울·경기', '3·1 운동'이라고 적힌 글을 웹 문서로 옮기면 '서울, 경기', '서울/경기', '3.1 운동'처럼 가운뎃점이 다른 기호로 바뀌어 적힐 때가 많을 수밖에 없다.

  가운뎃점은 넣는 것뿐만 아니라 보여 주는 것에도 걸림돌이 있다. 그물누리(웹)에서 흔히 쓰이는 글꼴들이 한글보다 영문 환경에 더 맞추어진 가운뎃점(·, U+00B7)을 나타내기 때문이다. 1990년대부터 널리 쓰인 ᄒᆞᆫ글(아래아한글)은 아래 두째 그림의 HY중고딕(한양중고딕)처럼 가운뎃점을 전각 기호로 폭이 넓게 나타내는 글꼴이 많이 있었다. 하지만 요즈음에 쓰이는 굴림, 돋움, 맑은고딕, Arial, Sans-serif를 비롯한 여러 글꼴들의 가운뎃점은 거의가 반각보다도 좁은 반의반각(1/4각)으로 들어가 있다. 전각은 너무 크다고 보면 반각이 알맞지만, 반의반각에 희미하게 찍힌 가운뎃점은 얼핏 보면 찍혀 있는지도 모르고 지나치기 쉽다.

가변폭 글꼴들의 가운뎃점 (굴림, Sans-serif+굴림, 맑은고딕,나눔고딕,함초돋움,은돋움)
가변폭 글꼴들의 가운뎃점

  맑은고딕, 나눔고딕처럼 나온 지 얼마 되지 않은 글꼴들도 가운뎃점을 좁게 나타낸다. 가운뎃점이 좁고 희미게 찍히면 가운뎃점을 많이 쓴 문서를 읽기가 거북하겠지만, 가운뎃점이 드물게 쓰이기 때문인지 사람들의 관심이 미치지 못하는 것 같다. 임시 방안으로나마 그물누리에서 가운뎃점의 폭을 넓히는 방법을 몇 가지 생각해 보면 이렇다.

  첫째는 글꼴을 잘 골라 쓰는 것이다. '굴림체', '돋움체' 같은 고정폭 글꼴에 들어간 가운뎃점은 폭이 반각 기호 이상으로 크다. 그러나 고정폭 글꼴은 다른 기호들의 폭도 넓어서 다른 기호들이 어색하게 보이는 것이 흠이다. 글쓴이는 아직 가운뎃점의 폭도 알맞고 다른 기호들도 어색하지 않은 글꼴을 찾지 못했다.

굴림과 고정폭 글꼴들의 가운뎃점 (굴림체, Lucida Sans Unicode+굴림, Consolas+굴림, 나눔고딕코딩, HY중고딕)
굴림과 고정폭 글꼴들의 가운뎃점

  두째는 비슷하게 생긴 다른 기호를 가운뎃점으로 쓰는 것이다. 우리가 흔히 쓰는 가운뎃점 말고도 ‧(U+2027, hyphenation point), •(U+2022, bullet), ⋅(U+22C5, dot operator)처럼 비슷하게 생긴 기호들이 더 있다. 일본어에서 쓰이는 가운뎃점(・, U+30FB)도 있고, 국회 회의록을 비롯한 국내의 적지 않은 출판물들은 한글 낱자인 아래아(ㆍ,U+119E)를 폭이 넓은 가운뎃점으로 쓰기도 한다. 하지만 이들 다른 기호들도 글꼴에 따라 나타나는 폭과 점의 두께가 다르고, 글꼴에 따라서 나타내지 못하는 기호도 있을 수 있다. 아래아(ㆍ)와 가운뎃점(·)을 함께 써야 할 때를 만나는 것처럼 문자의 쓰임새가 겹칠 때가 생길 수 있으므로, 비슷하게 생겼다고 하여 아무 기호나 문장 부호로 갈음하여 쓰는 것은 바람직하지 않다.주3

  세째는 자바스크립트로 가운뎃점만 다른 글꼴로 나타내는 방안이다. 자바스크립트를 쓰면 글을 손대지 않고 다른 기호의 글꼴을 바꾸지 않으면서 가운뎃점만을 바라는 글꼴로 나타낼 수 있다.

  HTML 문서에 아래와 같은 div 객체가 있다고 하자.

<div id="post">
<p>감·오이·복숭아, 충남/충북·대전/세종, 3·1 운동, 4·19 혁명</p>
<p>1·2·3·4·5·6·7·8·9·0 / a·f·g·i·j / A·F·G·I·J / >
</div>

  아래 자바스크립트를 HTML 문서에 끼워 넣으면 div 객체 안의 가운뎃점이 font-family로 지정한 글꼴로 나타난다.

<script type="text/javascript"><!--
var post_div = document.getElementById('post');
if(post_div) {
if(post_div.innerHTML.indexOf('·')>=0) post_div.innerHTML = post_div.innerHTML.replace(/·/g, '<span style="font-family:\\'Lucida Sans Unicode\\', 나눔고딕코딩, \\'Nanum Gothic Coding\\', 굴림체, GulimChe">·</span>');
}
//-->
</script>

  위에 들어간 고정폭 글꼴 Lucida Sans Unicode, Consolas, 나눔고딕코딩, 굴림체 말고도 찾아 보면 더 나은 글꼴이 있을 것이다. 왼쪽에 들어간 글꼴이 먼저 적용되지만, 글꼴이 깔려 있지 않을 때를 생각하여 여러 개 적어 준다. 거꿀빗금(\)이나 말줄임표(…)주4 같은 다른 기호를 특정 글꼴로 나타내게 하는 데에도 이와 같은 방법을 쓸 수 있다.주5

굴림 글꼴에서 가운뎃점만 Lucida Snas Unicode로 바꾼 글꼴 모습
굴림 글꼴에서 가운뎃점만 Lucida Snas Unicode로 바꾼 글꼴 모습

  더 요령을 부려 <span> 태그에 class 속성을 넣고 글꼴 속성(font-family)을 CSS에서 지정할 수도 있다.


<head>
<style type="text/css"><!--
.post span.middledot {
font-family:'Lucida Sans Unicode', Consolas, 나눔고딕코딩, 'Nanum Gothic Coding', 굴림체, GulimChe;
}
//-->
</style>
</head>

<script type="text/javascript"><!--
var post_div = document.getElementById('post');
if(post_div) {
if(post_div.innerHTML.indexOf('·')>=0) post_div.innerHTML = post_div.innerHTML.replace(/·/g, "<span class='middledot'>·</span>");
}
//-->
</script>

  다른 자바스크립트와 부딛어 잘못 작동한다면, 위 <script> ~ </script> 사이에 들어간 자바스크립트와 다른 자바스크립트의 위·아래 자리를 바꾸어 본다.주6

  자바스크립트를 쓰는 방법은 아래아(ㆍ, U+119E)나 다른 기호를 가운뎃점으로 쓰는 잘못을 막기 위한 임시 방안이다. 가운뎃점으로 쓰는 기호(·, U+00B7)가 좁고 희미한 것은 한국에서 쓰는 글꼴에서 고칠 점이다. 유럽이나 다른 문화권에서 쓰는 폭 좁은 가운뎃점과 가려 써야 한다면, 한글 문화권에서 쓰는 가운뎃점을 따로 더 두는 쪽으로 표준 부호 체계와 글꼴이 바뀌어 위와 같이 임시 변통하는 방법이 필요 없게 되기를 바란다.

〈주석〉
  1. ᄒᆞᆫ글(아래아한글)은 두벌식 자판의 `(grave accent) 자리에 가운뎃점이 들어가 있고, 가운뎃점을 비롯한 특수기호들을 넣은 자판 배열을 따로 두고 있다. back
  2. 3-91 자판, 3-2011 자판, 신세벌식 2003/2012 자판에 가운뎃점이 들어가 있는데, 이들은 공병우 세벌식 자판 가운데 문장용 배열로 분류되거나 문장용 배열의 영향을 받은 배열들이다. 기본 배열에 가운뎃점이 없는 공병우 세벌식 자판은 확장 배열을 두어 가운뎃점을 넣을 수도 있다. (http://pat.im/896) back
  3. 종이에 찍히고 끝나는 인쇄물과 달리, 전산 기록으로 남는 문서는 문자 부호값이 남는다. 한글 ㅌ과 로마자 E를 모습이 비슷하다고 하여 같은 부호값으로 쓸 수 없는 것처럼, 아래아(ㆍ)와 가운뎃점(·)도 부호값을 달리하여 적어야 맞다. 한글 낱자인 아래아를 문장 부호로 쓰는 것은 관행으로는 굳어서는 아니될 임시 방편이다. back
  4. 많은 한글 글꼴들과 표준 자판이 거꿀빗금을 원화 기호(₩)로 나타내지만, 실제로는 거꿀빗금의 부호값이 들어간다. 한국에서 말줄임표는 가운뎃점(·)을 여러 개 찍은 꼴로 나타내지만, 많은 영문 글꼴에는 마침표(.)를 여럿 찍은 꼴로 들어가 있다. back
  5. 거꿀빗금은 자바스크립트에서 쓰는 기호이므로, replace 함수에 더 정교한 정규식을 넣어야 거꿀빗금을 탈 없이 바꾸어 보여 줄 있다. back
  6. 글쓴이가 만든 'More/Less 객체를 서서히 펼치고 접기'라는 텍스트큐브 플러그인이 가운뎃점의 폭을 넓히는 자바스크립트와 부딛쳐 그릇된 작동을 할 수 있다. 이 플러그인에서 덧붙이는 자바스크립트가 맨 아래쪽에 오게 하면, 두 자바스크립트가 서로 부딛히는 문제를 풀 수 있다. back
글 걸기 주소 : 이 글에는 글을 걸 수 없습니다.

덧글을 달아 주세요