나무모에 미러 (일반/어두운 화면)
최근 수정 시각 : 2023-12-30 18:56:10

양쪽 맞추기

양쪽 정렬에서 넘어옴

1. 개요2. 간격 조절3. 구현하기
3.1. 워드프로세서3.2. HTML3.3. 그래픽

1. 개요

텍스트 정렬 방식 중 하나로, 텍스트의 양쪽 끝을 전부 가지런히 맞추는 방법이다.

어느 쪽으로 정렬을 할 것인지 정해주지 않으면 일반적인 왼쪽 맞추기로 되는데 이 경우 오른쪽 끝이 맞춰지지 않고, 반대로 오른쪽 맞추기는 왼쪽 끝이 맞춰지지 않는다. 하지만, 양쪽 맞추기를 하면 왼쪽 끝과 오른쪽 끝이 전부 가지런히 맞춰진다. 일반 종이을 꺼내서 글의 왼쪽 끝과 오른쪽 끝을 잘 보자. 문단 첫 부분이 한 글자 띄어진 것을 제외하면 모두 가지런히 맞춰져 있을 것이다. 이게 별 거 아닌 것 같아 보여도, 실제로 이걸 적용하면 보다 깔끔하고 좀 더 가독성을 높여주기 때문이다.

반대로, 이걸 적용하지 않은 상태를 래그드(ragged)라고 부른다. 래그드 상태에서는 타자기로 글을 쓴 것처럼 오른쪽 끝이 들쭉날쭉하게 된다. 래그드(ragged)라는 단어는 '누더기가 된'이라는 뜻의 형용사로, 이쪽 용어로는 글의 오른쪽 끝이 누더기처럼 너덜너덜하게 됐다는 뜻이다. 일반 인터넷 웹 사이트에서도 이걸 적용하지 않아서 오른쪽 끝이 전부 들쭉날쭉한 것을 볼 수 있다.

언제부터인가 나무위키에서도 양쪽 정렬이 지원되지 않는다. 따라서 아래는 원래 왼쪽 정렬과 양쪽 정렬의 비교였으나 지금은 아무런 차이가 없는 것을 알 수 있다.

아래는 양쪽 맞추기가 적용되지 않은 '래그드' 상태의 예문이다.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
여기가 어디요? / 아, 병원이오. 안심하세요. 지혈제를 썼고 응급수술을 했어요. 피를 너무 많이 흘려서 하마터면 큰일날 뻔했습니다. / 아래쪽에 감각이 전혀 없으니, 어떻게 된 거요? / 아, 하필이면……. 총알이 영 좋지 않은 곳에 맞았어요. / 그건 무슨 소리요? / 에……. 어느정도 완쾌된 뒤에 말해 주려고 했는데, 잘 알아 두세요. 선생은 앞으로 아이를 가질수가 없습니다. 에, 다시 말해서, 성 관계를 할수가 없다는 것이오. 에……, 총알이 가장 중요한 곳을 지나갔다 이 말입니다. / 뭐요? 이보시오, 이보시오! 의사양반! 아이유우~! / 안정을 취하세요. 흥분하면 다시 출혈을 할 수가 있어요. 그렇게 되면 걷잡지 못합니다.
이 예문에 양쪽 맞추기를 적용하면 다음과 같다. (적용 불가)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
여기가 어디요? / 아, 병원이오. 안심하세요. 지혈제를 썼고 응급수술을 했어요. 피를 너무 많이 흘려서 하마터면 큰일날 뻔했습니다. / 아래쪽에 감각이 전혀 없으니, 어떻게 된 거요? / 아, 하필이면……. 총알이 영 좋지 않은 곳에 맞았어요. / 그건 무슨 소리요? / 에……. 어느정도 완쾌된 뒤에 말해 주려고 했는데, 잘 알아 두세요. 선생은 앞으로 아이를 가질수가 없습니다. 에, 다시 말해서, 성 관계를 할수가 없다는 것이오. 에……, 총알이 가장 중요한 곳을 지나갔다 이 말입니다. / 뭐요? 이보시오, 이보시오! 의사양반! 아이유우~! / 안정을 취하세요. 흥분하면 다시 출혈을 할 수가 있어요. 그렇게 되면 걷잡지 못합니다.
한국어 예문이 좀 신경쓰이지만 넘어가자.

양쪽 정렬은 제책에서도 매우 중요한 역할을 한다. 책을 보다보면 줄이 바뀌면서 단어가 잘리는 경우가 많은데, 양쪽 정렬은 이러한 상황을 최대한 방지해준다. 양쪽 정렬을 사용해도 단어가 잘리는 경우 한국어는 쿨하게 씹지만(...). 영어는 하이픈을 넣어서 이것을 한 단어라고 지시해준다. 한국어는 단어가 잘려도 독해하는 데에 큰 무리는 없지만, 그래도 책을 인쇄할 때는 양쪽 정렬을 사용하는 것이 보통이다.

참고로, 영어권에서는 그다지 좋아하지 않는 정렬 방식이다. 그 까닭은 단어 간격이 지나치게 넓어질 수 있기 때문이다. 한글 문서는 한 단어 범위 내라도 음절 단위로 줄바꿈이 되어도 독해에 지장이 없으나 로마자 문서는 그렇지 않은 까닭이다. 물론, 앞서 설명한 바와 같이 하이픈을 넣어 줄바꿈을 하는 사례도 있으나, 이 방식이 보편적인 것은 아니고, 무엇보다도 로마자를 쓰는 언어 중에서도 특히 영어는 전체적인 음운 구성을 봐야 제대로 발음을 알 수 있기 때문에 단어 범위 안에서 줄이 바뀌면 가독성이 심각하게 떨어진다. 이 때문에 영어권에서는 타이핑을 할 때 왼쪽 정렬(left aligned)을 하라고 가르치는 편이다. 실제로 미국 등 영미권에서 출간한 서적, 논문 등을 보면 대부분 왼쪽 정렬이 되어 있다는 것을 알 수 있다. 양쪽 정렬을 기본으로 하는 국내 출판물과 대비되는 점이다.

2. 간격 조절

물론 이걸 적용하면 공백의 폭을 필연적으로 조절해야 하기 때문에, 각 줄마다 공백의 폭에서 차이가 난다. 보통의 경우는 미세한 차이가 나지만, 금칙 처리에 의해 첫 행에 올 수 없는 문장부호를 넘겨야 할 경우 바로 앞의 글자도 같이 넘기기 때문에 공백의 폭이 좀 더 넓어진다. 다만, 공백의 폭을 좁히는 방법으로 문장부호를 그냥 안 넘길 수도 있으며, 한 줄의 폭이 웬만큼 넓으면 공백의 폭을 넓혀도 별로 표가 안 나기 때문에 이 문제는 괜찮다. 또한, 단어를 잘라서 개행할 수 있는 한글 단어와는 달리 단어 단위 개행이 기본인 영단어가 걸리는 경우는 그 단어 자체를 통째로 넘기기 때문에 폭이 엄청나게 넓어진다. 특히, 웹 사이트 주소 등이 들어가는 경우는 중간에 끊을 수 없기 때문에 그걸 통째로 넘겨버려서 단어들이 이루는 폭보다 공백의 폭이 더 넓은 현상까지 나타난다. 이는 단어 중간의 적절한 위치에 하이픈(-)을 넣어서 끊는 방법으로 해결할 수 있으나, 이 방법을 쓰면 안 될 경우(웹 사이트 주소 등)는 그냥 그대로 둘 수밖에 없다. 참고로 웹 페이지에서 적절한 위치에 자동으로 하이픈이 삽입되게 하는 문자로 Soft Hyphen이 있다. 당연히 웹 페이지를 읽는 환경(기기 종류, 해상도, 브라우저 글꼴 크기 등)마다 줄바꿈이 될 위치가 모두 같을 수는 없으므로 이 처리를 하면 줄바꿈을 하는 자리에만 나타나고 그 외의 자리에서는 숨겨지는 원리이다. 아래에서 예시 1은 그냥 긴 단어와 웹 사이트 주소를 늘어놓았을 때, 예시 2는 긴 단어에 SHY를 적용했을 때의 예이다.
기본적으로 띄어쓰기가 없는 일본어중국어 등에서는 공백의 폭이 아닌 자간을 조절하는 방법으로 양쪽 맞추기를 한다.

3. 구현하기

3.1. 워드프로세서

아래아 한글같은 워드프로세서에서도 당연히 이 기능을 사용하여 양쪽 맞추기가 적용된 글을 쓸 수 있다.

3.2. HTML

CSS를 이용하여 HTML에도 이걸 적용할 수 있다. 그냥 간단하게, text-align 속성을 justify로 맞춰 주면( text-align: justify; ) 된다. 한글로 된 문서에 양쪽 정렬을 하려면 CSS3에서 새로 추가된 word-break: normal; 속성값을 함께 추가해 주면 된다. 다만, word-break 속성의 기본값이 normal이므로 다른 word-break 속성이 지정되어 있는 경우가 아니라면 굳이 추가할 필요는 없다.
예시 1-A: (word-break: normal; - 라틴 문자 단어는 자르지 않는다.)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
예시 1-B (word-break: break-all; - 라틴 문자 단어도 자른다.)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
예시 2-A (word-break: normal; - 한글 단어는 자른다.)
여기가 어디요? / 아, 병원이오. 안심하세요. 지혈제를 썼고 응급수술을 했어요. 피를 너무 많이 흘려서 하마터면 큰일날 뻔했습니다. / 아래쪽에 감각이 전혀 없으니, 어떻게 된 거요? / 아, 하필이면……. 총알이 영 좋지 않은 곳에 맞았어요. / 그건 무슨 소리요? / 에……. 어느정도 완쾌된 뒤에 말해 주려고 했는데, 잘 알아 두세요. 선생은 앞으로 아이를 가질수가 없습니다. 에, 다시 말해서, 성 관계를 할수가 없다는 것이오. 에……, 총알이 가장 중요한 곳을 지나갔다 이 말입니다. / 뭐요? 이보시오, 이보시오! 의사양반! 아이유우~! / 안정을 취하세요. 흥분하면 다시 출혈을 할 수가 있어요. 그렇게 되면 걷잡지 못합니다.
예시 2-B (word-break: keep-all; - 한글 단어도 자르지 않는다.)
여기가 어디요? / 아, 병원이오. 안심하세요. 지혈제를 썼고 응급수술을 했어요. 피를 너무 많이 흘려서 하마터면 큰일날 뻔했습니다. / 아래쪽에 감각이 전혀 없으니, 어떻게 된 거요? / 아, 하필이면……. 총알이 영 좋지 않은 곳에 맞았어요. / 그건 무슨 소리요? / 에……. 어느정도 완쾌된 뒤에 말해 주려고 했는데, 잘 알아 두세요. 선생은 앞으로 아이를 가질수가 없습니다. 에, 다시 말해서, 성 관계를 할수가 없다는 것이오. 에……, 총알이 가장 중요한 곳을 지나갔다 이 말입니다. / 뭐요? 이보시오, 이보시오! 의사양반! 아이유우~! / 안정을 취하세요. 흥분하면 다시 출혈을 할 수가 있어요. 그렇게 되면 걷잡지 못합니다.

3.3. 그래픽

포토샵이나 일러스트레이터 등에서도 이 기능을 사용할 수 있다.

분류