구글 애드센스 광고 수익을 목적으로 티스토리 블로그를 운영중이시라면, 구글 서치 콘솔 도구에서 모바일 편의성에 경고 문구를 보신 적 있으실겁니다. 어떤 문제냐면 말 그대로 작성한 콘텐츠의 설정된 크기가 콘텐츠를 탐색하는 사용자들의 기기 화면 크기 (Device width)가 각각 다르기 때문에 콘텐츠가 기기 화면을 벗어나는 경우가 있다는 말입니다.
위 문제가 발생하면 사이트의 검색 노출에서 제외되며, 그러면 방문자와 애드센스 수익이 줄어들게 됩니다.
위 문제는 구글 서치콘솔에 블로그 URL 을 등록해야 확인이 가능합니다. 블로그 운영을 계획중이거나 운영중인데 아직 서치콘솔에 등록이 되어있지 않다면 꼭 등록하세요!
뷰포트 설정
뷰포트 설정은 독립적인 픽셀로 만들어 다양한 기기에서 페이지를 열더라도 화면의 너비를 일치시켜줄 수 있습니다.
- 티스토리 관리 > 스킨 편집 > html 편집 으로 들어갑니다.
- [HTML] 편집창을 클릭한 뒤, > [Ctrl] + [F] 를 눌러 html 을 검색합니다.
- 검색창에 “viewport” 를 입력하고 [Enter] 를 눌러 검색합니다.
- <meta name=”viewport” ~ > 로 되어있는 코드 전체를 아래의 코드 블럭 안에 있는 html 코드로 복사 붙여넣기 해서 덮어씌워 줍니다.
- 모든 작업이 완료되었다면 우측 상단의 [적용]을 눌러서 저장해줍니다.
- 구글 서치 콘솔로 돌아와 수정 결과 확인 을 눌러 유효성 검사를 시작합니다. 유효성 검사까지 걸리는 기간은 랜덤이며 며칠 안에 등록된 메일로 피드백 받을 수 있습니다.
복사 방지로 인해 코드를 작성한 txt 파일을 다운받아 내용을 복사해주세요.
<meta name="viewport" content="initial-scale=1.0, width=device-width">문제 해결
문제 해결이 완료되면 서치콘솔 도구 또는 이메일로 알림을 받게 됩니다. 그렇게 되면 앞으로 다른 페이지의 색인에 있어서도 뷰포트 설정이 제대로 되어있어 동일한 현상이 발생할 확률이 거의 제로에 가깝습니다. 모바일 검색의 비중이 커진 만큼 모바일 편의성에 신경을 써야 블로그 수익 창출도 되돌아오지 않을까요?
