스킨 교체후 구글 콘솔의 모바일 친화성 오류 문제 해결하기

FastBoot 스킨에서 JB 스킨으로 교체후 이틀정도 지난뒤에 구글콘솔에서 메일이 왔습니다.

모바일 사용자 편의성에 문제가 발생했다고 알려주는 메일이었습니다.

에러의 종류는 두가지 였습니다.

 

- "텍스트가 너무 작아서 읽을 수 없음"

- "클릭할 수 있는 요소가 서로 너무 가까움"

문제를 하나씩 찿아가다 보니 위의 두가지 오류는 어느 하나만 수정하면 다른 것은 동시에 수정되는 경우가 거의 대부분이었습니다.

아래의 그림에서는 오류가 2개이지만 또 다른 운영 블로그에서는 30개 가까이 나온터라 대부분이라는 용어를 사용하였습니다.

 

 

이 문제는 워낙 상대적인 개념이라 이러한 에러는 이런 부분을 이렇게 고쳐주면 된다 라고 정의할 수 없습니다.

오류를 일으키는 페이지의 상황에 따라 같은 오류 메시지라고 하더라도 원인은 각자 다를 수 있기 때문입니다.

따라서, 저의 경우에 일일이 오류 페이지를 확인하고 문제다 싶은 사항을 수정한 내용을 열거하는 것으로 원인규명을 대신하도록 할까 합니다.

 

- 페이지 안에 작성했던 텍스트 형식이 들어간 도표

모바일에서 도표가 수평으로 화면을 치고 나가게 되는데 PC화면에서도 사이드바를 타고 넘어가는 경우가 있었습니다.

이 경우가 굉장히 많은 확율을 차지하고 있었습니다.

각종 통계를 인용하면서 이미지보다는 텍스트 형식이 크롤링해갈때 좀더 많은 데이터를 가져갈 것 같은 생각에 도표를 직접 적어 삽입한 페이지가 많았습니다.

이런 경우 도표를 캡쳐한 뒤 이미지를 축소해서 올리니 대부분의 페이지 에러가 해결되었습니다.

 

- 태그 목록이 페이지 본문 하단 등에 삽입되어 있는 경우

이 경우에는 태그 자체가 문제되는 것이 아니라 태그에 들어간 단어들중 띄어쓰기가 되어 있는 태그가 있거나 긴글자수의 태그단어가 들어가 있을 경우에 문제가 되는 것 같았습니다.

태그에서 긴 단어들을 대부분 짧은 단어로 교체해주고 태그 숫자를 줄이니 해결되었습니다.

 

- 기타 문제가 되는 페이지의 html 소스를 검토해서 미심쩍은 부분을 수정해 주고, 문제를 파악하기 힘든 부분은 모바일에서 해당 주소를 로딩해 본다던지 하면서 검토하다보면 대부분은 문제가 되는 부분을 인식할 수 있었습니다.

결론적으로 모바일 친화성 오류의 대부분은 본문 내용중에 가로면으로 텍스트 내용이 나가려고 할 경우에 문제가 되는 것 같았습니다.

예를 들자면 위에서도 언급한 가로로 긴 도표, 가로로 길게 나가려는 단어가 있는 태그 목록 등입니다.

 

- 모바일 친화 에러 숫자가 많다면 일단 전체적인 설정 광고 갯수라던가 무리한 광고갯수 또는 비정상적인 화면비율 등의 블로그 전체에 일괄적용되는 옵션중에서 의심가는 옵션을 일반적인 설정으로 변경하신뒤 구글 콘솔에서 모바일 편의성 유효성 검사를 재요청을 하면서 에러의 숫자를 줄여가는 것이 좋다고 생각합니다. 

 

모바일 친화성 오류가 심각한 오류라고 보기에는 무리가 있지만 로딩 속도를 떨어트려 결국은 해당 페이지에 대한 접근을 어렵게 만들기 때문에 블로그 지수에 좋지 않은 것만은 확실할 것 같습니다.

그렇다고 너무 민감하게 반을해야 할 정도의 문제는 아니고 내보내기를 통해서 엑셀파일로 다운로드한 뒤 엑셀의 테이블탭에 열거되어 있는 문제된 페이지들을 실제 모바일 화면으로 오류가 있는지 확인할 필요는 있습니다.

 

 

이 과정에서 모바일로 보는데에 특이점이 없다면 그냥 놔두셔도 문제가 없습니다.

실제 문제가 없는 페이지들은 구글 콘솔의 문제 페이지 목록에서 시간이 지나면 스스로 사라질 것입니다.

이 오류에 대한 개인적인 의견은 가능하면 문제된 페이지를 체크하여 실제로 모바일화면에서 문제가 발생하는 페이지들은 문제를 해결하고 넘어가는 것이 좋긴 하지만 이상이 없이 출력되는 페이지들에는 구글 콘솔의 오류 메시지에 너무 연연할 필요는 없다 입니다.