초보자를 위한 블로그꾸미기 방법, 복잡한 디자인 없이 보기 좋게 바꾸는 순서

처음엔 예쁜 스킨보다 읽기 쉬운 화면이 먼저였다

얼마 전 지인 블로그를 같이 손봤는데, 글 내용은 괜찮은데 화면이 너무 바빠서 첫 문단까지 가는 데 시간이 걸렸다. 배너는 3개, 카테고리는 12개, 본문 폭은 좁고 글씨는 작았다. 사실 블로그꾸미기는 화려한 장식을 더하는 작업이라기보다, 방문자가 글을 덜 힘들게 읽도록 길을 치우는 작업에 가깝다.

특히 파일 변환 방법, 무료 양식, 압축 프로그램 사용법 같은 실용 글은 더 그렇다. 방문자는 감상하러 온 게 아니라 빨리 해결하려고 들어온다. 그래서 첫 화면에서 제목, 핵심 설명, 본문 시작 위치가 바로 보여야 한다. 예쁜 것보다 빠른 것이 먼저다.

블로그꾸미기 전에 먼저 빼야 할 것들

처음 손댈 부분은 추가가 아니라 삭제다. 사이드바 위젯, 움직이는 배너, 자동 재생 요소, 과한 배경 이미지는 생각보다 글 집중을 많이 방해한다. 제 경험상 초보 블로그에서 가장 효과가 컸던 작업은 새 기능을 넣는 게 아니라 사이드바 항목을 절반으로 줄이는 것이었다.

• 최근 글, 인기 글, 카테고리처럼 탐색에 필요한 것만 남긴다.
• 방문자 수, 날씨, 시계 위젯처럼 글 읽기와 무관한 요소는 뺀다.
• 본문 주변 광고나 배너가 너무 붙어 있으면 간격을 넓힌다.
• 모바일에서 첫 문단이 너무 아래로 밀리면 상단 장식을 줄인다.

근데 여기서 조심할 점이 있다. 블로그를 너무 비워두면 허전해 보일까 봐 다시 뭔가를 넣고 싶어진다. 그럴 때는 PC 화면보다 휴대폰 화면을 먼저 확인하는 편이 좋다. 요즘은 검색 방문자 상당수가 모바일로 들어오기 때문에, 모바일에서 보기 편하면 기본 점수는 이미 꽤 올라간다.

색상과 글꼴은 3개 규칙으로 잡으면 쉽다

블로그꾸미기에서 가장 많이 흔들리는 부분이 색상이다. 마음에 드는 색을 계속 추가하다 보면 어느새 버튼은 파란색, 제목은 보라색, 링크는 초록색, 강조 박스는 노란색이 된다. 이렇게 되면 방문자는 무엇이 중요한지 바로 알아보기 어렵다.

초보라면 색은 3개만 잡아도 충분하다. 기본 글자색 1개, 강조색 1개, 배경 보조색 1개다. 예를 들어 본문 글자는 진한 회색, 버튼과 링크는 한 가지 파란색, 안내 박스 배경은 아주 옅은 회색 정도면 대부분의 글에 무난하게 어울린다.

글꼴은 개성보다 가독성

글꼴도 비슷하다. 제목용 글꼴과 본문용 글꼴을 따로 쓰고 싶다면 최대 2개까지만 추천한다. 본문은 장식이 적고 획이 또렷한 글꼴이 좋다. 글씨 크기는 PC 기준 16px 이상, 모바일에서도 너무 작아 보이지 않는 크기가 편하다. 줄 간격은 1.6 안팎으로 두면 긴 문단도 덜 답답하다.

솔직히 블로그 첫인상은 글꼴 이름보다 여백에서 많이 갈린다. 문단 사이가 너무 붙어 있으면 아무리 좋은 글도 숨이 막힌다. 반대로 여백이 적당하면 같은 글도 더 전문적으로 보인다.

본문 꾸미기는 박스보다 흐름이 중요하다

정보형 블로그는 본문 안에서 길을 잘 보여줘야 한다. 예를 들어 PDF 압축 방법을 설명한다면 ‘준비물’, ‘압축 순서’, ‘용량이 줄지 않을 때’, ‘저장 위치 확인’처럼 독자가 실제로 막히는 순서대로 배치하는 게 좋다. 디자인 요소는 이 흐름을 돕는 정도면 충분하다.

• 중요한 경고는 굵은 글씨보다 안내 박스 1개로 분리한다.
• 단계 설명은 긴 문단보다 짧은 목록으로 나눈다.
• 스크린샷은 한 단계에 1장 정도만 넣어 시선을 분산시키지 않는다.
• 버튼 이름이나 메뉴 이름은 실제 화면에 보이는 표현과 맞춘다.

많이 하는 실수가 모든 문단에 강조색을 넣는 것이다. 강조가 많으면 아무것도 강조되지 않는다. 저는 글 하나에 진짜 중요한 박스는 2개 이하로 두는 편이다. 특히 무료 도구를 소개하는 글에서는 ‘로그인 필요 여부’, ‘파일 용량 제한’, ‘워터마크 여부’ 같은 실사용 정보만 눈에 띄게 표시하면 된다.

카테고리와 메뉴는 방문자의 목적대로 나눈다

블로그꾸미기를 할 때 상단 메뉴를 예쁘게 만드는 데 시간을 많이 쓰지만, 이름이 애매하면 효과가 떨어진다. ‘자료실’, ‘생활팁’, ‘기타’처럼 넓은 이름만 있으면 방문자는 어디를 눌러야 할지 고민한다. 반대로 ‘PDF 변환’, ‘이미지 압축’, ‘문서 양식’, ‘무료 프로그램’처럼 목적이 보이면 이동이 훨씬 빠르다.

카테고리는 처음부터 많이 만들 필요 없다. 글이 30개 이하라면 4~6개 정도가 관리하기 편하다. 글이 쌓인 뒤에 세부 메뉴를 나눠도 늦지 않다. 예를 들어 ‘파일 변환’ 안에 PDF, 이미지, 문서 파일을 한동안 같이 넣어두고, 글이 충분히 늘어나면 그때 분리하면 된다.

검색 유입 글은 제목 주변이 특히 중요하다

검색으로 들어온 방문자는 블로그 전체 분위기보다 해당 글이 문제를 해결해 주는지를 먼저 본다. 그래서 제목 아래 첫 문단에 답의 방향이 보여야 한다. “회원가입 없이 가능한 방법”, “윈도우 기본 기능으로 처리 가능”, “무료 버전 제한 있음” 같은 정보가 빨리 보이면 이탈이 줄어든다.

제목 주변에 큰 배너나 긴 인사말이 들어가면 손해다. 방문자는 이미 검색 결과에서 제목을 보고 들어왔으니, 다시 긴 소개를 읽고 싶어 하지 않는다. 짧게 상황을 잡고 바로 방법으로 넘어가는 구성이 실용 블로그에는 잘 맞는다.

꾸민 뒤에는 5분 점검만 해도 차이가 난다

블로그꾸미기를 끝냈다면 발행 전에 5분만 점검해도 완성도가 꽤 달라진다. PC에서 예뻐 보여도 모바일에서 제목이 두 줄 이상 밀리거나, 표가 화면 밖으로 튀어나가거나, 이미지가 너무 늦게 뜨는 경우가 자주 있다. 특히 파일 변환이나 문서 양식 글은 캡처 이미지가 많아서 로딩 속도를 한 번 더 봐야 한다.

• 휴대폰에서 첫 화면에 제목과 첫 문단이 보이는지 확인한다.
• 본문 글씨가 확대 없이 읽히는지 본다.
• 강조 박스 색이 너무 진해서 글자를 방해하지 않는지 확인한다.
• 이미지 파일 크기가 지나치게 크면 압축해서 올린다.
• 카테고리 이름만 봐도 글 성격이 떠오르는지 점검한다.

개인적으로 블로그는 한 번에 완성하는 공간이 아니라고 생각한다. 글을 10개쯤 올리고 방문자가 오래 머무는 글을 보면, 어떤 꾸밈이 필요한지 훨씬 선명해진다. 처음부터 완벽한 디자인을 찾느라 오래 멈춰 있기보다, 읽기 편한 기본값을 만든 뒤 실제 글에 맞춰 조금씩 다듬는 방식이 오래 간다.