본문 바로가기

워드프레스 SEO 최적화 속도측정 및 페이지 크기 압축

노랗 2022. 12. 13.
반응형

워드프레스 SEO 최적화 속도측정 및 페이지 크기 압축

웹사이트를 관리하는 분들이라면 제로보드, XE, 워드프레스 등등 CMS 홈페이지 "콘텐즈 관리 서비스"로 만들어진 웹사이트를 구글이나 네이버, 다음, 빙 등등 검색엔진에 노출이 잘 되게 하기 위해서는 SEO "검색엔진최적화"가 필요하며 이 때 가 장 중요한 요소인 웹페이지 속도가 느려지지 않도록 접속속도를 빠르게 설정하는게 중요합니다.

워드프레스 SEO 최적화 속도측정 및 페이지 크기 압축

웹사이트 접속속도가 느려지면 페이지 이탈율이 올라가며 검색엔진 색인에도 느려지는 단점이 있기 때문에 SEO 측정을 위한 속도측정 및 문제점을 찾아 페이지 크기를 압축하여 Gzip, CSS, Javascript 등의 크기를 줄여주느것이 좋습니다.

웹사이트 SEO 측정

Tool Pingdom Webpage Speed

우선 웹사이트의 속도틀 테스트할 수 있는 사이트는 많이 있지만 그중에서도 Pingdom 사이트를 가장 많이 사용합니다.

현재 웹페이지 접속속도를 A,B,C,D,E 등으로 표시되고 페이지 크기 및 로드시간 요청횟수등을 확인할 수 있습니다.

이때 대한민국 기준 측정기준을 ASIA - Japen Tokyo로 가장 가까운 지역을 선택하느것이 좋으며 매번 측정 시 조금 씩 달라질 수 있기 때문에 여러번 측정해보느것이 좋습니다.

이를 통해 현재 관리하고 있는 워드프레스 페이지 접속속도 및 문제점을 확인해볼 수 있습니다.

  • URL 리디렉션 줄이기
  • DNS 조회수 줄이기
  • HTTP 요청 수 줄이기
  • Gzip 구성요소 압축
  • Expiress 헤더추가
  • 쿠키가  없는 도메인 사용하기

대략적으로 가장 흔히 나오는 웹페이지 속도를 개선하는 방법입니다.

워드프레스 스크립트 및 폰트,HTML, CSS 압축 전 용량

현재 콘텐츠 유형별로 스크립트 및 영상, 폰트, HTML, CSS의 용량을 확인할 수 있으며 이를 압축하기 전 체크합니다.

그리고 구글폰트등은 상황에 따라 비활성화 후 로컬로 로딩해주느것이 좋습니다.

워드프레스 용량 압축 CSS, Gzip, JavaScript, CDN

wp-rocket 워드프레스 압축

워드프레스 속도를 빠르게 하는 다양한 압축 플러그인이 있습니다.

 

#1 WordPress Caching Plugin | WP Rocket

Make your website reach the stars. Use the most powerful caching plugin for WordPress. WP Rocket is easy to use, ready to improve your SEO and conversions.

wp-rocket.me

저 같은 경우 유료로 제공되는 WP-Rocket을 통해 CSS압축 및 Gzip압축등을 하지만 무료버전에서도 좋은 플러그인이 많이 있습니다.

CloudFlare

wp-rocket을 사용하면 Webp 이미지 변환 및 클라우드플라워 "CloudFlare"를 통한 웹사이트 속도를 개선하고 방화벽 및 보안등을 최적화할 수 있습니다.

클라우드 네트워크

클라우드플라워를 사용하면 트래픽절약 효과를 볼 수 있으며 무료버전에서도 다양한 HTTS SSL / TLS 보안인증서 및 디도스 공격을 보호합니다.

 

워드프레스 CloudFlare "클라우드플레어"CDN HTTS GZIP 압축 로딩 속도개선

워드프레스는 생각보다 무거워서 생각만치 빠른 속도가 나오지 않는데요 그렇기 때문에 다양한 플러그인 등을 통해서 이미지를 압축하고 HTML이나 JS 쿼리,자바스크립트,CDN,HTML 등을 압축하는 방

jab-guyver.co.kr

워드프레스 로켓을 통해 자세한 설정없이도 최적의 설정을 통해 속도 및 성능, 호환성등을 자동으로 구성하고 클라우드 플라워의 SSL 및 CSS, JS, 이미지 등을 HTTP -> HTTPS로 SSL 보안인증서가 작동하도록 합니다.

CDN 장점 설명
더 빠른 로딩 시간 CDN은 사용자와 가장 가까운 서버에서 콘텐츠를 제공하기 때문에 로딩 속도가 향상됩니다. 사용자가 요청한 콘텐츠가 CDN 서버에 이미 캐시되어 있다면 웹사이트 로딩 시간이 크게 단축될 수 있습니다.
트래픽 감소 CDN은 콘텐츠를 여러 서버에 분산 저장하므로 웹사이트의 트래픽이 분산됩니다. 이로 인해 웹 서버의 부하가 감소하고 대역폭 사용량이 줄어듭니다.
지역별 성능 향상 CDN은 전 세계에 서버를 배치하여 사용자의 지리적 위치에 가장 가까운 서버에서 콘텐츠를 제공합니다. 따라서 사용자의 지역에 따른 성능 향상이 있습니다.
고가용성 및 내결함성 CDN은 여러 서버에 콘텐츠를 복제하여 내결함성을 제공합니다. 특정 서버에 장애가 발생하더라도 다른 서버에서 콘텐츠를 제공하여 웹사이트의 가용성을 높여줍니다.
대역폭 최적화 CDN은 콘텐츠를 압축하고 최적화하여 대역폭 사용을 최소화합니다. 이를 통해 트래픽 비용을 절감할 수 있습니다.

CDN을 사용하면 위와 같은 이점이 있습니다.

워드프래스 속도 재측정

Pingdom Website Speed Test

이렇게 기본적인 워드프레스 DB 압축을 한 뒤 다시 Pingdom Website Speed Test를 진행합니다.

기존 워드프레스 점수 D -> A로 점수가 대폭 상승했습니다.

페이지 용량 또한 기존 대비 크게 작아져서 용량 및 트래픽 절약효과를 보게 됩니다.

다음으로는 가장 흔히 사용하는 구글에서 제공하는 페이지 스피드 측정을 진행합니다.

구글 페이지스피드 PageSpeed Insights

구글 페이지스피드 PageSpeed Insights

구글 페이지스피드 PageSpeed Insights 장점은 모바일 AMP 및 데스크탑 접속 시 각각의 속도를 측정할 수 있다는 점입니다.

코어 웹 바이탈 평가는 최근 28일 수집기준으로 평가되기 때문에 바로 표시되지 않을 수 있습니다.

  • Largest Contentful Paint (LCP)
  • First Input Delay (FID)
  • Cumulative Layout Shift (CLS)
  • First Contentful Paint (FCP)
  • Interaction to Next Paint (INP)
  • Time to First Byte (TTFB)

총 6가지 측정을 하게 되는데 홈페이지 접속 시 큰 데이터가 없는지 그리고 페이지 접속 시 속도를 지연하는 부분 및 레이아웃 변경등을 측정하게 되는데 첫 접속 시 속도를 지연시키는 항목을 개선해 로딩시간을 단축해야 합니다.

대표적으로는 초기 서버 응답시간 및 이미지 크기를 줄여주고 사용하지 않는 CSS 압축합니다.

차세대 이미지 형식은 현재로선 JPG나 PNG, TIFF 보다는 Webp 라고 하는 차세대 웹페이지 이미지로 변경해주느것이 이미지 용량은 줄이고 품질은 높여 워드프레스 접속속도를 개선합니다.

 

워드프레스 이미지 압축 Webp 변환 - Imagify - Decre Yellow

워드프레스를 빠른 홈페이지로 만드는 방법은 데이터베이스 및 이미지등을 압축하는 방법이 있는데 저같은 경우는 워드프레스 이미지 압축 플러그인 뿐만 아니라 Gzip CSS 등등을 압축해주는 유

yellowit.co.kr

그 외에도 중복모듈로서 자바스크립트등을 삭제해주느것이 중요한데 최적화 플러그인을 여러개 사용하다보면 중복되어 작동되는경우가 있습니다.

특히 테마에서도 자체적으로 자바스크립트 압축이나 이미지 지연등이 중복기능이 있기 때문에 하나만 활성화 해주느것이 좋습니다.

워드프레스 모바일최적화

초기 서버 응답 시간 단축을 위해서는 무거운 테마나 플러그인등을 사용을 자제하는것이 좋습니다.

기본적으로 데스크탑과 달리 모바일 접속 시 AMP 앱을 설치해주면 속도가 크게 개선되지만 모바일 리디렉션 ?AMP를 활성화하면 레이아웃이 변경되기 때문에 필요에 따라 설정해주느것이 좋습니다.

모바일 "핸드폰 및 태블릿" 접속속도를 확인했다면 데스크탑 pc로 접속 시 속도도 측정해보고 동일하게 문제를 해결합니다.

 

#1 WordPress Caching Plugin | WP Rocket

Make your website reach the stars. Use the most powerful caching plugin for WordPress. WP Rocket is easy to use, ready to improve your SEO and conversions.

wp-rocket.me

워드프레스 사이트건강 체크

다음은 워드프레스의 관리자페이지에서 도구 -> 사이트건강으로 들어가면 현재 워드프레스 상태를 확인할 수 있습니다.

예정된 이벤트가 늦거나 지속적인 객체 캐시에 대한 성능저하 요소가 있습니다.

예정된 이벤트가 늦은 경우 WP-Cron이 비활성화되어 있으면 실패할 수 있으며 반대로 너무 자주 실행중이라면 속도를 지연시킬 수 있습니다.

wp-config.php 파일을 확인하고 wp-cron 비활성화하기 원한다면 아래 명령어를 추가합니다.

define('DISABLE_WP_CRON', 'true');

만약 예정된 이벤트 횟수를 1시간 단위로 지연하고 싶다면 아래 명령어를 추가합니다.

define('DISABLE_WP_CRON', 'true');

블루호스트 사용한다면 C-panel 에서 Cron Jobs 설정이 가능합니다.

블루호스트 ->  C-panel   -> ADVANED -> Cron Jobs

블루호스트 ->  C-panel  -> ADVANED -> Cron Jobs 들어갑니다.

워드프레스 예약된 이벤트 실행 

  • Common Setting : Once Per Hour 설정
  • Month : Every Sixth Hour 설정

그럼 매일 6시간 마다 예약된 작업을 실행하게 됩니다.

모든설정을 완료하면 Current Cron Josb 추가된것을 확인합니다.

문서에 유효한 rel=canonical 없음이 표시되는 경우 유사한 페이지에 대한 중복페이지를 해결해야합니다..

  • 검색 엔진이 여러 URL을 단일 선호 URL로 통합하는 데 도움이 됩니다. 예를 들어 다른 사이트에서 여러분의 페이지 링크 끝에 검색어 매개변수를 추가하면 검색 엔진이 해당 URL을 여러분이 선호하는 버전으로 통합합니다.
  • 추적 방법을 단순화합니다. 하나의 URL을 추적하는 것이 여러 URL을 추적하는 것보다 쉽습니다.
  • 여러분의 원본 콘텐츠에 대한 신디케이티드 링크를 여러분이 선호하는 URL로 다시 통합하여 신디케이티드 콘텐츠의 페이지 순위를 향상시킵니다.

그렇지 않다면 검색엔진에서는 유사한 글들을 중복페이지로 확인하고 검색엔진에 누락되게 되며 다음조건 중 하나라도 충족되는 페이지가 있다 정식링크를 추가해야합니다.

  • 하나 이상의 정식 링크가 있습니다.
  • 정식 링크가 유효한 URL이 아닙니다.
  • 정식 링크가 다른 지역 또는 언어의 페이지를 가리킵니다.
  • 정식 링크가 다른 도메인을 가리킵니다.
  • 정식 링크가 사이트 루트를 가리킵니다.
  • AMP 또는 모바일 페이지 변형과 같은 일부 시나리오에서 유효할 수 있지만 Lighthouse는 그럼에도 불구하고 이를 실패로 취급합니다.

Free SEO Checker

Free SEO Checker 

다음은 무료로 SEO 검사가 가능한 Free SEO Checker 기능을 통해 인터넷검색엔진최적화에 놓친 부분은 없는지 확인합니다.

여기서도 사용하지 않는 자바스크립를 줄이고 페이지 제목에 내용을 페이지 내용에 더 적합하다고 합니다.

제목 및 내용등을 어떻게 작성하느냐에 따라 검색엔진에 노출이 달라지기 때문에 추천하는 방향으로 내용을 추가하고 이미지의 경우 ALT 속성을 누락된 부분을 추가합니다.

페이지 응답시간이 느린경우 최대한 압축을 한 경우 호스팅 서버에 문제일 수 있습니다.

[IT 리뷰/블로그 SEO] - 워드프레스 트래픽 부족 - 서버 다운 및 느려짐 해결

공유호스팅 보다는 단일 웹 호스팅으로 변경하거나 VPS서버로 업그레이드 하느것을 권장합니다.

기본적인 문제점에 대한 내용이며 이부분을 찾아 해결하면 워드프레스 속도를 크게 개선할 수 있습니다.

기본적으로 문제점이 큰 부분부터 하나하나 해결해 나가는것을 추천하며 기본적으로 인터넷검색엔진에서 요구하는 항목은 아래 15가지입니다.

번호 항목 설명
1 타이틀 태그 (Title Tag) 페이지의 제목을 나타내는 인터넷 브라우저의 제일 위에 위치한 텍스트. 검색결과 페이지에 노출되며, 모든 페이지에 각기 다른 타이틀 태그가 적절히 있는지 여부
2 메타 디스크립션 (Meta Description) 웹 페이지에 대한 요약 설명글. 검색결과 페이지에 노출되며, 모든 페이지에 각기 다른 메타 디스크립션이 적절히 있는지 여부
3 404 에러 페이지 404는 파일이 없거나 파일 안에서 다른 파일을 호출할 때, 불러올 수 없으면 표시하는 에러 메시지며, 404 에러가 없는지 여부
4 캐노니컬 태그 (Canonical Tag) 웹페이지의 대표 URL 주소를 검색엔진에게 알려주는 태그이며, 모든 페이지에 있는지 여부
5 이미지 대체 텍스트(Alt Text) 이미지 대체 문구 텍스트 (alternative text) 가 적절히 있는지 여부
6 로봇 배제  표준(Robots.txt ) 웹사이트에 대한 검색엔진 로봇들의 접근을 조절, 제어하고 검색엔진 로봇에게 웹사이트의 사이트 맵이 어디 있는지 알려주는  규약이며, 해당 파일 존재 여부
7 사이트 맵 (Sitemap.xml) 웹사이트 내의 모든 페이지들을 나열한 파일이며, 해당 파일 존재 여부
8 오픈 그래프 (Open Graph) 페이스북에서 해당 웹사이트의 디테일한 정보를 제공하는 것을 가능하게 하는 기능이며, 관련 태그 보유 여부
9 트위터 카드 (Twitter Card) 트위터에서 링크를 공유할 때 추가적인 글과 이미지를 미리보기처럼 보는 기능이며, 관련 태그 보유 여부
10 플래시 사용 여부 애니메이션이 가능한 어도비 사의 기술이나, 검색엔진이 내용을 파악할 수 없어서 검색엔진 친화적이지 않음
11 웹 주소 친화도 기호나 숫자가 아닌 의미가 통하는 단어로 구성한 웹 주소는 방문자와 검색엔진에게 웹 콘텐츠를 이해하고 방문율을 높이는데 도움을 줌
12 구글 어낼리틱스 구글의 무료 웹 사이트 분석 툴로서, 관련 코드를 모든 웹 페이지에 있는지 진단
13 반응형 웹 디자인 모바일, 태블릿 등 다양한 디바이스에서 웹 콘텐츠를 제대로 보여주는지 진단
14 HTTPS 보안 프로토콜 기존의 웹 프로토콜인 HTTP 보다 보안이 강화된 HTTPS 프로토콜 사용 여부
15 스키마 마크업 (Schema Markup) 웹 사이트의 내용을 구조화하여 의미를 부여하는 규약이며, 관련 코드가 있는지 진단

워드프레스 RankMath SEO 분석

Rank Math - SEO Analysis

워드프레스 SEO를 위해서 Rank Math를 사용하는 경우 SEO Analysis를 사용하느것도 좋습니다.

현재 통과되지 않은 페이지 크기 및 시간등을 확인할 수 있습니다.

블루호스트를 사용하는 경우 PHP 버전 및 콘텐츠 압축을  활용합니다.

PHP 버전은 가장 최신버전으로 업데이트하고 메모리 제한 또한 보느것과 같이 설정해주면 워드프레스 속도도 올라가고 500 ERROR 등 내부오류등의 오류도 해결할 수 있습니다.

Optimzie Websit를 통해 Compress ALL Content를 압축합니다.

워드프레스 PHP 8.1 버전 업그레이드 설치

PHP 버전의 경우 7.3은 더이상 사용되지 않으며 2022년 11월  기준 가장 최신버전인 PHP 8.1 업데이트합니다.

이것으로 워드프레스 검색엔진 최적화를 위한 홈페이지 접속속도 및 누락된 메타정보 및 CSS, GIZP, 자바스크립트 등 데이터베이스 크기를 압축하여 줄이는 방법에 대해 알아보았습니다.

반응형

댓글