[네이버웹마스터 가이드] 모바일 기기 대응하기
페이지 정보
작성자 금탑 작성일 21-06-11 13:51 조회 8,845 댓글 0본문
반응형 웹
HTML 문서의 <head> 태그내에 있는 <meta> 태그를 활용합니다
<head>
<meta name="viewport" content="width=device-width">
</head>
반응형 웹은 웹 브라우저가 웹문서의 가로폭을 기기의 스크린 크기에 맞게 자동적으로 조절하는 기법입니다. 반응형 웹은 다양한 크기를 지원하는 모바일 환경에서 사용자가 페이지의 확대/축소 없이 여러분의 웹 콘텐츠를 보다 쉽게 소비할 수 있도록 도와줍니다.
별도의 모바일 URL 제공
HTML 문서의 <head> 태그내에 있는 <link> 태그를 활용합니다
여러분의 사이트가 동일한 콘텐츠에 대하여 데스크톱 사이트에 대응하는 별도의 모바일 사이트가 있다면 모바일 사이트의 페이지에 1:1로 대응되는 데스크톱 사이트의 URL을 명시적으로 지정하는 것을 권장합니다. 이 작업은 네이버의 검색로봇이 여러분의 데스크톱 및 모바일 사이트에 방문할 때 콘텐츠가 중복으로 처리되지 않도록 알려주는 역할을 합니다. 또한, 데스크톱 및 모바일 사이트 모두 웹마스터도구에 등록하여 네이버 검색로봇이 모바일 사이트의 존재를 알 수 있도록 처리해 주세요.
예를 들어 여러분이 데스크톱 사이트로 http://www.mysite.com이 있고 그와 대응하는 모바일 사이트인 http://m.mysite.com이 있다고 가정한다면 http://m.mysite.com 내의 페이지에 아래와 같이 데스크톱의 URL을 명시하는 것이 좋습니다.
모바일 사이트의 메인 페이지 - 예) http://m.mysite.com/
<head>
<link rel="canonical" href="http://www.mysite.com/">
</head>
모바일 사이트의 개별 웹 페이지 - 예) http://m.mysite.com/article/article1.html
<head>
<link rel="canonical" href="http://www.mysite.com/article/article1.html">
</head>
사이트 방문자의 웹 브라우저 환경에 맞게 자동 redirect 처리
모바일 기기에서 여러분의 데스크톱 사이트로 접근시 모바일 사이트로 redirect 처리해주세요. 마찬가지로 데스크톱에서 모바일 사이트로 접근시는 데스크톱 사이트로 redirect 처리하는 것도 고려해야 합니다. 모든 웹 브라우저는 자신만의 이름(User Agent Name)을 가지고 있으므로 기술적으로 사이트 방문자의 웹브라우저가 모바일 환경인지 데스크톱 환경인지 구분할 수 있습니다.
예를 들어 데스크톱에서 http://m.mysite.com/ 으로 접근시 http://www.mysite.com 으로 redirect 처리하며, 모바일 기기에서 http://www.mysite.com 에 접근시 http://m.mysite.com 으로 redirect 처리합니다.
사용자의 웹 브라우저 환경에 맞게 redirect 처리 시는 자바스크립트가 아닌 HTTP redirect를 사용해주시기 바랍니다. 네이버 검색로봇은 HTTP redirect는 감지하지만 자바스크립트 redirect는 경우에 따라서 감지를 못하는 경우가 있습니다. 만약, 기술적인 문제로 HTTP redirect 사용이 어렵다면 자바스크립트 redirect를 사용하시되 HTML 본문은 비워두는 것을 권장합니다.
출처 : 네이버 웹마스터 가이드
댓글목록 0
등록된 댓글이 없습니다.