웹 사이트에서 모바일 사용자를 리디렉션하는 방법
m.facebook.com 바탕 화면에? 그것을 시도,당신은 사이트가 큰 화면에 이상한 보이는 것을 볼 수 있습니다.
마찬가지로 모바일에서 임의의 로컬 웹 사이트를 열어보십시오. 당신은 모바일에 최적화되지 않은 일부 사이트에 걸쳐 올 수 있으며,따라서 첫눈에 당신을 던졌습니다. 이러한 사이트는 경쟁 업체에 모바일 관객을 잃는 경향이있다. 반응형 웹 디자인
요즘에는 반응형 디자인을 사용하여 웹 사이트를 구축할 수 있으며,이는 화면 크기에 따라 달라집니다.
웹사이트가 다른 기기에 어떻게 나타나는지 검토하는 것이 중요합니다.
또한 구글이 모바일 퍼스트 인덱싱으로 이전했기 때문에 웹 사이트의 모바일 버전이 구글에게 중요하므로 방문자가 나쁜 사용자 경험을 하게 되면 검색 성능이 좋지 않을 수 있다는 것을 의미합니다.
모바일 웹 사이트
점점 더 흔해지고 있지만 일부 기업은 여전히 모바일 사용자를 위해 별도의 웹 사이트를 선호합니다. 이것은 쉽게 피할 수 있는 잠재적인 문제의 제비에 온다.모바일 친화적 검색 엔진 최적화 검사기
당신은 당신의 웹 사이트가 모바일에 대한 제대로 설치되었는지 확인할 수 있습니다 무료 우리 은행 리뷰를 실행하여.
별도의 모바일 웹 사이트 경로를 추락 할 때 모바일 사용자를위한 훌륭한 모바일 브라우징 경험을 보장하기 위해주의해야 할 두 가지 중요한 사항이 있습니다:
- 뛰어난 사용자 경험을 제공하는 모바일 웹 사이트 만들기
- 모바일 사용자를 위해 사이트 리디렉션
물론 반응형 웹 디자인 도구를 사용하여 만든 모바일 웹 사이트가 있다면 모바일 방문자를 리디렉션하는 것에 대해 걱정할 필요가 없습니다.
모바일 웹 사이트 리디렉션
별도의 모바일 웹 사이트를 만들지 만 올바른 방식으로 모바일 사용자에게 리디렉션하도록 구성하지 않으면 모바일 웹 사이트를 만드는 데 드는 모든 시간과 노력이 낭비됩니다.
따라서 오늘 우리는 모바일 사용자를 모바일 사이트로 리디렉션 할 수있는 다양한 방법에 대해 논의 할 것입니다. 리디렉션은 별도의 모바일 웹사이트가 있는 경우에만 적용됩니다.
모바일 사이트로 리디렉션하려면 어떻게 해야 합니까?
이제 모바일 사용자를 모바일 웹 사이트로 리디렉션하는 방법을 배우려고 했으므로 리디렉션이 어떻게 작동하는지 설명해 보겠습니다.
데스크톱 사용자를 위한 데스크톱 브라우저와 모바일 사용자를 위한 모바일 브라우저가 있습니다. 이 두 브라우저 유형은 웹 사이트가 거주하는 웹 서버에’사용자 에이전트’형태로 데이터를 보냅니다. 이’사용자 에이전트’에는 웹 서버에 브라우저가 열리는 장치 유형을 알려주는 정보가 포함되어 있습니다. 이 정보에는 브라우저 이름,버전 및 운영 체제에 대한 기타 정보가 포함됩니다.
detectmobilebrowser.com.너가 거기서 보는 정보는 너의 웹사이트가에서 접근되고 있는 모든 이동할 수 있는 장치에서 너의 웹 서버에 보내지는 정보에 약간 유사하다.
‘사용자 에이전트’탐지 방법 외에 모바일 사용자를 탐지하는 데 도움이 되는 요소가 하나 더 있습니다. 그 요인은 화면 해상도입니다. 그러나 최신 장치의 경우 더 작은 스마트 폰 화면의 경우 화면 해상도가 더 높습니다. 따라서 사용자 에이전트 요소는 모바일 사용자를 식별하는 데 사용되는 가장 일반적인 방법입니다.
이제 모바일 사용자를 위해 사이트에 리디렉션을 적용 할 수있는 다양한 방법에 대해 이야기 해 보겠습니다.이 메서드는 다른 메서드(예:자바 스크립트)를 사용하여 수행 할 수 있습니다.워드프레스 또는 줌라와 같은 콘텐츠 관리 시스템을 사용하는 경우 운이 좋습니다. 모바일 사용자를 모바일 웹 사이트로 리디렉션하는 데 도움이되는 기성품 플러그인이 있습니다.
이러한 모바일 리디렉션 플러그인 중 일부는 다음과 같습니다:
워드프레스–모바일 간단한 URL 로 리디렉션,워드 프레스 휴 팩
Joomla–간단한 모바일 탐지
젠토–리디렉션 URL
Drupal–간단한 모바일 리디렉션,모바일 JS Redirect
하는 경우 웹사이트에서 만든 다른 CMS,도에 대한 Google 검색하는 데 도움이되는 플러그인으로 모바일에 대한 리디렉션에는 특정 CMS.
자바스크립트 방법
자바스크립트 코드를 사용하면 모바일 방문자를 모바일 사이트로 리디렉션할 수 있습니다. 이 코드는 화면 크기 또는 사용자 에이전트를 감지 할 수 있습니다.
화면 크기를 사용하는 코드는 다음 문서에서 찾을 수 있습니다:웹 사이트를 모바일 버전으로 리디렉션하는 방법.이 코드는 모바일 장치를 리디렉션합니다.
이 두 코드 세트를 사이트에 적용 할 수 있습니다. 그러나,이 두 가지 방법에 단점이 있습니다.
화면 크기 방법에서는 화면 해상도를 정의하지만 요즘에는 더 높은 해상도의 작은 핸드 헬드 장치 화면이 있습니다. 이 모바일 사용자의 잘못된 검출에 끝낼 수 있습니다.
사용자 에이전트 방법에서는 모든 신규 및 향후 사용자 에이전트를 추적하고 이를 코드에 추가하는 것이 어렵습니다. 많은 사용자 에이전트가 있으며 이는 기술 개발로 끊임없이 변화하고 있습니다. 예를 들어,이 광범위한 사용자 에이전트 목록을 살펴보십시오.
그리고 모두의 가장 큰 단점은 자바 스크립트가 자신의 휴대 전화에 설치되지 않은 사용자를위한 것입니다. 대부분의 휴대 전화는 자바 스크립트가 장착되어 있지만,일부는 그것을 사용하지 않도록 선택합니다. 일부 오래된 블랙 베리 모델은 자바 스크립트를 지원하지 않습니다. 이러한 장애물을 극복하기 위해 서버 측 리디렉션을 사용할 수 있습니다.이 방법을 사용하여 모바일 사용자를 리디렉션할 수 있습니다. 이 방법을 사용하는 장점은 자바스크립트로 실행되는 브라우저에만 국한되지 않는다는 것입니다. 그러나 여러 사용자 에이전트를 나열 해야 합니다.
이 스크립트가 작동하려면 페이지 확장이 있어야합니다.귀하의 호스팅 계정에 로그인하십시오. 웹 사이트의
섹션에 다음 코드를 추가합니다.
<?php $iphone = strpos($_SERVER,"iPhone"); $android = strpos($_SERVER,"Android"); $palmpre = strpos($_SERVER,"webOS"); $berry = strpos($_SERVER,"BlackBerry"); $ipod = strpos($_SERVER,"iPod"); if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "](https://s3.amazonaws.com/woocms.woorank.com/2020/05/poor-mobile-optimization.png"; } ?>
이 코드는 다음 문서에서 찾을 수 있습니다.
http://m.site.com을 모바일 사이트의 링크로 바꿉니다.
.브라우저가 지원하는 마임 유형에 따라 모바일 사용자를 모바일 웹 사이트로 리디렉션하는 또 다른 방법은 다음과 같습니다.방법. 예를 들어,브라우저 유형이 무선 마크업 언어를 포함하는 마임 유형을 지원하는 경우 브라우저는 모바일 장치에서 가져온 것입니다.
당신은 제목이 문서에서 권장 코드를 배치 할 수 있습니다 모바일 사이트로 리디렉션.이메일:
이 코드를 붙여 넣기 전에 기존 코드를 백업해야합니다.파일 이름 설치.사이트에 문제가 발생할 수 있습니다. 너가 그것을 하기 위하여 확실하지 않으면 어떻게 너자신 웹 개발자의 도움을 요청하십시요.
http://m.example.com을 모바일 웹 사이트로 바꿉니다.
새로운 미디어 방법
모바일 브라우저를 감지하는 기본 제공 방법이 있습니다. 그런 다음 브라우저 창 크기에 따라 스타일을 표시합니다. 이를 위해 별도의 모바일 사이트가 필요하지 않습니다. 하나의 웹 페이지 내에 두 개의 스타일 시트가 필요하며,첫 번째는”화면”미디어 유형(데스크톱 모니터 용)이고 다른 하나는”휴대용”미디어 유형(스마트 폰 용)입니다.
이 메서드를 구현하려면 다음 코드 집합을 붙여 넣어야 합니다.
<br /> /* Smartphones (portrait and landscape) ----------- */<br /> @media only screen<br /> and (min-device-width : 320px)<br /> and (max-device-width : 480px)<br /> /* Styles */<br />
이 코드 및 표준 장치에 대한 미디어 쿼리라는 제목의 이 페이지에서 다른 많은 변형을 찾을 수 있습니다.
이 방법을 사용하는 데는 많은 단점이 있습니다. 이 사이트에 코드 집합의 거 대 한 추가 필요 합니다. ‘휴대용’미디어 유형을 지원하고 대신’화면’디스플레이 설정으로 페이지를 렌더링하지 않는 일부 장치는 여전히있다.
따라서 위에 나열된 대로 모바일 사용자를 모바일 사이트로 리디렉션하는 방법에는 여러 가지가 있습니다. 당신은 당신의 웹 사이트의 헤드 섹션에 여러 스크립트를 배치 할 수 있습니다,예를 들어 화면 크기뿐만 아니라 사용자 에이전트를 감지 스크립트를 말한다.
하지만 당신은 당신의 모바일 리디렉션뿐만 아니라 검색 엔진 봇에 잘 작동 할 때까지 작업이 완료되지 않습니다. 특히,구글의 경우,데스크톱 링크와 모바일 링크를 구분할 수 있도록 해야 할 몇 가지 구성이 있습니다.
자세한 내용은 스마트 폰 검색 결과의 순위 변경 및 구글 지원 리디렉션 기술에 대한 정보에 대한 구글 웹 마스터 중앙 블로그를 참조하십시오.
모바일 웹 사이트에 정식 웹 사이트를 추가해야 합니다.
구글에서 웹 사이트의 모바일 페이지 위치를 검색하려면 다음 사항을 고려해야 합니다.
모바일 페이지에서 해당 데스크톱 주소를 가리키는 표준 태그를 추가합니다.
이를 통해 구글의 크롤러는 데스크톱과 모바일의 관계를 이해할 수 있다.
모바일 사용자를 위해 사이트에 적절한 리디렉션을 배치한 후에는 리디렉션이 다른 장치에서 제대로 작동하는지 테스트해야 합니다. 사용 가능한 스마트 폰 장치에서 수동으로 테스트하는 것은 그것에 대해가는 한 가지 방법입니다. 그러나 이러한 모바일 에뮬레이터를 사용하여 다른 모바일 장치에서 모바일 사이트의 올바른 렌더링을 테스트 할 수도 있습니다.
모바일 리디렉션의 올바른 사용은 모바일 웹 사이트가 검색 엔진 친화적임을 보장하는 중요한 단계입니다. 귀하의 웹 사이트가 모바일 사용자를 위해 잘 리디렉션되지 않은 경우 당신은 또한 가치있는 사업을 많이 잃을 수 있습니다. 따라서,검색 엔진 최적화뿐만 아니라 전환율의 긍정적 인 변화 모두에 대해 당신은 당신의 웹 사이트는 위의 방법 중 하나를 사용하여 모바일 사용자를위한 리디렉션 얻을 즉각적인 조치를 취해야합니다.
이 블로그 게시물은 2020 년 1 월 15 일에 업데이트되었습니다.