블로그꾸미기 초보자가 먼저 손봐야 할 화면 세팅 방법

처음부터 예쁘게보다 먼저 읽히게
얼마 전 지인 블로그를 봐주다가 예전 조립PC 견적표 보는 느낌을 받았습니다. 부품은 다 좋은데 케이블 정리가 안 되어 공기 흐름이 막힌 본체 같았거든요. 글은 괜찮은데 배너, 위젯, 글씨 색, 배경 이미지가 서로 부딪혀서 눈이 오래 머물기 어려웠습니다.
블로그꾸미기는 화려하게 꾸미는 작업이라기보다 독자가 글을 편하게 읽도록 화면을 세팅하는 작업에 가깝습니다. 윈도우 설치 후 드라이버 잡고, 불필요한 시작 프로그램을 줄이고, 해상도와 배율을 맞추는 과정과 비슷합니다. 처음 세팅이 어긋나면 성능 좋은 PC도 답답하게 느껴지듯이, 좋은 글도 화면이 산만하면 체감 품질이 확 떨어집니다.
저는 블로그를 볼 때 먼저 세 가지를 봅니다. 첫 화면에서 글 주제가 바로 보이는지, 본문 글씨가 10초 이상 읽기 편한지, 모바일에서 버튼이나 광고가 내용을 가리지 않는지입니다. 이 세 가지만 잡아도 방문자가 느끼는 안정감이 꽤 달라집니다.
레이아웃은 2단보다 본문 중심이 편하다
초보자가 가장 많이 하는 실수가 사이드바를 너무 많이 채우는 겁니다. 인기글, 최신글, 카테고리, 프로필, 배너, 달력, 태그 구름까지 넣으면 화면은 풍성해 보이지만 실제로는 시선이 분산됩니다. 특히 PC보다 모바일 방문자가 많은 블로그라면 사이드바 장식은 체감 효과가 더 낮습니다.
PC 조립할 때도 케이스 안에 LED 팬을 많이 넣는다고 무조건 좋은 시스템이 되지는 않습니다. 흡기와 배기 방향이 먼저 맞아야 하고, 그래픽카드 주변 공간이 살아 있어야 합니다. 블로그도 마찬가지입니다. 본문 영역이 넓고 깨끗해야 글이 살아납니다.
본문 폭은 너무 넓지 않게
데스크톱 화면에서 본문이 좌우로 너무 길게 펼쳐지면 한 줄을 읽는 데 눈이 많이 움직입니다. 개인적으로는 본문 폭이 720px에서 860px 사이일 때 긴 글 읽기가 가장 편했습니다. 사진을 많이 쓰는 블로그라면 900px 안팎도 괜찮지만, 텍스트 중심 블로그라면 폭을 욕심내지 않는 편이 낫습니다.
- 본문 폭은 넓게보다 안정적으로 잡기
- 사이드바 위젯은 꼭 필요한 것만 남기기
- 첫 화면에 글 제목과 본문 시작 부분이 보이게 하기
- 카테고리는 5~8개 정도로 단순하게 유지하기
카테고리도 너무 잘게 나누면 관리가 힘듭니다. 예를 들어 PC 블로그라면 CPU, 그래픽카드, 윈도우 오류, 조립 가이드, 주변기기 정도면 처음에는 충분합니다. 나중에 글이 100개, 200개 쌓였을 때 세분화해도 늦지 않습니다.
글씨 크기와 줄간격이 체감 품질을 만든다
블로그꾸미기에서 가장 가성비 좋은 설정은 폰트 크기와 줄간격입니다. 배경을 바꾸고 로고를 만드는 것보다 본문 가독성을 먼저 잡는 게 훨씬 큽니다. 윈도우에서 배율 100%와 125% 차이가 생각보다 크게 느껴지는 것처럼, 글씨 1px 차이도 오래 읽을 때는 피로감으로 돌아옵니다.
본문 글씨는 모바일 기준 16px 이상, PC 기준 16~18px 정도가 무난합니다. 줄간격은 1.6 전후가 읽기 편했습니다. 줄간격이 1.2 정도로 좁으면 글이 뭉쳐 보이고, 2.0을 넘기면 문단이 흩어져 보입니다. 특히 정보성 글은 문장이 짧아도 줄간격이 너무 넓으면 리듬이 끊깁니다.
색상은 진한 검정 하나만 고집하지 않아도 된다
본문 글자색은 완전한 검정보다 약간 부드러운 짙은 회색이 눈에 편합니다. 배경은 흰색이나 아주 옅은 회색이 안정적입니다. 대신 본문 중간에 빨강, 파랑, 초록을 계속 섞으면 집중이 깨집니다. 강조색은 하나만 정해두는 편이 좋습니다.
- 본문 글씨는 16~18px 범위에서 테스트
- 줄간격은 1.55~1.75 사이로 조정
- 강조색은 1개만 고정해서 사용
- 굵은 글씨는 문단마다 쓰지 말고 필요한 부분에만 사용
저는 글 하나를 발행하기 전에 모바일 화면으로 꼭 다시 봅니다. PC에서는 멀쩡한데 휴대폰에서 제목이 두 줄을 넘어가거나, 본문 중간 이미지가 너무 커서 흐름이 끊기는 경우가 자주 있습니다. 실제 방문자는 대부분 그렇게 봅니다.
이미지와 썸네일은 통일감이 먼저다
썸네일은 클릭을 부르는 역할도 하지만, 블로그 전체 인상을 만드는 부품이기도 합니다. 글마다 폰트, 색상, 배치가 다르면 목록 화면이 어수선해집니다. 조립PC로 치면 팬은 검정, 케이블은 흰색, 튜닝램은 무지개색, 그래픽카드 지지대는 금색인 상태와 비슷합니다. 하나씩 보면 나쁘지 않은데 같이 놓으면 방향이 안 보입니다.
블로그꾸미기를 처음 한다면 썸네일 규칙을 먼저 정해두는 게 좋습니다. 배경색 2~3개, 제목 위치 1개, 글자 크기 1개, 보조 문구 사용 여부 정도만 고정해도 전체가 훨씬 단정해집니다. 모든 이미지를 새로 만들 필요는 없습니다. 앞으로 올릴 글부터 같은 규칙을 적용하면 됩니다.
사진은 선명함보다 정보가 보여야 한다
PC 조립 글에서는 감성 사진보다 실제 부품 위치가 보이는 사진이 더 중요합니다. 블로그꾸미기 글에서도 마찬가지입니다. 예쁜 배경보다 메뉴 위치, 본문 폭, 버튼 간격처럼 독자가 바로 이해할 수 있는 이미지가 좋습니다. 흐릿한 캡처 화면은 글 신뢰도를 떨어뜨립니다.
- 썸네일 비율은 가능하면 하나로 고정
- 제목 위치와 글자 크기를 반복해서 사용
- 본문 이미지는 가로 폭을 통일
- 캡처 화면은 필요한 부분만 잘라서 사용
이미지 파일 용량도 봐야 합니다. 사진 한 장이 3MB, 5MB씩 되면 페이지가 늦게 열립니다. 방문자는 생각보다 기다려주지 않습니다. 보통 블로그 본문용 이미지는 화면에서 깨지지 않는 선에서 압축하는 게 낫습니다.
광고와 위젯은 적을수록 오래 버틴다
블로그를 운영하다 보면 광고 위치를 계속 만지고 싶어집니다. 저도 초반에는 상단, 본문 중간, 하단, 사이드바를 다 넣어본 적이 있습니다. 그런데 실제로 오래 봤을 때는 광고가 많다고 무조건 좋은 결과가 나오지 않았습니다. 글 흐름을 끊는 광고는 체류 시간을 줄이고, 결국 블로그 인상도 떨어뜨립니다.
특히 본문 첫 문단 위에 큰 광고가 먼저 나오면 독자는 글을 읽기 전에 피로감을 느낍니다. PC에서 부팅하자마자 팝업 프로그램이 여러 개 뜨는 느낌입니다. 필요한 프로그램이어도 시작부터 튀어나오면 귀찮습니다.
위젯도 비슷합니다. 방문자 수 카운터, 배경 음악, 움직이는 배너, 자동 팝업은 예전에는 재미있었지만 지금은 대부분 방해 요소로 느껴집니다. 블로그꾸미기는 덧붙이는 작업보다 빼는 작업에서 더 많이 좋아집니다.
- 상단 첫 화면은 제목과 본문 진입을 우선
- 본문 중간 광고는 문단 흐름이 끊기지 않는 위치에 배치
- 자동 재생 요소는 사용하지 않는 편이 안전
- 모바일에서 닫기 어려운 팝업은 피하기
내 블로그에 맞는 꾸미기는 결국 운영하면서 잡힌다
처음부터 완벽한 블로그 디자인을 만들려고 하면 손이 멈춥니다. 실제로는 글을 20개쯤 올려봐야 어떤 카테고리가 살아나는지, 어떤 썸네일이 잘 눌리는지, 본문 길이가 어느 정도일 때 읽히는지 감이 옵니다. 윈도우도 설치 직후보다 며칠 쓰면서 드라이버 충돌이나 절전 문제를 잡을 때 더 안정화됩니다.
블로그꾸미기도 같은 방식으로 접근하면 부담이 줄어듭니다. 먼저 본문 읽기 편하게 만들고, 모바일 화면을 확인하고, 썸네일 규칙을 정하고, 불필요한 위젯을 덜어내면 됩니다. 그다음은 방문자가 실제로 오래 머무는 글을 보면서 조금씩 손보면 됩니다.
화려한 스킨보다 중요한 건 글을 읽는 사람이 길을 잃지 않는 화면입니다. 오래 운영되는 블로그는 대체로 첫인상이 요란하지 않습니다. 필요한 메뉴가 보이고, 글이 편하게 읽히고, 다음 글로 넘어가는 흐름이 자연스럽습니다. 저는 그런 블로그가 결국 더 오래 기억에 남는다고 봅니다.
