구글 블로그스팟 제목·부제목(H2·H3) 단락 올바른 설정법: 서식 오류 및 배경 얼룩 1초 해결 꿀팁
구글 블로그스팟(Blogger)을 운영하다 보면 메모장, 한글, 워드, 혹은 외부 마크다운 에디터에서 작성한 글을 복사해 붙여넣었을 때 원치 않는 서식 오류가 자주 발생한다. 특히 글자 뒤에 옅은 회색 음영이 묻어나거나, 모바일 화면에서 문단 간격이 지나치게 다닥다닥 붙어 가독성을 해치는 현상이 대표적이다.
블로그스팟 에디터에서 불필요한 스타일 코드를 한 번에 지우고, 검색 최적화(SEO)에 맞게 제목과 단락을 가장 빠르게 정돈하는 3단계 실전 루틴을 정리한다.
1. 외부 복사 시 글자 배경 음영(회색 얼룩)이 생기는 이유
외부 웹사이트나 문서 프로그램에서 텍스트를 복사할 때, 눈에 보이지 않는 웹 스타일 코드(인라인 CSS의 background-color 또는 font-family)가 클립보드에 함께 담겨 들어온다.
이를 블로그스팟 일반 글쓰기 창에 그대로 붙여넣으면 해당 스타일이 강제로 적용되면서, 발행 후 실제 블로그 화면이나 미리보기에서 글자 뒤에 지저분한 회색 테두리 음영이 그대로 노출된다.
2. 블로그스팟 서식 메뉴의 이해: '단락'과 '보통'의 차이
에디터 상단 툴바의 단락 형식 메뉴를 열어보면 여러 명칭이 나온다. 구글 검색 로봇(SEO)과 실제 모바일 가독성 측면에서 각 항목의 역할은 분명하게 나뉜다.
| 에디터 메뉴 명칭 | 매칭되는 HTML 태그 | 구글 검색 로봇(SEO) 인식 및 역할 |
|---|---|---|
| 맨 위 제목 칸 | <h1> | 글 전체의 유일한 대제목 (문서당 1개) |
| 제목 (Heading) | <h2> | 본문의 가장 큰 대목차 (1., 2., 3.) |
| 부제목 (Subheading) | <h3> | 대목차 내부의 세부 소분류 |
| 소제목 (Minor Heading) | <h4> | 부제목 아래의 추가 세부 항목 |
| 단락 (Paragraph) | <p> | 표준 본문 문단 (문단 간 위아래 적정 여백 형성) |
| 보통 (Normal) | <div> 또는 무태그 | 단순 줄바꿈 (문단 여백 없이 바짝 붙음) |
구글 알고리즘은 <p>(단락) 태그로 감싸진 글을 통해 완성된 하나의 문맥을 파악한다. 따라서 일반 설명 글은 '보통'이 아니라 '단락'으로 지정되어 있어야 모바일 화면에서도 답답하지 않은 줄 간격이 유지된다.
3. 일일이 바꾸지 않고 10초 만에 끝내는 본문 세팅 3단계
많은 초보 블로거들이 본문 문단을 줄마다 마우스로 드래그하며 하나씩 '단락'으로 바꾸느라 불필요한 시간을 소비한다. 전체를 일괄 초기화한 뒤 뼈대만 잡아주는 방식을 활용하면 수십 초 내로 완벽한 구조화가 가능하다.
1) 전체 선택 및 서식 초기화 (1초)
내용을 붙여넣은 뒤 본문 창에서 Ctrl + A를 눌러 전체를 선택한다. 상단 메뉴의 [서식 지우기(T에 빗금 모양 아이콘)]를 클릭해 외부에서 묻어온 불필요한 배경색과 폰트 코드를 완전히 날린다.
2) 글 전체를 한 번에 '단락'으로 지정 (2초)
전체 선택(Ctrl + A)이 유지된 상태에서 단락 형식 메뉴를 열고 [단락]을 클릭한다. 본문의 모든 설명 글이 표준 웹 문단 규격으로 일괄 세팅된다.3) 핵심 목차만 '제목'으로 지정 (5초)
본문 속 큰 번호 목차(1., 2., 3.) 줄만 마우스로 드래그하여 [제목]으로 변경한다. 만약 목차 아래 세부 서브 항목이 있다면 해당 줄만 [부제목]으로 지정해 준다.요약 및 적용 팁
외부에서 가져온 글은 [전체 선택 ➔ 서식 지우기 ➔ 단락 일괄 지정 ➔ 큰 목차만 제목 지정]이라는 일관된 규칙만 거치면 서식 깨짐이나 배경 얼룩 오류를 원천 차단할 수 있다.