블로그꾸미기 처음이라면 글 화면부터 바꾸는 방법
얼마 전 오래된 블로그 글을 휴대전화로 열어봤는데, 내용보다 글자와 이미지가 먼저 눈에 걸렸습니다. 제목은 길게 잘리고, 본문 글씨는 작고, 사진은 화면 밖으로 밀려나 있었죠. 블로그꾸미기를 시작한다면 배경색부터 바꾸기보다 독자가 실제로 읽는 글 화면을 먼저 손보는 편이 효과가 큽니다.
바꾸기 전에 글 하나를 휴대전화로 열어보기
관리 화면에서는 멀쩡해 보여도 작은 화면에서는 인상이 달라집니다. 방문자가 자주 읽는 글 하나를 골라 휴대전화로 열고, 제목부터 첫 번째 이미지까지 천천히 내려가 보세요. 글자가 너무 작지는 않은지, 문단이 화면을 가득 채우지는 않는지, 버튼이나 배너가 본문을 가리지는 않는지 확인합니다.
저는 이때 화면을 세 번 멈춰 봅니다. 첫 화면에서는 제목과 도입부가 보이는지, 중간에서는 소제목만 훑어도 흐름이 잡히는지, 끝에서는 다음 행동을 고르기 쉬운지 봅니다. 발견한 문제를 메모해 두면 색상이나 장식을 고르다가 시간을 다 쓰는 일을 줄일 수 있습니다.
꾸미기 전 화면을 캡처해 두는 것도 좋습니다. 수정 후 같은 글의 같은 위치를 다시 찍으면 무엇이 나아졌는지 바로 비교할 수 있거든요. 방문자 수처럼 다른 요인에 흔들리는 숫자보다, 읽기 편한지 판단하기에는 이 비교가 더 직접적입니다.
글자와 여백은 한 번에 조금씩 조절하기
본문 글꼴은 화려한 것보다 오래 읽어도 편한 것이 낫습니다. 플랫폼에서 제공하는 기본 글꼴 중 하나를 고르고, 본문 크기는 휴대전화에서 팔을 자연스럽게 뻗고도 읽히는 수준으로 맞춥니다. 설정에 숫자가 표시된다면 16픽셀 안팎에서 시작해 실제 화면을 보며 조절하면 됩니다. 제목은 본문과 확실히 구별하되, 한 줄에 들어가게 하려고 지나치게 작게 만들 필요는 없습니다.
문단도 디자인의 일부입니다. 한 문단에 설명을 여러 개 넣으면 휴대전화에서는 글자 덩어리로 보입니다. 주제가 바뀌는 곳에서 문단을 나누고, 긴 절차는 목록으로 바꿉니다. 소제목 아래에는 바로 설명을 붙여 독자가 예상한 내용을 찾게 해주세요.
색은 기본 글자색과 강조색을 포함해 두세 가지면 충분합니다. 흰 바탕에 진한 글자를 기본으로 두고, 강조색 하나를 링크나 버튼에 반복해서 쓰면 화면이 차분해집니다. 회색 글자를 너무 연하게 하거나 사진 위에 글자를 얹으면 보기에는 예뻐도 읽기 어려울 수 있습니다. 설정을 바꿀 때는 글자 크기, 줄 간격, 색을 한꺼번에 건드리지 말고 하나씩 바꿔야 차이를 판단하기 쉽습니다.
이미지는 크기보다 역할부터 정하기
이미지를 넣을 때마다 먼저 묻는 질문이 있습니다. 이 그림이 설명을 돕는가, 아니면 빈 공간을 채우는가. 파일 변환 방법을 설명한다면 결과 화면을 보여주는 캡처 한 장이 장식 사진 여러 장보다 유용합니다. 캡처에는 필요한 부분만 남기고, 계정 이름이나 개인 파일명은 가린 뒤 올립니다.
이미지가 너무 크면 글을 여는 시간이 길어집니다. 카메라 원본을 그대로 올리기보다 글 영역에 맞춰 크기를 줄이고, 사진은 적절한 품질로 압축합니다. 예를 들어 가로 4000픽셀 사진을 본문 너비가 800픽셀 정도인 곳에 그대로 넣을 이유는 드뭅니다. 다만 메뉴 글씨가 있는 화면 캡처는 압축을 세게 하면 읽기 어려워지므로, 올린 뒤 휴대전화에서 글자가 선명한지 확인합니다.
대표 이미지도 같은 원칙으로 만듭니다. 글마다 제각각인 장식보다 같은 비율과 글자 배치를 쓰면 목록 화면이 한결 안정적으로 보입니다. 작은 화면에서는 이미지 속 긴 문장이 잘리기 쉬우니, 대표 이미지의 글자는 짧게 두고 중요한 설명은 본문 제목에 적는 편이 안전합니다.
메뉴와 배너는 독자의 다음 움직임에 맞추기
메뉴가 많다고 찾기 쉬운 것은 아닙니다. 파일 변환, 압축, 문서 양식처럼 방문자가 실제로 찾는 주제로 묶고, 이름만 봐도 어떤 글이 들어 있는지 알 수 있게 적습니다. 글이 거의 없는 메뉴를 여러 개 만들어 두면 오히려 길을 잃기 쉽습니다. 처음에는 자주 쓰는 메뉴 몇 개로 시작하고, 글이 쌓이면 나누어도 늦지 않습니다.
옆 영역에 달력, 방문자 표시, 배너를 모두 넣었다면 휴대전화 화면도 확인해야 합니다. 플랫폼에 따라 옆 영역이 본문 아래로 내려오거나 화면 위쪽을 차지할 수 있습니다. 그 결과 첫 문단을 보려면 여러 번 내려야 한다면, 독자에게 필요한 메뉴만 남겨두는 편이 낫습니다.
수정한 글을 컴퓨터와 휴대전화에서 각각 한 번씩 읽어봅니다. 제목이 잘리는 곳은 없는지, 이미지가 흐리거나 튀어나오지 않는지, 메뉴를 눌렀을 때 예상한 글이 나오는지 확인하면 됩니다. 블로그꾸미기는 장식을 많이 더하는 작업보다, 독자가 찾은 답을 편하게 읽고 다음 글로 이동할 수 있게 만드는 작업에 가깝다고 생각합니다.
