오랜만에 구글서치콘솔에 들어가서 어떤게 개선을 해야하나 살펴보았는데, 개선사항 탭에 '모바일 사용 편의성'이라는 부분이 있어 클릭해보았는데, '클릭할 수 있는 요소가 서로 너무 가까움'이라는 것이 있었다. 문득, 어떤 부분이 클릭할 수 있는 부분이 가깝다는 건지 감이 잘 오지 않아 해당 내용을 자세히 클릭해보았다.
모바일 친화적이지 않은 tag페이지?
자세히 보았더니 아래쪽에 영향을 받은 페이지를 확인해보니 tag페이지가 있었다. 태그페이지란 말 그대로 우리가 포스팅을 하고 마지막에 검색에 잘 걸릴 수 있도록 넣어주는 일종의 해시태그이다. 아마 대부분 모든 사람들이 '클릭할 수 있는 요소가 서로 너무 가까움'으로 표시되는 페이지는 자신의 주소 뒤에 들어가는 태그페이지일 것이다.
개인적으로는 뭐, 이게 굳이 클릭할 수 있는 요소가 가까운가 생각을 할 수 있겠지만, 구글에서 그렇다고 그러니까 바꿔드려야지.
글자 사이의 간격만 늘려주면 끝
관리자페이지 - 스킨편집 - html 편집 - CSS - line-height
이 문제는 가장 간단하게 해결할 수 있는데, 바로 글자 사이의 간격을 늘려주기만 하면 된다. 우선 관리자페이지의 스킨편집으로 들어가자. 그런다음 오른쪽 메뉴에서 html편집을 클릭한다.
그러면 HTML, CSS, 파일업로드 총 3개의 상단 메뉴가 나오는데 우리는 CSS를 수정할 것이기 때문에 CSS를 클릭.
그러면 우리에게 좀 익숙하지 않은 형태로 파일소스들이 나오는데 여기서 겁먹을 것 없이 ctrl+F (맥사용자: cmd+F)를 통해 단어를 바로 찾는데, 바로 line-height (줄 간격)을 입력하여 바로 이동하자. 아래 보이는 오렌지 색으로 처리된 line-height가 바로 그것.
여기서 대부분 줄 간격이 1.25로 되어 있을 건데, 이것을 2에서 2.5 사이로 (혹은 그 이상) 입력하자. 나 같은 경우는 +1을 추가한 2.25로 입력한 후, 적용을 누르면 끝.
그러면 아래와 같이 줄 간격이 예전에 비해 좀 늘어난 것을 육안으로 확인할 수 있다.
업데이트 되기 까진 며칠 걸려
이렇게 바로 적용했다고 해서 구글서치콘솔에서는 바로 적용이 되지 않는다. 은근 구글서치콘솔은 업데이트가 느리기 때문에 수일이 걸릴 수도 있다. 다만, 바로 확인해보는 방법은 오른쪽 윗쪽의 실제 URL 테스트를 클릭해서 제대로 되었는지 확인해서 그 테스트에서 제대로 나왔다면 문제가 없다. 그럼 실제 URL 테스트를 눌러 확인해보자.
테스트를 확인하면 아래와 같이 '페이지가 모바일 친화적임'이라고 나온다. 그러면 모든게 완료. 이렇게 줄간격 하나의 수정으로 모바일 친화적인 페이지를 맞출 수 있다.
다음에는 또 구글서치콘솔에서 일어나는 다른 이슈로 만나기.
'블로그' 카테고리의 다른 글
| 구글 애드센스 코로나 검토 불가만 9번째, 언제까지? (21) | 2020.06.09 |
|---|---|
| 키워드 검색량 바로 확인하는 방법 (feat. 세수하면이병현) (15) | 2020.06.04 |
| 네이버 인플루언서의 폐해 (feat. 유튜버 테크몽 블로그 접는다고 선언) (24) | 2020.06.01 |
| 블로그 신누락 해결방법 1가지 드디어 찾았다 (29) | 2020.05.28 |
| 티스토리 썸네일 누락, 누가 해결 방법 있다고 하는거야? (34) | 2020.05.22 |