WordPress 웹 사이트 속도를 높이는 방법: 성능 향상 가이드

게시 됨: 2018-05-21

속도와 내결함성은 SEO와 WordPress 사이트의 성공률에 영향을 미치는 가장 중요한 요소입니다. 인터넷에서 추가로 2-3초를 기다리는 것은 이미 영원하기 때문에 느리게 작동하면 리소스의 인기가 위협을 받습니다. 이상적인 콘텐츠(독특하고 독창적이며 유익하고 스타일이 유기적임)가 있더라도 느린 작업 사이트는 방문자를 짜증나게 하고 언젠가는 방문자를 잃을 수 있습니다.

이 포괄적인 가이드는 세계에서 가장 인기 있는 웹사이트 엔진인 WordPress를 최적화하는 데 전념했습니다. 이 엔진에 대한 다년간의 경험을 통해 내부자의 지식을 얻고 많은 사용자가 자주 묻는 질문인 WordPress 사이트의 속도를 높이는 방법에 대한 답변을 얻을 수 있었습니다. 그래서 우리는 웹 사이트 성능을 향상시키는 방법에 대한 전문가의 모든 지식을 여기에 모았습니다.

빠른 로딩 페이지는 사용자 경험과 행동 요인(사이트의 색인 생성 및 SERP에서의 위치에 유리하게 영향을 미치므로 검색 트래픽이 증가함을 의미함)을 개선하고 원하는 SEO 메트릭을 달성하는 데 도움이 됩니다.

웹사이트 최적화를 위한 이 자세한 가이드를 통해 페이지 로드 속도가 중요한 이유와 사이트 속도를 저하시키는 문제를 확인할 수 있습니다. 지금 바로 사이트 속도를 향상할 수 있도록 실용적인 단계별 가이드를 만들었습니다.

다운로드 속도가 중요한 이유는 무엇입니까?

Time과 New York Times가 보고한 수많은 연구에 따르면 사람들의 주의 집중 시간은 2000년 12초에서 오늘날에는 8초로 감소했습니다. 즉, 수족관 물고기(금붕어 평균 9초)의 집중력 수준보다 짧아졌습니다. .

웹사이트 소유자에게 이것은 무엇을 의미합니까? 사용자에게 콘텐츠를 보여주고 단골 방문자가 되도록 설득할 시간이 점점 줄어들고 있습니다. 게다가 웹 사이트가 느리면 방문자가 로드되기 전에 리소스를 떠나 더 효율적인 리소스를 찾을 가능성이 상당히 높습니다.

웹사이트의 느린 작동의 정량화할 수 있는 역효과는 무엇입니까?

Greg Linden은 Amazon의 실적 결과를 논의할 때 보고서에서 수익 창출과 관련하여 웹사이트의 페이지 로드 속도의 중요성에 주목했습니다. 그는 페이지 로딩이 100밀리초 만에 지연되면 회사 수익이 1% 감소한다는 사실을 발견했습니다. 2017년 Amazon의 매출이 1,779억 달러였다는 사실을 고려할 때, 1초 미만의 1초 미만의 사이트 속도 저하가 회사에 17억 8,000만 달러의 손실을 입힐 수 있음을 의미합니다!

Bing의 Eric Schumann은 보고서에서 서버 지연의 중요성에 대해 말했습니다. 실험을 하는 동안 그는 사이트의 페이지가 평소보다 1.5초 더 로드되면 어떻게 되는지 알아냈습니다.

실험 동안 다음 지표가 악화를 보였습니다.

  • 클릭수(-4.4%);
  • 한 고객의 소득(-4.3%);
  • 사용자 만족도 지수(-3.8%).

StrangeLoop의 연구는 미국의 주요 IT 회사(Google, AOL, Shopzilla)의 최고 관리자로부터 다음과 같은 사실을 제공합니다. 페이지 로드 1초 ​​지연은 전환율 7% 감소, 페이지 조회수 감소에 해당합니다. 11% 감소, 사용자 만족도 지수 16% 감소.

또한 검색 엔진(Google, Bing)은 이미 느린 웹 사이트에 대한 처벌을 부과하여 검색 결과 순위에서 순위를 떨어뜨리고 필연적으로 유기적 트래픽 감소로 이어집니다.

따라서 귀하의 목표가 더 많은 구독자, 트래픽을 확보하고 사이트에서 수익을 창출하는 것이라면 가능한 한 빨리 웹사이트를 만들어야 합니다.

WordPress 사이트의 로드 속도는 어떻게 확인합니까?

종종 새로운 웹마스터는 컴퓨터에서 느린 성능을 느끼지 않기 때문에 사이트 속도가 괜찮다고 생각합니다. 그것은 큰 실수입니다.

웹 사이트를 정기적으로 방문하기 때문에 최신 브라우저는 데이터를 캐시에 저장하고 자동으로 훨씬 빠르게 제공합니다. 그러나 귀하의 사이트를 처음 방문하는 사용자는 로딩에 어려움을 겪을 수 있습니다. 로드 시간에 중요한 역할을 하는 지리(방문자의 위치)를 고려하는 것이 중요합니다.

특수 도구를 사용하여 사이트 속도를 확인하는 것이 좋습니다. 최고 중 하나는 Pingdom입니다. 각 페이지 요소의 다운로드 속도에 대한 작동 및 시각적 테스트를 수행하고 어떤 요소가 다른 요소보다 느리게 로드되는지에 대한 자세한 다이어그램 형태로 결과를 제공하는 무료 서비스입니다. 다른 문제 영역을 진단하는 것은 쉽습니다.

Pingdom으로 웹 사이트 로드 속도 테스트

웹 사이트 속도 테스트를 시작한 후 웹 사이트에 가장 적합한 로드 속도가 무엇인지 궁금할 수 있습니다.

우수한 페이지 로딩 시간은 2초 미만입니다. 그러나 빠르면 빠를수록 좋다는 것을 기억하십시오.

YSlow는 Firebug에 내장된 FireFox용 플러그인입니다. 현장의 속도에 직접적인 영향을 미치는 20가지 요인을 분석하여 자원의 생산성을 100점 척도로 추정하고, 각 요소를 A부터 F까지 추정한다.

YSlow로 사이트 다운로드 속도 확인 결과

GT Metrix로 웹사이트 테스트

GT Metrix는 페이지 로드 속도를 분석하는 최고의 서비스 중 하나입니다. GT Metrix는 아날로그와 달리 페이지 로드 속도, 요청 수 및 각 페이지 요소의 로드 속도에 대한 정보를 제공할 뿐만 아니라 상황 개선을 위한 권장 사항도 제공합니다.

Google PageSpeed ​​Insights(https://developers.google.com/speed/pagespeed/insights/)는 페이지 로딩 속도를 최적화하고 추정하는 데 가장 널리 사용되는 도구 중 하나입니다. 사이트 개선을 위한 권장 사항을 수신하기 위한 것입니다. 그러나 최근 많은 사람들이 이 조언을 무시하고 있으며 이는 우연이 아닙니다. 무슨 일이 일어났고 왜 구글 PageSpeed ​​테스트 결과에 대해 걱정하지 않아도 될까요?

우리의 실험에 따르면 Google PageSpeed ​​점수는 사이트 다운로드 속도를 나타내는 지표가 아닙니다. 또한 서비스의 모든 권장 사항을 구현하면 모든 조언을 고려할 수 없기 때문에 열정이 빨리 사라집니다. 예를 들어, 귀하의 사이트에 없는 스크립트에 캐싱 헤더를 추가하라는 제안을 받게 됩니다.

Google PageSpeed의 또 다른 빈번한 권장 사항은 페이지 헤더를 차단하는 JavaScript 및 CSS를 제거하는 것입니다. Google PageSpeed의 지침을 실행하면 사이트 또는 기능의 일부가 손상될 위험이 있습니다.

물론 광신도 없이 사용하면 도구 전체가 유용하다. 문제 영역을 식별합니다. 예를 들어 gzip 압축이 부족하거나 압축하기에 더 좋은 큰 이미지가 있는 경우와 같이 그 중 일부는 주의를 기울여야 합니다. 주요 작업은 PageSpeed ​​표시기보다 사이트 속도를 향상시키는 것임을 기억하는 것이 중요합니다.

WordPress 사이트의 속도를 늦추는 것은 무엇입니까?

페이지 로딩 속도 테스트 결과 보고서에는 개선을 위한 권장 사항이 포함되어 있습니다. 대부분의 경우 - 초보자의 기술적 뉘앙스가 어렵습니다. 리소스 성능의 병목 현상이 발생하는 위험 영역을 파악하여 이를 제거하기 위한 조치를 취하는 것이 중요합니다.

WordPress 사이트 속도를 늦추는 주요 문제 영역은 다음과 같습니다.

  1. 호스팅. 서버가 올바르게 구성되지 않으면 사이트 속도가 느려집니다(VPS 서버인 경우). 최적의 가상 호스팅을 선택하려면 사이트 요구 사항에 가장 적합한 요금제를 선택해야 합니다.
  2. 워드프레스 구성. 사이트에서 캐시된 페이지를 사용하지 않으면 서버에 과부하가 걸리므로 리소스가 느려지고 오류 500(서버 측 오류)이 발생합니다.
  3. 나쁜 플러그인. 비효율적/악성 코드가 있는 플러그인을 사용하거나 플러그인을 남용하면 사이트가 심하게 느려집니다.
  4. 이미지 치수. 많은 사진이 웹에 최적화되어 있지 않아 사이트 속도에 부정적인 영향을 미칩니다.
  5. 스크립트. 광고, 코드 분석, 글꼴 로딩 등은 사이트의 성능에 영향을 미칩니다.
  6. 낮은 호스트 대역폭/CDN 없음.

사이트 속도를 저하시키는 문제 영역에서 WordPress는 알아냈습니다. 이제 문제를 해결하고 WordPress 사이트 다운로드 속도를 높이는 방법에 대한 질문에 답할 수 있습니다.

WordPress용 호스팅 제공업체

WordPress 사이트 최적화는 정확히 이해할 수 있을 때 심각하게 고려할 수 있습니다. 이것은 필요한 호스트가 아닙니다. 사이트 속도가 느려지고 십자가를 표시해야 합니다. 100% 끔찍한 호스트는 공유 서버에서 수천 개의 사이트를 호스팅하는 호스트입니다. 이러한 호스팅을 사용하면 돈, 신경 및 시간 낭비가 발생합니다. 그렇기 때문에 클래식 초보자처럼 호스팅 선택에 실수하지 않도록 하는 것이 중요합니다.

이렇게 하려면 웹 호스팅 매니아 커뮤니티를 방문하십시오. 예를 들어, WebHostingTalk(http://www.webhostingtalk.com/). 여기에서 호스팅 회사, 충돌 테스트, 연구 결과에 대한 객관적이고 편견 없는 리뷰를 찾을 수 있습니다. 일반적으로 철저한 답변을 얻으십시오.

기억하십시오: 좋은 호스트는 장기적으로 리소스 개발에 대한 투자입니다.

주요 호스팅 유형에 대해 간략히 살펴보겠습니다. 세 가지 옵션이 있습니다.

  • 가상(공유) – 한 서버에 약 100개의 사이트가 있습니다.
  • VPS(가상 사설 서버) – 20개의 웹사이트가 하나의 서버에서 호스팅됩니다.
  • Dedicated – 귀하의 사이트를 위한 전용 서버입니다.

공유 호스팅

공유 호스팅은 트래픽이 적은 사이트에 대한 옵션이지만 사이트 트래픽이 증가함에 따라 예를 들어 사설 서버로 이동해야 합니다.

공유 호스팅은 아파트에서 방을 빌리는 것과 같습니다. 살 곳은 있지만 욕실, TV, 주방 등은 공동으로 사용하기 때문에 화장실 차례를 기다려야 하는 경우가 있습니다.

장점: 싸다. 간단한 웹사이트만 있으면 적합합니다. 누구를 위해? 초보자용, 스타트업(블로그, 명함, 포트폴리오, 소규모 프로젝트).

가상 사설 서버(VPS)

VPS는 고급 사용자를 위해 설계되었거나 인기 있는 온라인 비즈니스를 위한 관리형 WordPress 호스팅을 주문할 수 있습니다. 높은/중간 트래픽이 있는 사이트에 좋은 옵션의 VPS. VPS 호스팅은 동거의 변형이지만 건물에서 아파트를 빌릴 때. 주방, 욕실이 있지만 공용 주차장(디스크 공간), 엘리베이터(인터넷 연결) 등이 있습니다.

장점: 더 많은 공간을 확보할 수 있습니다. 누구를 위해? 정보 자원(뉴스 포털, 중간 규모 상점, 상당한 양의 콘텐츠가 있는 정보 사이트)용.

전용 호스팅은 일일 청중이 백만 번째인 대규모 포털을 위해 설계되었습니다.

전용 서버

전용 호스팅은 차고, 수영장, 정원 및 바베큐 공간이 있는 단독 주택에 사는 것과 같습니다. 그리고 집, 건물 및 집 주변의 기반 시설은 전적으로 귀하의 처분에 있습니다.

장점: 모든 것을 얻을 수 있고 누구와도 공유하지 않습니다. 하지만 비싸다. 누구를 위해? 대규모 프로젝트의 경우(소셜 네트워크, 데이트 사이트, 다양한 제품이 있는 거대한 매장, 포털).

Kinsta, BlueHost, SiteGround와 같은 우수한 호스팅 제공업체는 사이트의 요구 사항에 맞게 컴퓨팅 성능을 최적화하기 위한 조치를 취합니다. 그러나 사이트가 공유 호스팅에 있는 경우 서버 리소스를 다른 고객과 공유해야 합니다. 즉, 서버에서 이웃의 트래픽이 많을 때(다수 방문) 전체 서버의 성능이 저하되어 사이트 속도가 느려집니다. 지리적 특성으로 인해 가능한 한 대상 고객과 가까운 호스팅 서버를 사용하는 것이 좋습니다.

WordPress용 관리 호스팅을 사용하면(예산이 제한되지 않는 경우) WordPress를 실행하고 자동 백업, 자동 WordPress 업데이트 및 보다 정교한 사이트 보호 방법을 제공하는 데 가장 최적화된 서버 구성을 제공합니다.

WordPress 사이트 가속화를 위한 단계별 가이드

사이트 구성을 변경하는 것은 초보자, 특히 웹 개발자가 아닌 경우에 끔찍한 생각이라는 것을 이해합니다. 걱정하지 마세요. 당신은 혼자가 아닙니다. 우리는 많은 사용자가 사이트 성능을 개선하도록 도왔고 코드 한 줄 없이 몇 번의 클릭으로 WordPress 사이트를 개선하는 방법을 보여 드리겠습니다.

1단계. 캐싱 플러그인 설치 및 CDN(콘텐츠 전송 네트워크) 사용

WordPress 페이지는 동적입니다. 즉, 사용자가 귀하의 사이트를 방문할 때마다 즉석에서 생성됩니다. 저것들. 페이지를 생성하기 위해 WordPress는 필요한 정보를 찾는 과정을 시작하고 모든 정보를 수집한 다음 방문자에게 페이지를 표시해야 합니다.

동시에 사이트 방문자가 많으면 리소스 속도가 느려지고 때로는 비활성화될 수도 있습니다. 따라서 각 워드프레스 사이트에서 특별한 캐싱 플러그인이나 캐싱 CDN 서비스를 사용하는 것을 권장합니다. 그들은 당신의 사이트를 2-5배 더 빠르게 만들 것입니다.

WordPress 캐싱 및 CDN은 어떻게 작동합니까?

처음부터 페이지 생성 프로세스를 처리하는 대신 캐싱 플러그인은 사용자가 처음 방문한 후 페이지 사본을 생성한 다음 이 캐싱된 버전을 사이트의 각 후속 게스트에게 엽니다.

방문자가 WordPress 사이트를 방문하면 서버에서 PHP를 처리하고 데이터베이스에서 필요한 정보를 추출하도록 요청합니다. 이와 함께 웹 서버는 Java 스크립트(특수 효과, 분석 등)를 실행하고 모든 웹 서버가 HTML 코드를 생성한 후 사용자에게 보냅니다. 리소스 집약적인 프로세스이지만 캐싱과 CDN을 사용하면 최적화할 수 있습니다.

WordPress에는 많은 캐싱 플러그인이 있지만 그 중 일부는 환상적인 유연성을 제공하고 일부는 바로 사용할 수 있으며 초보자도 쉽게 구성할 수 있습니다. 복잡한 옵션은 자신감 있는 WordPress 사용자에게 적합하며 프로젝트의 특정 아키텍처를 고려하여 웹 사이트를 미세 조정할 수 있습니다.

간단히 말해서 캐싱 플러그인이 사이트에서 활성화되면 페이지를 서버에 복사합니다. MySQL 데이터베이스에 대한 액세스를 극적으로 줄이고, PHP 요청, 정적 리소스에 대한 서버 액세스, 심지어 HTTP 요청(여러 파일이 하나로 병합된 경우)을 제거하거나 최소화합니다.

WP 슈퍼 캐시 플러그인을 사용하는 것이 좋습니다. 구성하기 쉽고 사용하기 쉬우며 사이트 방문자는 즉시 차이점을 느낄 것입니다. 사이트 페이지가 훨씬 더 빨리 열립니다.

WP Super Cache는 데이터베이스에 대한 쿼리 없이 각 페이지의 통계 HTML 버전을 생성하고 매번 다운로드합니다. 사이트 작업 속도를 높일 뿐만 아니라 서버의 부하를 줄입니다. 플러그인은 mod_rewrite 또는 PHP 기술을 사용하여 사이트 방문자에게 서비스를 제공하며 선호하는 옵션은 "단순" 또는 "전문가" 설정에서 선택하는 것입니다. WP Super Cache에서는 캐시 정리 및 만료된 페이지의 시간과 빈도를 지정하여 캐시 정리 일정을 직접 구성합니다. CDN과의 통합이 있습니다.

초보자는 "심플" 모드를 권장합니다. "권장" 항목을 모두 선택하고 캐시 지우기 일정을 생성하면 플러그인을 사용할 수 있습니다. 추가 기능은 사용자 정의할 수 있습니다. WP Super Cache는 잘 번역되었으며 모든 설명이 논리적이고 명확합니다. 문제 해결 방법은 기술 지원 포럼에 자세히 설명되어 있습니다. 여기에서 질문을 할 수 있습니다. 아직까지는 영어로만 가능합니다.

다음과 같은 캐싱 기능을 제공합니다.

  • 페이지 캐시;
  • 개체 캐시;
  • 데이터베이스 캐시;
  • 브라우저 캐시;
  • 작게 하다;
  • CDN.

Minify는 명시적으로 구성하지 않는 한 JS를 기반으로 하는 일부 플러그인을 중단합니다. 브라우저 캐시를 최대한 활용하려면 브라우저를 구성해야 합니다.

장점: 빠르고 간단한 설치, CDN 지원.

단점: 일부는 다른 플러그인, 호스팅과의 호환성 문제가 있었지만 최신 버전에서는 이러한 문제가 더 이상 관찰되지 않습니다. W3 Total Cache와 비교하여 단순화된 기능이 여기에 표시됩니다.

WP Super Cache의 간단하고 이해하기 쉬운 관리 및 설치에 대한 대안은 W3 Total Cache입니다. "미세 조정"에 대해 충분히 유연하기 때문에 보다 광범위한 작업 목록의 솔루션을 다룰 수 있습니다. Profi는 사이트 개선을 위한 프레임워크라고 합니다.

플러그인은 가상 호스팅에서 잘 작동합니다. 그러나 더 많은 기능을 짜낼 수 있습니다. 극단적 인 경우 PRO 버전이 있습니다.

장점: 전체 캐싱, 최소화, CDN 지원을 위한 모든 것이 있습니다.

단점: 많은 수의 기능은 초보자를 혼란스럽게 할 수 있습니다.

WP 수퍼 캐시 또는 W3 총 캐시 중에서 무엇을 선택해야 합니까?

두 플러그인 모두 캐싱 작업에 능숙합니다.

차이점:

  • WP Super Cache는 WordPress 사이트 캐싱을 위한 가장 간단한 솔루션이지만 고급 설정이 포함된 버전도 있습니다.
  • W3 Total Cache – 구성이 보다 유연합니다. 사이트가 전용 서버에 있는 경우 이 플러그인은 최적의 사이트 성능을 유지하기 위한 가장 친한 친구가 될 수 있습니다.

브라우저 캐시 최적화

사용자의 브라우저가 파일을 캐시하도록 서버를 구성합니다. HTTP 요청 및 HTTP 응답의 헤더를 모니터링하고 수정하는 Apache 서버의 헤더 모듈을 사용합니다. 브라우저는 매우 드물게 변경되는 서버에서 로컬 캐시로 데이터를 다운로드하고 사이트를 방문하면 캐시에서 데이터를 로드합니다. 지정된 기간 동안 특정 유형의 파일을 캐시할 수도 있으며, 그 후에는 서버에서 다시 다운로드됩니다. 페이지를 자동으로 캐싱하는 플러그인이 캐싱 작업을 수행합니다.

2단계: 콘텐츠 전송 네트워크( CDN) 사용

다른 국가의 사용자에 대해 사이트의 다운로드 시간이 다를 것이라는 점을 기억하십니까? 호스팅 서버의 위치가 사이트 속도에 영향을 미치기 때문입니다. 호스팅이 인도인 경우 인도에서 웹사이트를 방문하는 방문자는 예를 들어 미국에서보다 빠르게 다운로드합니다. 사이트가 특정 국가 및 지역을 대상으로 하는 경우 호스팅을 구매하는 것이 좋습니다.

문제를 해결하는 방법?

CDN을 사용하세요! 모든 방문자의 사이트 로딩 시간이 빨라집니다.

이미지, 스크립트, CSS 파일과 같은 사이트의 정적 리소스를 언로드하면 웹사이트 속도가 빨라집니다. CDN을 사용하면 방문자가 이러한 리소스를 더 빨리 로드할 수 있을 뿐만 아니라 기본 서버의 작업 부하도 줄어들기 때문에 사이트의 나머지 부분에 서비스를 제공하는 동안 최대 성능을 얻을 수 있습니다.

이러한 정적 리소스는 방문자에게 가장 가까운 서버에서 방문자에게 전달됩니다. 콘텐츠 전송 네트워크는 상당히 많습니다. WordPress 사이트에서 구성하기 쉬운 것을 찾고 계십니까? 맥스씨디엔입니다.

  • CDN은 전 세계의 서버를 포함하는 콘텐츠 전송 네트워크입니다. 각 서버는 사이트를 표시하는 데 사용되는 "정적" 파일을 저장합니다.
  • 정적 파일은 변경할 수 없는 파일(이미지, CSS 스타일, JavaScript)입니다.
  • 동적 파일 - 페이지 및 게시물 텍스트, 댓글 등

트래픽이 많은 거의 모든 웹 사이트는 정적 콘텐츠에 CDN을 사용합니다. CDN은 아래와 같이 인구 통계학적 범위가 넓은 사이트에 이상적인 글로벌 콘텐츠 전달 서비스를 제공하기 위해 전 세계에 저장 장치를 보유하고 있습니다.

CDN을 사용하면 사용자가 사이트를 방문할 때마다 가장 가까운 서버에서 정적 파일을 가져옵니다. 호스팅의 부하가 줄어들어 성능이 향상됩니다.

오늘날 트래픽이 많은 거의 모든 사이트는 정적 콘텐츠에 CDN을 사용합니다. 대략적인 추산에 따르면 CDN 기술은 상위 100개 미국 및 유럽 온라인 상점의 3위를 차지하는 현실입니다.

MaxCDN(https://www.maxcdn.com/)과 같은 CDN에는 전 세계에 전략적으로 위치한 솔리드 스테이트 드라이브가 있어 광범위한 인구 통계학적 범위를 가진 웹사이트에 이상적인 글로벌 콘텐츠 전달 서비스를 제공합니다.

Rackspace Cloud Files, Amazon S3와 같은 거대 CDN을 사용하면 콘텐츠에 더 빠르게 액세스하고 병목 현상에서 대기 시간을 줄일 수 있습니다. 이러한 CDN 운영자의 서비스는 유료입니다. 그러나 Cloudflare의 무료 CDN을 사용할 수 있습니다.

WordPress 호스트에 대한 전략적 서버 위치를 선택하는 것이 중요합니다. CDN이 미디어와 콘텐츠 배포에 도움이 되더라도 웹사이트가 로드될 때 호스팅 제공업체에 초기 요청을 해야 하기 때문입니다. 일부 WordPress CDN 속도 테스트를 확인하여 자신의 사이트에서 기대할 수 있는 성능 향상 정도를 더 잘 판단할 수 있습니다.

3단계: WordPress 사이트에서 이미지 및 비디오 최적화

이미지는 콘텐츠에 활력을 불어넣고 집중하고 댓글을 남깁니다. 즉, 이미지는 상호 작용을 활성화합니다. 연구원들은 색상 시각 효과가 자료를 읽을 가능성을 80% 증가시키고 검색 엔진 순위를 개선하며 일반적으로 SEO 지표를 개선한다는 것을 발견했습니다. 동시에 이미지는 사이트에서 가장 무거운 요소 중 하나입니다.

그러나 이미지가 최적화되지 않으면 도움이 되지 않고 해가 됩니다. 긴 사이트 다운로드의 가장 일반적인 문제는 최적화되지 않은 이미지로 초보자 사이트에서 자주 발견됩니다.

축소판의 최대 이미지 크기를 매체로 지정하는 것을 잊지 마십시오. 즉, 너비가 1024픽셀인 이미지를 로드하고 콘텐츠 영역의 너비가 604픽셀에 불과한 경우 일반적으로 이미지가 CSS로 축소됩니다. "큰" 이미지의 최대 너비를 604px로 지정하면 크기가 훨씬 작은 604픽셀의 확대된 이미지가 표시됩니다.

2018년에는 마케팅 수단으로 이미지에 대한 관심이 새롭게 대두되었습니다. 먼저 제품 사진에 대한 마크업 지원 – Screma.org(http://schema.org/Product)에 대해 이야기하고 있습니다. 마크업을 사용하면 검색 엔진이 사진(인터넷 거래에 대한 실제)에 따라 제품에 대한 포괄적인 정보를 제공할 수 있습니다.

휴대폰이나 카메라에서 사진을 업로드하기 전에 사진 편집 프로그램을 사용하여 인터넷에서 이미지를 최적화하고 먼저 웹 버전을 만드는 것이 좋습니다. 이러한 이미지의 소스 파일은 크기가 큰 경우가 많습니다. 그래픽 편집 프로그램을 통해 5배로 줄이는 것이 좋습니다.

예를 들어, 품질 손실 없이 이미지를 압축하면 플러그인 EWWW Image Optimizer(https://ru.wordpress.org/plugins/ewww-image-optimizer/)가 제공됩니다. JPEG 이미지의 경우 최대 60%, PNG 이미지의 경우 최대 80%까지 압축할 수 있습니다. 그러나 모든 호스팅 시스템에서 작동하는 것은 아니므로 대안으로 TinyPNG 서비스(https://ru.wordpress.org/plugins/tiny-compress-images/)를 사용하여 PNG 파일을 압축하는 것이 좋습니다.

플러그인은 JavaScript, VBScript 및 AppleScript, 일괄 자동화를 지원하므로 여러 이미지를 한 번에 압축할 수 있습니다. 파일은 더 나은 호환성을 위해 자동으로 sRGB 형식으로 변환됩니다. JPEG 및 PNG 이미지 압축 플러그인의 장점은 이미지 품질을 유지하면서 새 파일을 다운로드하는 동안 이미지가 자동으로 압축된다는 것입니다. 빼기 – 데이터 압축에 대한 월별 제한이 있지만 거기에 대한 지불은 순전히 상징적입니다.

사이트에서 이미지를 최적화하는 가장 간단한 방법은 플러그인 WP Smush(https://ru.wordpress.org/plugins/wp-smushit/)입니다. 설치가 매우 간단하며 "미디어 파일" 섹션의 관리자 패널에 즉시 나타나며 유료 버전으로의 업그레이드를 제공합니다. 자동 이미지 최적화는 기본적으로 연결되어 있습니다. 따라서 라이브러리에 업로드하면 파일이 즉시 최적화됩니다.

CDN을 사용하여 이미지를 빠르게 전달할 수 있습니다. 콘텐츠가 사용자와 지리적으로 더 가깝기 때문에 대기 시간이 줄어들어 사용자 측에서 이미지를 수신하고 표시하는 시간이 줄어듭니다. 요청에 대한 응답 속도와 관련하여 사이트의 응답성이 향상됩니다.

둘째, 콘텐츠를 재사용하면 방문자에게 전송되는 데이터 양이 줄어들기 때문에 네트워크 트래픽이 줄어듭니다. 클라이언트의 비용을 절약할 뿐만 아니라(트래픽 비용을 지불한다고 가정) 채널의 대역폭 요구 사항을 보다 유연하게 만듭니다.

JetPack 플러그인의 Photon 모듈은 이미지 처리 및 가속을 담당합니다. 데이터베이스를 변경하지 않고 레코드 및 페이지 필터링이 있으며 이미지의 크기는 더 작을 때 포함하는 요소의 높이 및 너비 또는 너비의 지정된 속성에 따라 잘립니다.

방법의 단점에서 – 이미지를 캐싱하면 품질이 영원히 저하되고 단점이 있습니다. 즉, 사진을 "업데이트"해야 하는 경우 다시 로드해야 합니다.

LazyLoad 구성 – 이미지 업로드 보류

많은 수의 이미지가 있는 사이트의 경우 실제입니다. 방문자가 페이지의 특정 부분으로 이동할 때 그래픽 요소의 로드가 시작됩니다. LazyLoad의 시각적 효과는 볼 수 없지만 플러그인을 사용하면 사이트의 서버 리소스 소비가 최소화되어 페이지를 끝까지 스크롤하지 않는 사람들을 위해 더 적은 정보를 다운로드할 수 있습니다.

A3 Lazy Load(https://wordpress.org/plugins/a3-lazy-load/) – 페이지의 모든 이미지를 동시에 다운로드하기 위한 플러그인입니다. Lazy Load 스크립트에서 사용자가 사이트 요소의 이 부분에 액세스할 때만 시각적 콘텐츠(이미지, 비디오, 스크립트)를 다운로드하도록 WordPress 사이트를 설정할 수 있습니다.

따라서 사이트 방문자는 보기 화면에 표시되는 이미지를 먼저 봅니다. 아래로 스크롤하면 도구가 콘텐츠를 추가로 로드합니다. 페이지가 처음 로드될 때 페이지가 받는 요청 수를 줄입니다. 이러한 방식으로 대역폭을 절약하고 다운로드 시간을 늘리는 데 도움이 됩니다.

JPEG와 PNG의 두 가지 이미지 형식을 사용합니다.

차이점은 무엇입니까?

PNG – 래스터 이미지 형식. 이미지를 압축하면 정보가 손실되므로 PNG의 품질이 향상되고 자세한 정보가 포함됩니다. 단점은 파일 크기가 크고 다운로드 시간이 오래 걸린다는 것입니다.

JPEG는 이미지 품질을 약간 낮추는 압축 파일 형식이지만 크기는 훨씬 작습니다.

어떤 이미지 형식을 선택해야 합니까?

사진에 여러 색상이 있는 경우 JPEG를 사용해 보십시오.

이것이 더 간단한 이미지이거나 투명한 배경이 필요한 경우 PNG를 사용하십시오.

우리 사이트에서는 JPEG를 더 자주 사용합니다. JPEG와 PNG의 대략적인 비율은 80:20입니다.

매년 비디오 소비 경향이 점점 더 커지고 있습니다. 이러한 경향은 14~25세 연령층에서 더 일반적이지만 PC와 모바일 기기의 영상 소비는 연령대별로 관찰된다.

Cisco의 연구에 따르면 2021년까지 온라인 비디오의 양이 3배 증가할 것이라고 합니다.

2016년에 비디오는 전 세계 트래픽의 73%를 차지했으며 모든 종류의 비디오에 대한 수요가 증가하고 있습니다. 인터넷에서 가장 빠르게 성장하는 비디오 부문은 실시간 비디오입니다. 2021년까지 "라이브" 비디오는 전체 트래픽의 13%를 차지할 것입니다.

이것은 마케터와 SEO 전문가에게 무엇을 의미합니까? 사이트에 비디오가 있으면 사용자 경험이 향상되고 검색 결과에서 이러한 사이트가 나타나며 행동 요인(오늘날 SEO 검색 엔진의 가장 중요한 기준)의 증가에 효과적으로 영향을 미칩니다. 비디오를 인터넷 홍보를 위한 유용한 도구로 생각하는 것은 이미 가치가 있습니다.

따라서 비디오 클립은 로드하기 가장 어렵기 때문에 최적화에 대해 이야기하는 것이 좋습니다. 비디오에 대해 바로 위에서 작성한 지연 다운로드를 시도하십시오. 이 비즈니스의 동맹은 비디오용 Lazy Load 플러그인입니다. 모든 비디오의 지연 로딩을 관리하기 위해 웹사이트의 모든 무거운 요소를 확인하도록 설계된 Lazy Load XT의 도움으로 사이트의 이미지를 수행할 수 있습니다.

사이트 WordPress의 성능을 향상시키는 가장 좋은 방법

캐싱 플러그인을 설치하고 이미지를 압축하면 사이트가 훨씬 빠르게 로드된다는 사실을 알게 될 것입니다.

그러나 이것으로 충분하지 않습니다. 추가 사용자 지정 방법을 사용하는 것이 좋습니다. 우리의 팁은 기술적인 것이 아니므로 코드가 어떻게 작동하는지 알 필요가 없습니다. 그러나 그들의 응용 프로그램은 WordPress 사이트의 작업 속도를 늦추는 주요 문제를 해결할 것입니다.

4단계: WordPress에 직접 다운로드하지 마십시오.

예, 비디오를 WordPress 사이트에 쉽게 다운로드할 수 있으며 HTML5 플레이어에 자동으로 표시됩니다. 그러나 당신은 이것을 해서는 안됩니다!

비디오를 호스팅하면 대역폭 비용이 발생합니다. 귀하의 요금에 무제한 대역폭이 포함된 경우에도 호스팅 회사는 귀하의 사이트를 폐쇄할 권리가 있습니다.

비디오를 호스팅하면 백업 크기가 크게 증가하고 백업에서 사이트를 복원하기 어렵게 만듭니다.

문제를 해결하는 방법?

2가지 방법이 있습니다.

  1. YouTube, Vimeo, DailyMotion 등의 동영상 호스팅 서비스를 사용합니다.
  2. WordPress에는 비디오 파일을 추가하는 기능이 내장되어 있습니다. 동영상 링크를 복사하여 게시물에 직접 붙여넣을 수 있습니다. 비디오가 페이지에 자동으로 나타납니다.

8단계. 속도에 중점을 둔 주제 선택

사이트에 대한 WordPress 테마를 선택할 때 최적화에 특히 주의를 기울이는 것이 중요합니다. 일부 중요한 테마는 사이트의 성능을 고려하지 않고 생성되며 비효율적인 코드를 사용하여 사이트 속도를 심각하게 저하시킬 수 있습니다.

프로그래밍의 황금 원칙 – KISS는 시스템이 단순하고 복잡하지 않으면 최대한 잘 작동한다고 주장합니다. 그렇기 때문에 사이트 디자인 영역에서 단순성이 핵심 목표 중 하나입니다.

불필요한 복잡성을 피하고 "깔끔한 디자인", 고품질 플러그인으로 우아한 테마를 선택해야 합니다. 시각적 효과 및 기타 기능이 많은 복잡한 목업으로 인해 부풀어 오르는 것은 피하는 것이 좋습니다. 일반적으로 WordPress의 유료 주제는 최고의 프로그래밍 방식과 SEO를 고려하여 최적화되고 구축됩니다.

6단계. "빛" 슬라이더 사용

슬라이더를 사용하는 것은 흥미로운 디자인 요소이지만 사이트 속도를 늦출 수 있습니다. 제대로 구현되지 않은 슬라이더 플러그인으로 이미지를 최적화하는 데 시간을 들였다 해도 이 작업은 성가신 일입니다.

WordPress 슬라이더의 플러그인을 비교했는데 Soliloquy가 다른 것보다 빨랐습니다(페이지 다운로드는 1.34초, LayerSlider 사용 시 2.12초).

다운로드 속도에 대한 플러그인 슬라이더 비교

슬라이더 플러그인 로드 시간 페이지 크기
독백 https://soliloquywp.com/ 1.34 1MB
니보 슬라이더

https://ru.wordpress.org/plugins/nivo-slider-lite/

2.12초 1MB
유성

https://wordpress.org/plugins/meteor-slides/

2.32초 1.2MB
레볼루션 슬라이더

https://revolution.themepunch.com/

2.25초 1MB
레이어 슬라이더

https://layerslider.kreaturamedia.com/

2.12초 1MB

7단계. 빠른 플러그인 사진 갤러리 뷰어 사용

사이트가 포트폴리오 또는 사진 갤러리인 경우 이미지 갤러리 플러그인을 사용하고 싶을 것입니다. 속도에 최적화되어 있고 사이트를 로드하지 않는 플러그인을 사용하는 것이 중요합니다. 우리의 경험에 따르면 시장에서 WordPress 갤러리를 위한 최고의 플러그인 중 하나가 Envira(https://enviragallery.com/) / 해당 플러그인보다 두 배 빠릅니다.

WordPress 사이트 속도 향상을 위한 조정(고급 사용자용)

나열된 방법과 권장 사항을 사용하여 WordPress의 속도를 최적화하면 사이트의 로드 시간이 크게 단축되는 것을 느낄 수 있습니다.

여기에서 매초가 중요합니다. 목표가 가장 빠른 속도라면 몇 가지를 더 변경해야 합니다.

이 팁은 약간 더 기술적이고 PHP에 대한 기본 지식이 필요합니다. 따라서 다음 단계를 진행하기 전에 사이트의 백업 복사본을 저장하십시오.

8단계. HTTP 요청 수 줄이기

페이지의 각 요소는 별도의 HTTP 요청(텍스트, 스타일, 각 아이콘, 이미지)입니다. 예를 들어 표준 WordPress 댓글 시스템을 사용하는 경우 각 댓글 작성자에 대해 별도의 HTTP 요청이 생성됩니다. 댓글이 많으면 불필요한 리디렉션이 포함된 많은 요청이 발생한다는 것을 이해합니다.

우리는 이 문제에 대해 두 가지 솔루션을 제공합니다.

  1. 사용자 지정 그라바타를 비활성화합니다. Not the best way, but working when loading speed is really important.

How to do it?

Install the free WP User Avatar plug-in (https://wordpress.org/plugins/wp-user-avatar/) and choose “Disconnect Gravatar” from the menu.

  1. Use the lazy loading of Disqus Conditional Load (https://wordpress.org/plugins/disqus-conditional-load/). Disqus works faster due to fewer HTTP requests.

Disable scripts

There is a plugin Gonzalez (https://tomasz-dobrzynski.com/wordpress-gonzales), which allows you to disable unnecessary scripts and do not download them on the pages of the site. The plugin is not free, but it costs money, especially if you want to add a gascode to the site.

Many plugins and themes download all files from third-party sites – scripts, style sheets, images, for example, from Google, Facebook.

You can use several such plugins because these files are usually optimized for fast download. But if your plugins make many such requests, this can seriously slow down the work of the WordPress site.

You can reduce the number of requests made to the servers of your site. Every time someone visits your site, it requests site files. It includes HTML, CSS and JS files.

How to solve a problem?

Reduce HTTP requests by disabling scripts, styles, or merging them into a single file. You can use a caching plugin for this.

Minify and combine CSS and JavaScript

Minification is the removal of unnecessary characters (spaces, comments, delimiters, etc.) from HTML, Javascript and CSS files. It reduces the amount of code that requires a response from the server and, accordingly, speeds up the loading of the site.

Combine – combine CSS and Javascript files into 1 file.

How to do it?

Use the plugin. For example, WP Rocket. If you are looking for an alternative free version of the plugin – we offer you such lightweight solutions as Better WordPress Minify and Autoptimize. Remember that it's better to put CSS at the top, and Javascript from the bottom.

Step 9. Diagnose your plugins

All plugins are code snippets that help you perform the functions assigned to them. Sometimes they become burdensome and unproductive. It is a big load on the server.

How to solve a problem?

There is a special plugin – the organizer of your Plugin Organizer plug-ins (https://wordpress.org/plugins/plugin-organizer/). He will find out which of your plug-ins significantly affect the load time of your site. You can quickly determine which plug-in badly affects the speed of your site. If there is a plug-in that slows down the site, it is suggested to find a worthy replacement.

Remember, aging versions of plug-ins are usually more vulnerable to attack, new ones are more optimized, quicker and safer, they contain fewer errors. We recommend that you disable and even remove plugins that you do not use. Many plug-ins do not necessarily mean a slower site, but many low-quality plug-ins will significantly slow down the resource.

Step 10. Reduce database queries

Unfortunately, we often see topics with bad code. They ignore the standard methods of working WordPress and make direct calls to the database or abuse requests to the database. It slows down your server. WordPress themes with pure code access the database, usually to get necessary information from your site.

How to solve a problem?

It's enough to use a caching plugin. We recommend using WP Super Cache (https://ru.wordpress.org/plugins/wp-super-cache/).

The plugin will remove all your spam-waiting comments, marked messages, automatically saved drafts. They can also perform common queries to optimize the MySQL database without having access to PHP.

Step 11: Optimize the WordPress database

After starting the WordPress site and first working with it, there will be a lot of information in your database that you will most likely never need. To optimize the site, it will have to be removed.

It is easily managed with the WP-Sweep plug-in (https://en.wordpress.org/plugins/wp-sweep/). It cleans the database, removing corrupted messages, unused tags, duplicating metadata, optimizing database structure at the click of a mouse.

The WP-Sweep database optimization plug-in will get rid of:

  • Spam, deleted and unapproved by the moderator of comments;
  • Duplicate content;
  • Editable versions of posts, messages;
  • Unused content (themes, plugins, broken links).

A well-optimized, responsive database is a huge bonus for WordPress.

Step 12. Limit editing posts

Editing publications take up a lot of space in the WordPress database. Some experts believe that these changes affect database queries launched by plug-ins.

If the plugin does not specifically exclude editing of records, this can be the reason for slowing down your site, because the site will be without the need to go to the search for all versions of the post, including draft versions.

We recommend limiting the number of versions (edits) of each post. You need to add this line of code to the wp-config.php file:

define ('WP_POST_REVISIONS', 4);

This code will limit WordPress in terms of saving edited versions of articles: now you will not see more than four changes of each material or page. It will automatically delete the old versions.

Step 13. Disable Hotlinks

If you create quality unique content, sooner or later it will be stolen.

Every time you use a server for storing images, you are exploiting more of its resources. Often people borrow your pictures, putting hotlinks on their servers. Thus, they do not load their servers but use your bandwidth of web hosting. It creates an unnecessary load on your server.

Just add this code to your .htaccess file to block the hotlinking images from your site:

#disable hotlinking of images with forbidden or custom image option

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)? stylemixthemes.com [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]

RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]

중요한! Do not forget to replace stylemixthemes.com with your own domain.

Step 13: Divide comments into pages

Do you have many comments on the posts? Congratulations! It is a good indicator of the interest of your readers.

The drawback here is only one – downloading numerous comments slows down the download of the site. If you have a caching plugin installed, you can skip this step.

WordPress has a solution for this! You do not need to download anything. Internal WordPress tools can quickly fix this problem.

How to do it?

  1. Go to the Settings tab in the Admin panel.
  2. Select the “Discussions” item.
  3. Check the “Split comments on pages” option.

The second way is to use an easy plugin to exchange views.

Exchange of messages and commenting is a big part of the marketing strategy of any website. However, sometimes people set too many exchange options that irritate visitors and slow down the site.

Our policy with the use of plugins for social media is minimal and straightforward. Social Sharing (by Danny) (https://wordpress.org/plugins/dvk-social-sharing/) weighs 50Kb, and to enable pop-up windows you need a font size of 600 bytes. We mean that the plugin does not affect the performance of the site.

Step 14. Update WordPress to the latest version

WordPress is a well-functioning open source project with frequent updates. Each subsequent update offers new features and eliminates errors, security issues, and vulnerabilities. Note that WordPress themes and plugins are also updated frequently.

Do not forget to update the site, plugins, themes to the latest versions, previously making a backup copy.

We hope our material has helped you to find useful tricks for speeding up your WordPress site. Be sure to use at least part of them and check the download speed of the site before and after, and write us in the comments your results. We are waiting!