프로그레시브 웹 앱(PWA)이 SEO에 도움이 되나요? (통계 및 예 포함)

모바일 장치와 함께 제공되는 앱에 점점 더 집착하는 세상에서 Google Alex Russell의 선임 소프트웨어 엔지니어는 "웹 콘텐츠와 앱 사이의 경계를 흐리게"하는 것을 목표로 하는 경험을 만드는 것이 합리적입니다.

지난 몇 년 동안 몇 가지 사항이 매우 명확해졌습니다. 온라인에서 비즈니스를 운영하고 있다면 비즈니스를 모바일 우선으로 만들어야 합니다 . 둘째, 모바일 경험을 달러로 환산하려면 매끄럽고 마찰이 없어야 합니다. 마지막으로 스마트폰 사용자는 매우 변덕스럽고 2018년에 1,130억 개 이상의 앱을 다운로드했음에도 불구하고 사용자는 여전히 하루에 약 9개의 앱만 정기적으로 사용합니다.

따라서 모바일에 있어야 합니다. 모바일에서는 멋있어야 합니다. 그리고 사람들은 앱을 정기적으로 다운로드하여 사용하지 않을 것입니다.
예, 프로그레시브 웹 앱 또는 PWA 에 대해 이야기하고 있습니다.

프로그레시브 웹 애플리케이션은 온라인 마케팅에 대한 큰 약속을 제공하기 때문에 검색 엔진 최적화 군중에게 인기가 있습니다.

위의 질문과 관련하여 예, Progressive Web Apps는 SEO에 도움이 됩니다. 그러나 PWA가 SEO에 어떻게 좋은가요? 이 기사에서 알아보자.

PWA 란 무엇입니까?

가장 간단한 말로 PWA는 앱처럼 작동하지만 사용하기 위해 다운로드할 필요가 없는 모바일 친화적인 웹사이트입니다. 사용자는 PWA를 휴대폰에 저장하고 앱처럼 실행할 수 있지만 완전히 선택 사항입니다.

모바일 사이트와 모바일 앱을 동시에 구축 및 유지 관리하는 고유한 단점을 극복하면서 PWA가 가져오는 모든 특혜가 있습니다.

이 기사를 통해 PWA의 정의와 멋진 기능에 대해 더 자세히 알아볼 수 있습니다 . 프로그레시브 웹 앱에 대해 알아야 할 모든 것”

PWA의 4가지 핵심 기술

이 모든 것은 PWA가 작동하는 데 필요한 네 가지 기술 덕분에 가능합니다.

1. 웹 앱 매니페스트 파일(홈 화면 액세스 허용)
2. 서비스 워커(오프라인 지원용)
3. TLS(전송 계층 보안)(프라이버시 및 데이터 무결성 보장)
4. 애플리케이션 셸 아키텍처(빠른 로딩 시간 허용)

네이티브 앱 및 반응형 웹사이트와 달리 프로그레시브 웹 앱은 다음과 같은 많은 이점을 제공합니다.

Google은 PWA 사이트를 크롤링합니까?

프로그레시브 웹 앱은 JavaScript의 유연성을 활용합니다. 즉, Google은 게시된 단일 페이지를 JavaScript 사이트로 간주합니다. PWA에 대한 새 URL이 생성될 수 있으므로 Googlebot은 웹에 게시된 다른 페이지와 마찬가지로 페이지를 크롤링합니다.

Google은 AJAX 또는 JavaScript 사이트를 크롤링하는 것처럼 PWA 사이트를 크롤링하지만 '크롤링 가능성'에 잠재적으로 영향을 줄 수 있는 몇 가지 문제가 있습니다. 따라서 개발자는 페이지가 적절하게 색인이 생성되도록 사이트를 최적화하는 방법을 알고 있어야 합니다.

프로그레시브 웹 앱에 대한 Google의 SEO 권장 모범 사례

Google의 John Mueller는 2016년 3월에 Google이 PWA 및 JavaScript 사이트를 일반적으로 처리하는 방법에 대한 자세한 업데이트를 제공했습니다.

게시물에서 그는 다음을 강조합니다.

• Googlebot에게 은폐하지 마세요. 모든 사용자가 콘텐츠에 액세스할 수 있도록 개발자가 기능 감지 및 점진적 향상 기술을 사용하는 것이 중요합니다. 또한 지원되지 않는 브라우저 페이지로 리디렉션하는 것도 좋지 않습니다.
• 중복 콘텐츠 위반에 대한 책임이 없도록 여러 URL에서 콘텐츠를 제공할 때 rel=canonical을 사용합니다.
• 새 사이트에서 AJAX-크롤링 체계를 피하십시오.
• Googlebot은 '#'이 있는 URL의 색인을 생성하지 않습니다. 많은 프로그레시브 웹 앱은 URL 구조에 해시 기호를 사용합니다. 즉, 검색 엔진이 # 이상의 모든 것을 삭제합니다. 이 문제를 해결하는 유일한 방법은 기존 SEO 규칙을 사용하여 URL 구조를 구현하는 것입니다. 이것은 일부 사이트와 회사에 까다로울 수 있지만 앞으로 나아가는 데 필요한 단계입니다.
• Googlebot이 페이지를 어떻게 보는지 테스트합니다. Google Search Console의 Fetch 및 Render 도구를 사용하여 Google에서 보는 것과 동일한 방식으로 사이트를 볼 수 있습니다.
• 필수 리소스가 robots.txt에 의해 차단되지 않았는지 확인하세요.
• 페이지에 포함된 리소스 수(특히 페이지를 렌더링하는 데 필요한 JavaScript 파일 수)는 완전히 로드되지 않을 수 있으므로 줄이십시오.
• Accelerated Mobile Pages(AMP)를 사용할 때 정확한 사이트맵 파일을 사용하여 웹사이트의 변경 사항을 알립니다.
• 콘텐츠에 액세스하는 일부 검색 엔진 및 웹 서비스 공급자는 JavaScript를 지원하지 않거나 다른 하위 집합을 지원할 수 있습니다.

또한 Lighthouse는 PWA와 관련하여 Google에서 제공하는 유용한 도구입니다. 이 도구는 웹 앱의 품질을 향상시키기 위해 Google에서 만들었습니다. 이 도구는 웹 앱이 PWA가 될 준비가 되었는지 보여줍니다. 이 애플리케이션에 웹사이트를 추가하면 Lighthouse는 네 가지 기준으로 웹사이트를 측정하고 웹 앱의 속도를 높이기 위해 해결해야 하는 문제를 보여줍니다.

이것이 바로 프로그레시브 웹 앱이 SEO를 돕는 방법입니다.

PWA가 자연 검색 프로필 을 크게 향상시킬 수 있다는 것은 사실입니다.

어떻게?

경쟁사보다 더 나은 사용자 경험을 제공합니다. 적어도 프로그레시브 웹 앱으로 업그레이드하기 전보다는 나아졌습니다. 훌륭한 사용자 경험 을 제공할 때 사람들은 경쟁 옵션보다 귀하의 사이트를 방문하기를 원합니다. 그들이 결과에서 당신의 브랜드를 볼 때 그들은 당신이 그들이 원하는 것을 줬고 그 경험은 긍정적이었다는 것을 기억할 것입니다.

SEO는 클릭률이 검색 순위 에 영향을 미친다는 것을 알고 있습니다. 검색자가 결과에 대해 더 많은 클릭 또는 투표를 하면 시간이 지남에 따라 결과가 올라갑니다.

그러나 그것은 측정할 수 있는 하나의 지표일 뿐입니다. 사이트를 최고로 만들기 위해 하는 모든 작은 일들이 정보를 뛰어 넘는 경험을 만듭니다. 이것은 SERPS 에 간접적으로 그리고 직접적으로 영향을 미치며 일반적으로 긍정적인 방향으로 영향을 미칩니다.

더 빠른 사이트 속도

이것은 의심할 여지 없이 PWA의 가장 흥미로운 기능 중 하나입니다. 기업은 미리 콘텐츠 캐싱, 압축 등과 같은 모바일 개발 모범 사례를 사용하여 느린 데이터 연결을 사용하는 사용자 또는 PWA를 사용하여 오프라인 상태인 사용자를 대상으로 할 수 있습니다.

사이트 속도에 관심을 가져야 하는 이유는 무엇입니까? SEO에 직접적인 영향을 미치기 때문에

Google의 속도 테스트가 한 달도 채 안 되어 시행됨에 따라 PWA의 가장 큰 장점은 다른 모바일 플랫폼 및 기본 앱과 비교할 때 더 빠른 속도일 것입니다. 그리고 더 빠른 사이트를 요구하는 것은 Google뿐만이 아닙니다. 바로 귀하의 사용자입니다! 대부분의 사용자는 로드하는 데 3초 이상 걸리면 모바일 사이트를 포기합니다. (여기서 사이트 속도를 확인하고 자신에게 호의를 베풀어 보세요!) 사이트 속도가 빠르지 않으면 사라집니다.

Forbes는 PWA로 전환한 후 모바일 로드 속도를 3-12초에서 0.8초로 줄이면서 엄청난 속도 향상을 보았습니다! 따라서 귀하의 브랜드가 Google 검색 목록의 상단에 최대한 근접하도록 하려면 PWA를 귀하의 브랜드가 모바일 전략의 첫 번째 선택으로 삼을 때입니다.

더 나은 참여

Google은 웹사이트가 프로그레시브 웹 앱 자격을 얻기 위해 충족해야 하는 기본 요구 사항을 지시합니다. 쉬운 탐색, 시기 적절한 푸시 알림, 브라우저 간 호환성, 모든 장치에서 반응하는 페이지를 포함한 부드러운 사용자 경험은 참여 증가로 이어지는 몇 가지 중요한 요구 사항입니다.

PWA는 놀라운 방식으로 실제 모바일 앱을 모방할 수 있습니다. PWA를 사용하면 여전히 홈 화면에 저장할 수 있는 옵션이 있습니다. 홈 화면에서 앱처럼 기기에 아이콘으로 표시되지만 앱 스토어 다운로드 프로세스를 거칠 필요는 없습니다. 그리고 다운로드가 없기 때문에 PWA는 기본 모바일 앱보다 훨씬 적은 스토리지를 필요로 합니다. Starbucks는 자체 기본 앱 크기의 0.4%인 PWA를 만들었습니다! 또한 콘텐츠 업데이트는 새로 고침 시 자동으로 발생하므로 사용자는 손가락 하나 까딱하지 않고도(또는 성가신 "업데이트 설치" 버튼을 누르지 않고도) 최신 기능, 보안 업데이트에 액세스할 수 있습니다.

 추천 자료: PWA vs. 네이티브 앱: 어느 것이 더 잘 어울리나요?

이제 휴대전화에서 앱을 사용하면 Forbes 잡지가 자체 PWA를 출시할 때 경험한 것처럼 상호 작용 및 참여의 기회가 기하급수적으로 높아집니다. 사용자는 푸시 알림을 통해 새 콘텐츠를 사용할 수 있을 때마다 알림을 받았습니다. 번개처럼 빠른 페이지 로드 시간, 빠른 전환 및 가벼운 페이지 디자인을 통해 Forbes의 PWA는 다음을 달성했습니다.

• 스크롤 깊이 3배 증가
• 사용자당 세션 43% 향상
• 기사를 완성하는 독자 수 6배 증가
• 참여율을 두 배로 늘리면 참여율이 100% 증가합니다.

Forbes와 같은 게시 사이트의 경우 새로운 PWA 덕분에 높은 참여도는 높은 전환율과 동일합니다.

세션 시간, 클릭률 및 이탈률과 같은 웹사이트 참여 측정항목이 검색 순위에 직접적인 영향을 미친다는 것을 알고 있습니다. Larry Kim이 여기에서 설명하는 것처럼 사이트에 머문 시간은 자연 검색 순위와 확실한 상관관계가 있습니다. 세션 시간이 길수록 Google에서 귀하의 순위가 높을 수 있습니다.

PWA와 우수한 웹사이트 참여율 덕분에 Google의 첫 페이지에 인사를 드릴 수 있습니다.

URL에 관한 모든 것

프로그레시브 웹 앱은 모든 의미에서 SEO 모범 사례를 진정으로 수용합니다. 명확하고 간결한 메타 설명에서 검색 봇에 의한 사이트 데이터의 더 나은 인덱싱 및 구문 분석을 위한 Schema.org 데이터 추가에 이르기까지; 검색에 최적화된 웹사이트는 다른 웹사이트보다 PWA를 줄일 가능성이 더 큽니다.

PWA는 모바일 장치에서 뛰어난 경험을 제공하기 위해 다른 "mobile.site.com" 유형의 URL이 필요하지 않습니다. 장치에 관계없이 일관된 경험을 제공하도록 자동으로 구성됩니다.

또 다른 보너스는 PWA가 반드시 HTTPS를 활성화해야 한다는 것입니다. 이렇게 하면 자연 검색 결과에서 사이트가 향상될 뿐만 아니라 이탈률, 클릭률 및 전환율을 높이는 사이트 보안에 대해 사용자를 안심시킬 수 있습니다.

각 페이지에는 고유한 URL이 포함되어 있어 깊이 포함된 페이지라도 검색 엔진에서 쉽게 크롤링하고 검색할 수 있습니다. 또한 각 페이지의 고유한 URL을 사용하면 소셜 미디어 및 기타 사이트에서 페이지를 훨씬 쉽게 공유할 수 있을 뿐만 아니라 투명하게 추적할 수 있습니다.

서비스 워커를 사용하여 사전 캐싱을 수행하면 기기가 오프라인일 때도 PWA의 모든 URL이 로드됩니다. 이를 통해 구형 장치나 네트워크 연결이 불량한 사용자에게 권한을 부여합니다.

포장하기

프로그레시브 웹 애플리케이션은 최고의 웹 경험을 제공하기 위한 것이기 때문에 SEO에 적합합니다. 그러나 다른 모든 것과 마찬가지로 개발자와 마케터는 문제를 망칠 수 있습니다.

웹의 모범 사례를 따르면 훌륭한 자연 검색 트래픽의 이점을 얻을 수 있습니다. 이것은 귀하의 사이트를 모바일 우선으로 만들고, 모바일에서 빠르고, 모든 화면 크기에서 사용할 수 있고, 페이지 SEO에서 사운드를 제공해야 함을 의미합니다.

PWA는 고객과 오래 지속되는 관계를 구축하는 데 도움이 됩니다. 이는 큰 보상이지만 귀하의 사이트는 사용자 경험을 최우선으로 하기 때문에 자연 검색과 같은 보편적인 상승도 경험하게 될 것입니다.

이러한 모범 사례를 모두 따르면 자연 검색 트래픽을 대상으로 하지 않더라도 성공할 수 있습니다.

이러한 신호를 포착하고 모바일 웹의 용이성과 모바일 앱의 속도 및 사용자 친화성을 결합한 PWA에 투자할 시간입니다. 하나의 가격에 두 개는 PWA로 얻을 수 있는 것입니다. 그래서 언제 지을 예정입니까?