읽기 편한 포스트를 만드는 4가지 방법

블로그에서 사진이나 동영상 등 여러 미디어를 다룰 수 있지만, 무엇보다 중요한 것은 바로 텍스트입니다. 어디까지나 블로그는 '글'을 통해서 내용을 전달하는 경우가 더 많고, 그 밖의 매체는 글의 내용을 보완하는 수준에 머물기 때문입니다. 그런 의미에서 좋은 블로그에 좋은 글이 많은 것은 당연한 이야기입니다. 하지만, 보기도 좋은 떡이 먹기도 좋다는 말이 있는것처럼, 아무리 내용이 좋다고 한들 읽기가 불편하다면 블로그 방문자의 시선을 오래 끄는것은 어렵습니다.

오늘은 읽는 사람을 고려함으로써, 블로그 방문자의 시선을 오랫동안 잡아놓을 수 있는 읽기 편한 포스트를 만드는 방법에는 어떤것이 있는지 간략하게나마 살펴보도록 하겠습니다.

각각의 섹터별로 소제목을 달아라

대부분의 블로그에서 장문의 글을 다루는 경우는 많지 않기 때문에 크게 활용되지 않을수도 있지만, 만약 혹시라도 장문의 글을 작성하실 계획이라면 반드시 각각의 섹터별로 소제목을 달아주는 것이 좋습니다. 소제목이 필요한 이유는, 실제로 여러분이 작성한 장문의 글을 모두 읽는 방문객은 소수에 불과하기 때문입니다. 읽는 분들이 소수이기 때문에, 여러분이 정말로 전달하고자 하는 내용은 소제목을 통해 방문객에게 분명히 어필할 필요가 있습니다.

또한 가장 중요한 제목 외에도 여러 소제목을 달아둠으로써, 방문객이 해당 포스트에 호기심을 가질 수 있는 여지를 남겨둘 수 있습니다. 즉, 매력적인 소제목은 방문객의 시선을 보다 오래 잡아둘 수 있는 역할을 한다는 점입니다. 

H 태그를 이용하라

앞서 말씀드린 것과 같이 소제목을 다셨다면, 이렇게 작성된 소제목은 H 태그를 이용하여 강조하실 필요가 있습니다. 이를 이용하여 강조하는 이유는 방문객에게 해당 내용이 소제목이라는 점을 분명하게 어필함으로써 방문객의 시선을 끌기 위해서 입니다. 또한 검색엔진 크롤러에게 이 내용이 중요하다는 것을 확인시켜주는 역할을 함으로써, 검색엔진 최적화에도 사용될 수 있습니다. H 태그는 다음과 같은 형태로 사용되니 참고하여 적용하시길 바랍니다.

 - H태그는 <h1> ~ <h6>의 종류가 있고, 대개의 경우 <h1>, <h2>, <h3> 정도 까지만 사용됩니다.

 - 각각의 H태그의 스타일을 지정함으로써 자신만의 독특한 형태의 소제목을 만들 수 있습니다.

 (예) 자신만의 스타일을 만들고 이를 style.css에 추가하면 됩니다.

.entry-body h2 { border-left:15px solid #212121; border-bottom:1px solid #a6a6a6;

padding:0 0 5px 10px; color: #191919; }

H 태그의 자세한 사용법은 추후에 자세히 포스팅 하도록 하겠습니다. 기본적으로는 H의 숫자가 작아질수록 더 작은 폰트 크기를 갖게 됩니다. 이는 각각의 숫자가 상위 숫자에 대해 하위 내용임을 의미합니다. H2는 H1의 하위 내용이고, H3는 H2의 하위 내용이 되는 것이라고 보시면 됩니다.

적절한 곳에서 문단을 구분하라

긴 문장 사이사이에는 호흡을 쉴 수 있도록 쉼표가 있듯이, 장문의 글에도 호흡을 쉴 수 있는 문단이 있고, 이는 뚜렷하게 구분되어야만 제 역할을 할 수 있습니다. 그러나 무의미한 곳에서 문단이 나눠져 있는 경우가 많고, 또는 문단이 뚜렷하게 나눠져 있지 않은 경우가 많습니다. 글을 쓰는 관점에서 바라봤을 때, 문단은 하나의 내용 단위로 나눠지는 것이 바람직하며, 읽기 편한 포스트의 관점에서 봤을 때 문단은 문단과 문단 사이에 넓은 간격이 있는 것이 좋습니다.

위의 이미지에서는 문단이 붙어 있는 경우와 문단과 문단이 떨어져 있는 경우를 보여드리고 있습니다. 후자의 경우가 보다 가독성이 높다는 사실을 확인하셨을거라 생각합니다.

글자 크기와 줄간격은 크고 넓게 하라

전자잉크와 같은 디스플레이가 아닌 이상, PC나 스마트폰 디스플레이를 통해 화면을 바라보았을 때 눈의 피로함을 느끼는 것은 당연한 반응입니다. 또한, 글이 작고 줄이 가까이 붙어있을 때, 보다 많은 집중이 필요되어지기 때문에 눈이 더 피로할 수 밖에 없습니다. 이렇게 글을 읽는데에 많은 피로감이 느껴진다면, 아마 방문객은 글을 읽기 전에 뒤로가기 버튼으로 마우스가 향할 가능성이 높습니다. 이를 보다 완화하고자 글자 크기를 적정한 크기로 키우고, 또한 줄간격을 넓게 유지할 필요가 있습니다.

위의 이미지 보이듯이, 적절한 글자 크기와 줄간격은 읽는데에 큰 도움을 줍니다. 글자 크기와 줄간격은 티스토리 에디터에서 아래의 기능을 이용하여 조정할 수 있습니다.

4가지 방법이 적용된 예시는 본 블로그의 리뷰 카테고리에 올라와 있는 글을 참고해주시길 바랍니다.