본문 바로가기
블로그

모바일 사용 편의성에서 콘텐츠 폭이 화면 폭보다 넓음 수정- 구글 서치 콘솔

by PAN'S 2022. 12. 16.

Google Search Console 경고로 가끔 모바일 사용 편의성의 '콘텐츠 폭이 화면 폭보다 넓음' 메시지가 뜰 때가 있습니다. 이럴 때 모바일 친화적으로 포스팅 수정하는 방법을 말씀드리려 합니다. 메시지 원인은 포스팅내 사진이나 기타 콘텐츠가 넓이가 맞지 않아서 발생합니다.

 

 

1. 모바일 사용 편의성에서 "콘텐츠 폭이 화면 폭보다 넓음" 수정 방법

SNS를 하다 보면 흔히 나타내는 메시지 중 하나입니다. 모바일 사용자들이 편하게 볼 수 있는 화면이 구성이 되지 않아 나타나는 일종의 수정 메시지라고 생각하시면 됩니다. 수정하는 방법은 크게 어렵지 않고 자신의 사이트나 블로그에서 해당 포스팅 내의 사진 또는 콘텐츠의 사이즈를 수정해주시면 됩니다.

 

2. 콘텐츠 폭이 화면 폭보다 넓다는 의미

내 사이트나 블로그의 화면 크기가 다른 화면 크기와 맞게 구성이 되어 있지 않다는 말입니다. 즉 포스팅내 사진이나 콘텐츠의 넓이가 넓으니 줄이라는 경고입니다. 아래 수정 방법이니 참고하세요. 티스토리 기준으로 설명을 드리죠.

 


3. 수정 방법

수정하는 방법에는 크게 두가지가 있습니다. 직접 블로그 페이지를 수정하는 방법과 HTML, CSS를 수정하는 방법이 있습니다. 만약 HTML, CSS를 수정하는 분들이라면 이곳을 참고하시고, 직접 티스토리 블로그를 수정하시려면 아래를 참고하면 됩니다.

 

오류 페이지 접근 방법

구글 서치 콘솔에 접속을 합니다. 그리고 아래 이미지 순서대로 클릭하여 3번 '콘텐츠 폭이 화면보다 넓음'을 클릭하면 해당 오류 페이지 내역에 접근이 가능합니다.

오류 페이지 접근 방법
오류 페이지 접근 방법

 

티스토리 오류 페이지에 목록에 접근하여 페이지를 확인합니다.

 

목록에 마우스를 올리면 해당 페이지로 이동이 됩니다.

오류 목록
오류 목록

 

수정할 페이지로 이동, 마우스를 올리면 바로 갈 수 있는 아이콘이 표시가 됩니다.

수정할 티스토리 페이지 이동
수정할 티스토리 페이지 이동

먼저 티스토리에 로그인 하세요. 그리고 티스토리 수정할 페이지로 이동했으면, 아래 티스토리 수정하는 방법에 따라 수정을 해주시면 됩니다.

 

티스토리 수정하는 방법

자신의 티스토리 블로그 해당 글에서 사진 사이즈를 수정합니다.

  • 권장하는 사진 사이즈는 750~800 pixel을 하시면 됩니다. 사진 사이즈를 수정하는 이유는 구글이 큰 용량이 많은 큰 사진을 싫어하기 때문에 그렇습니다. 용량이 적으면서 사진 품질은 좋은 것을 구글이 원하죠. 대부분 사진을 수정하면 되는데, 만약 사진을 수정해도 오류가 수정이 안된다면 그때는 광고 배치, 그리고 글의 구성도 한번 점검을 해주세요. 대부분 이 정도면 수정이 될 것입니다.

 

4. 수정 후 확인

확인방법은 '모바일 친화성 테스트'에서 하시면 됩니다.

URL 테스트

오류가 발생한 페이지의 사이트 주소를 URL 입력하는 창에 입력 후, 'URL 테스트' 버튼을 누르면 됩니다. 

테스트 결과
테스트 결과

모바일 지원 테스트 결과 '모바일 지원 페이지'라고 표시가 되면 '콘텐츠 폭이 화면 폭보다 넓음' 수정이 완료된 것입니다.