brunch

라이킷 14 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by UX DAYS SEOUL Sep 05. 2021

가독성 (최적의 행 길이)

Readability

이 기사는 Baymard의 허가 아래 게재하고 있습니다.
(2010년 11월 2일의 기사입니다)

각 행에 적절한 양의 문자를 사용하는 것이 텍스트 가독성의 핵심입니다. 텍스트의 너비를 결정하는 것은 디자인뿐만 아니라 가독성의 문제이기도 합니다.

본문 텍스트의 최적 행 길이는 공백을 포함하여 행당 50-60자로 간주됩니다 (“Typography”, E. Ruder). 다른 출처에서는 최대 75자를 사용할 수 있다고 제안합니다. 이 범위를 무시하면 어떤 단점이 있을까요?

적절한 범위를 무시하면 생기는 단점

너무 넓을 경우

텍스트 행의 길이가 너무 길면 사용자의 눈이 텍스트에 집중하는 데 어려움을 겪을 것입니다. 왜냐하면 행 길이가 어디서 시작되고 어디서 끝나는지 가늠하기 어렵기 때문입니다. 또한 큰 텍스트 블록에서 올바른 행으로 이동하는 것이 어려울 수 있습니다.

너무 좁을 경우

텍스트 행의 길이가 너무 짧으면 눈이 너무 자주 앞과 뒤로 이동해야 하므로 사용자의 리듬이 깨집니다. 너무 짧은 행은 또한 사용자에게 스트레스를 주기 때문에 현재 행을 다 읽기 전에 다음 행을 읽게 만듭니다 (따라서 잠재적으로 중요한 단어를 건너뛰게 됩니다).

다음 행으로 넘어갈 때 잠재의식이 활성화되는 것으로 나타났습니다. 모든 새 행의 시작 부분에서 사용자는 초점을 맞추지만 이 초점은 행이 지속되는 동안 점차 사라집니다 ("Typography", E. Ruder).

너무 길고 너무 짧은 행의 단점을 피하면서도 여전히 사용자에게 활력을 주고 계속 관심을 갖도록 하려면 텍스트를 행당 50-75자 범위 내로 유지하는 것이 좋습니다.

웹 디자인에서 최적의 행 길이를 만드는 방법

웹디자인에서는 em 또는 픽셀을 사용하여 텍스트 블록의 너비를 제한하여 행당 최적의 문자 수를 얻을 수 있습니다. (em을 사용하면 최상의 결과를 얻을 수 있지만 픽셀보다 작업하기가 조금 더 까다로울 수도 있습니다.) 대다수의 방문자를 위해서는 어느 것을 선택하든 최적의 행 길이를 얻으려면 레이아웃이 고정 너비 여야 합니다.

이것이 우리가 완전히 유동적인 레이아웃을 사용하는 것을 권장하지 않는 이유 중 하나입니다. 사용자가 사이트에서 좋은 읽기 환경을 원할 경우 브라우저 창의 크기를 조정해야 합니다. 오늘날 사용되는 무수히 많은 창 크기를 고려할 때 유동적인 레이아웃으로 인해 다소 임의의 행 길이가 생성된다는 것은 분명합니다.

(기사 업데이트, 2014년 6월)