SEO를 개선하기 위해 페이지 속도를 높이세요

게시 됨: 2020-11-19

올해의 Found Conference에서 당사 CEO인 Ray Grieselhuber 는 가독성을 위한 디자인의 중요성에 대해 말했습니다 . 사용자는 일반적으로 사이트에 도달하기 전에 일종의 목표를 가지고 있습니다. 즉, 방문 페이지에 도달하기 전에 무언가를 검색하고 있으며, 해당 사용자의 의도와 일치시키려는 것입니다. 또한 콘텐츠를 기다리고 싶지 않습니다. 즉각적인 경험에 대한 사용자의 기대로 인해 페이지 속도를 높이는 것은 SEO의 중요한 부분입니다.

페이지 속도와 순위를 동시에 향상

Google은 사이트 속도를 사이트 를 구성하는 모든 페이지의 속도로 정의하고 페이지 속도는 사이트의 개별 페이지 속도로 정의합니다. 사이트 속도는 사이트의 모든 페이지를 기반으로 하므로 전체 사이트 속도를 향상시키려면 전체 또는 대부분의 페이지에서 로드 시간을 개선해야 합니다. Google은 페이지가 2.5초 이내에 로드되어야 한다고 말합니다.

순위의 한 요소로서의 속도는 새로운 것이 아닙니다. Google은 최소 2010년부터 데스크톱 검색의 순위 요소로 이를 사용했습니다. 2018년에 검색 엔진은 페이지 속도를 모바일 검색의 순위 요소로 만드는 The Speed ​​Update 를 발표했습니다 . 이 발표에는 페이지 속도가 이탈률에 영향을 미치며 사용자가 계속 머물고 싶은 콘텐츠에 빠져들게 하는 것이 타당한 이유가 포함되어 있습니다. 심지어 페이지 로드 시간이 3초를 초과할 경우 이탈 가능성이 극적으로 증가한다는 연구 결과도 인용했습니다.

Search Engine Watch에서는 페이지 속도가 순위와 약간만 상관관계가 있다고 말하지만 특정 사용자 행동과 매우 높은 상관관계가 있으며 이러한 행동은 순위에 확실히 영향을 미칩니다. 다시 말하지만, 사용자는 자신이 찾고 있는 것이 무엇인지 알고 있으며 느린 사이트는 사용자의 기대를 충족시키지 못합니다.

페이지 속도 향상 및 사용자 기대 개선

Ray는 페이지 속도, 로드 시간 및 렌더링 시간이 모두 사용자를 페이지에 유지하는 데 중요한 요소라고 말합니다. "로드하는 데 몇 초 이상 걸리면 해당 페이지에서 얻을 수 있는 가치에 대한 기대치가 매우 빠르게 상승합니다."라고 그는 말합니다.

낮은 품질의 페이지 콘텐츠를 기다리는 것은 사용자를 실망시킬 수 있습니다. 2010년대 초반의 한 연구에 따르면 당시 웹 디자이너는 좋은 첫인상을 남기는 데 50밀리초가 소요되었습니다 . 물론 그 숫자는 사이트, 장치 및 사용자에 따라 다를 수 있지만 인간은 순간적으로 판단하도록 설계되었습니다. 사용자는 사이트와 상호 작용할지 여부를 거의 즉시 결정하고 재방문을 결정할 때 해당 정보를 저장합니다.

로드 시간이 느리다는 것은 사용자가 판단할 것이 없고 사이트에서 이탈할 수 있음을 의미합니다. 반대로 페이지 속도가 빨라지면 사람들이 사이트에 머무를 수 있을 뿐만 아니라 방문자가 사이트에 도착하면 참여도가 높아집니다. Google과 Deloitte의 한 연구에 따르면 로드 시간이 100밀리초라도 개선되면 사용자 행동에 심각한 영향을 미칠 수 있습니다. 페이지 속도가 0.1초 증가하면 최대 10%의 전환율 증가와 일치합니다.

로드 시간을 단축시키는 문제를 해결하십시오.

느린 로드 시간은 콘텐츠 문제가 아니라 기술적인 문제일 수 있습니다. 따라서 페이지 속도를 높이려면 개발 팀(있는 경우)을 끌어들이거나 백엔드 문제에 대한 지식을 다듬어야 할 수 있습니다.

첫 번째 단계: 현재 위치를 파악합니다. Google의 내 사이트 테스트 기능을 사용하면 사이트 속도를 테스트할 수 있으며 로드 시간이 2.5초 이상인 경우 권장 수정 사항을 표시합니다. 내 사이트 테스트는 사이트에 대한 최상의 개선 사항을 불러오는 맞춤형 제안도 제공합니다. 이러한 수정 사항에는 다음이 포함될 수 있습니다.

  • 재 방문 사용자의 로드 시간을 단축하기 위한 HTTP 캐싱 . 브라우저는 스타일시트, 이미지 등을 캐시하여 재방문 사용자가 전체 페이지를 다시 로드하지 않도록 할 수 있습니다. 여기 에서 해당 주제에 대한 Google 가이드를 확인 하세요.
  • 이미지 크기 조정 . 이미지가 필요한 것보다 크지 않은지 확인하십시오. 사이트의 모든 페이지에 고화질 사진이 필요한 것은 아닙니다! 사이트의 디스플레이 크기에 맞게 이미지 크기를 조정합니다. 그리고 형식이 올바른지 확인하십시오(PNG 또는 JPEG로 작동하지만 WebP 이미지가 더 좋습니다).
  • 리디렉션 줄이기 . 페이지가 다른 페이지로 리디렉션될 때마다 사용자는 추가 대기 시간에 직면하게 됩니다. 목적에 맞는 URL을 만드세요. 가능하면 m-dot 페이지나 단축해야 하는 긴 URL을 사용하지 마세요.
  • JavaScript, CSS 및 HTML 축소 . 축소는 파일을 실행하는 데 필요하지 않은 모든 데이터의 코드 파일을 제거합니다. 기본적으로 코드 주석과 사용하지 않는 코드를 제거하고 더 짧은 함수 이름을 사용하는 등입니다. 이것은 수동으로 하고 싶지 않은 일이지만 이 프로젝트에 도움이 되는 많은 도구와 리소스를 사용할 수 있습니다.
  • 대용량 CSS, HTML 및 JavaScript 파일 압축 . 파일 크기를 줄이고 원본 파일 속성을 유지할 수 있는 압축 알고리즘인 Gzip을 사용해 보십시오 .
  • 서버 응답 시간 감소 . 페이지 로드의 가장 큰 요인 중 하나는 브라우저가 DNS 또는 도메인 이름 시스템을 검색하는 데 걸리는 시간입니다. 일부 DNS 공급자는 다른 공급자보다 빠르므로 DNS 공급자를 전환하는 것이 좋습니다.
  • 더 나은 호스팅 옵션 선택 . 저렴한 호스팅 옵션은 일반적으로 공유 호스팅(귀하의 사이트를 다른 사이트와 동일한 서버에 유지)을 사용합니다. 즉, 귀하의 사이트 또는 동일한 서버에서 호스팅되는 다른 사이트로의 트래픽 급증으로 인해 로드 시간이 느려질 수 있습니다. VPS 호스팅(사이트를 위해 서버 리소스의 특정 부분을 예약함) 또는 전용 서버를 살펴보고 싶을 수 있습니다.

사이트를 자주 다시 테스트하고 페이지 속도가 개선되었는지 확인하십시오. 기본 성능을 설정하여 로드 시간을 줄이기 위해 수행하는 작업의 효율성을 확인할 수 있습니다. 사이트 감사 전략은 페이지 속도 향상을 위해 확인해야 하는 현재 상황과 빈도를 결정하는 데 도움이 될 수 있습니다.

더 나은 페이지 속도와 UX를 위해 AMP 사용

AMP 또는 Accelerated Mobile Pages를 사용하면 사이트 전체에서 페이지 성능을 높일 수 있습니다. AMP는 더 빠르고 원활하게 로드되는 모바일 환경을 제공하는 오픈 소스 HTML 프레임워크입니다. 고급 모바일 페이지는 표준 HTML 페이지를 페이지의 축소된 버전으로 리디렉션하여 사이트를 방해할 수 있는 일부 코드를 잘라냅니다. AMP는 Facebook Instant Articles 및 Apple News를 통해 즉시 로딩 페이지에 대한 Google의 경쟁자로 출발했습니다. 오늘날 여러 플랫폼에서 AMP를 지원하고 있으며 이미 지원하고 있을 수도 있습니다. 그렇지 않은 경우 페이지 속도를 줄이기 위해 사용하는 것이 좋습니다.

AMP는 로딩 시간을 줄이기 위해 7가지 주요 요소를 사용한다고 말합니다. 여기에는 다음이 포함됩니다.

  • 비동기 JavaScript만 실행하여 콘텐츠 차단 스크립트를 줄입니다. AMP의 스크립트와 구성요소는 모두 동시에 로드되므로 한 스크립트가 다른 스크립트를 기다리지 않습니다.
  • 자산 독립적인 레이아웃은 리소스를 로드하는 데 필요한 시간을 줄입니다. 이미지, 광고 또는 iframe과 같은 외부 리소스는 리소스가 다운로드되기 전에 AMP가 각 요소의 크기와 위치를 결정할 수 있도록 HTML에 크기를 명시해야 합니다.
  • CSS는 최적화되고 부풀려져 있습니다. 서버는 전체 라이브러리가 아니라 몇 개의 스타일시트만 로드해야 합니다. 이것을 좋은 CSS 위생이라고 생각하십시오.
  • 웹 글꼴이 최적화되고 다시 페이지의 나머지 부분과 비동기식으로 로드됩니다.
  • 스타일 및 레이아웃 재계산은 매우 제한적입니다. 대부분의 페이지는 브라우저에 레이아웃을 조금씩 제공하지만 AMP는 모든 레이아웃을 미리 제공합니다.
  • 애니메이션은 CPU가 아닌 GPU에서 실행되므로 컴퓨터에서 렌더링하는 데 드는 노력이 줄어듭니다.
  • AMP는 리소스 로드를 우선시합니다. AMP는 가장 중요한 리소스인 스크롤 없이 볼 수 있는 부분의 텍스트를 먼저 다운로드합니다.

네, 그렇습니다. 이 7가지 요소는 매우 복잡합니다. 교훈은 다음과 같습니다. AMP는 사이트의 더 빠르고 가벼운 버전을 만듭니다. 그 버전은 더 빨리 로드되고 더 나은 UX를 제공합니다. 그리고 모바일에서 성능을 높이고 싶다면 확인해야 합니다.

정보에 대한 사용자의 액세스를 느리게 하는 요소를 제거합니다.

속도는 로드 시간에 관한 것만이 아닙니다. 느린 사용자 경험을 만들 수 있는 사이트의 다른 요소를 고려하십시오. 제안, 주도적 생성 전면 광고 및 기타 팝업은 종종 클릭률 관점에서 좋은 성과를 보이지만 페이지 콘텐츠에 대한 사용자의 액세스를 느리게 합니다. 개발 관점에서 팝업은 수많은 클릭과 전환을 유도한다는 점에서 "모범 사례"일 수 있습니다. 그러나 그 프로와 명백한 단점을 비교하십시오. 팝업은 성가신 것입니다.

Ray는 페이지 속도, 로드 시간 및 렌더링 시간이 모두 사용자를 페이지에 유지하는 데 중요한 요소라고 말합니다. 페이지에 도달하는 데 몇 초 이상 걸리면 사용자는 해당 페이지에서 절대적인 금을 기대하고 의도와 완벽하게 일치하지 않는 것은 실망할 것입니다. 사용자에게 훌륭한 콘텐츠를 제공하세요. 사용자가 적시에 해당 콘텐츠에 접근할 수 있도록 하세요.

시작하기 위해 페이지 속도 감사가 필요하십니까? 지금 디스커버리 전화를 예약 하거나 이 양식을 작성해 주시면 시작하겠습니다.