WordPress에 GZIP 압축을 활성화하는 방법

게시 됨: 2023-02-12

느린 웹 사이트는 많은 문제를 일으킬 수 있습니다. 잠재 방문자와 고객을 쫓아내고 사이트의 사용자 경험(UX)을 손상시키며 평판에 영향을 미칠 수도 있습니다.

웹 사이트 페이지의 크기를 줄이는 것은 로드 속도를 높이는 데 중요합니다. 다행스럽게도 GZIP 압축은 페이지 로딩 속도를 높이고 파일 크기를 줄이는 훌륭한 방법입니다.

이 가이드에서는 GZIP 압축의 정의와 기능을 포함하여 GZIP 압축의 기본 사항을 살펴보겠습니다. 그런 다음 WordPress 웹 사이트에서 GZIP 압축을 활성화하는 방법을 자세히 설명합니다. 바로 뛰어들자!

목차
1. GZIP 압축이란 무엇입니까?
2. GZIP 압축은 무엇을 합니까?
3. GZIP 압축이 활성화되어 있는지 확인하는 방법
4. WordPress에서 GZIP 압축을 활성화하는 방법
4.1. 플러그인으로 GZIP 압축 활성화
4.2. Nginx용 GZIP 압축 활성화
4.3. Apache용 GZIP 압축 활성화(.htaccess 파일 편집)
5. WP 엔진으로 계속 학습

GZIP 압축이란 무엇입니까?

GZIP 압축은 ZIP 및 RAR과 유사한 데이터 압축 유형입니다. 텍스트, HTML, CSS, JavaScript 또는 XML 등 웹 사이트의 모든 파일을 압축하는 데 사용할 수 있습니다.

파일이 방문자의 웹 브라우저에 제공되기 전에 GZIP 압축이 발생합니다. 이 방법을 통해 GZIP 압축은 파일 크기를 줄여 웹사이트 로딩 시간에 긍정적인 영향을 줄 수 있습니다.

GZIP 압축은 무엇을 합니까?

방문자가 웹사이트를 방문하면 브라우저는 서버에서 사이트의 파일을 요청합니다. 서버는 해당 파일을 브라우저로 보내기 전에 압축합니다. GZIP 압축은 파일 압축 방법 중 하나입니다.

압축된 파일은 압축되지 않은 파일보다 빠르게 전송됩니다. 이는 웹 사이트 성능과 로딩 속도를 개선하는 데 도움이 되며 결과적으로 검색 엔진 최적화(SEO)가 향상됩니다.

GZIP 압축이 활성화되었는지 확인하는 방법

GZIP 압축은 널리 사용되며 많은 WordPress 호스팅 플랫폼에서 기본적으로 사용합니다. 사이트에서 GZIP 압축이 작동하는지 확인하는 방법이 확실하지 않은 경우 타사 솔루션이나 브라우저 내 개발자 도구를 사용하여 테스트할 수 있습니다.

GZIP 압축을 활성화하지 않은 경우 일반적으로 GTmetrix와 같은 도구에 경고가 표시됩니다. GZIP 압축 도구를 사용하여 웹 사이트에서 GZIP 압축을 사용하고 있는지 확인할 수도 있습니다.

브라우저 개발자 도구를 사용하여 GZIP 압축이 작동하는지 확인할 수도 있습니다. 활성화되면 응답 헤더에 "content-encoding: gzip"이 포함됩니다.

Chrome에서 응답 헤더를 찾으려면 DevTools를 열고 Network 로 이동한 다음 페이지를 새로고침해야 합니다. 귀하의 웹사이트와 일치하는 이름을 클릭하면 응답 헤더가 열립니다.

WordPress에서 GZIP 압축을 활성화하는 방법

WP 엔진의 모든 웹사이트는 GZIP 압축을 기본값으로 사용합니다. 텍스트 파일, 이미지, CSS 및 JavaScript를 포함한 모든 정적 파일은 최적의 웹 사이트 성능을 위해 자동으로 압축됩니다. 이 자동 압축은 .htaccess 파일에서 GZIP 지시문의 필요성을 줄입니다.

그러나 모든 WordPress 웹사이트가 WP 엔진에서 호스팅되는 것은 아니며 GZIP 압축의 기본 활성화로 인한 이점은 없습니다. 웹 사이트가 다른 플랫폼에서 호스팅되는 경우 GZIP 압축을 수동으로 활성화해야 할 수 있습니다. 이를 수행하는 방법에는 여러 가지가 있으며 다음에 살펴보겠습니다.

플러그인으로 GZIP 압축 활성화

GZIP 압축을 활성화하는 가장 쉬운 방법은 캐싱 플러그인을 사용하는 것입니다. WP Rocket과 같은 도구는 .htaccess 파일에 코드를 추가하여 압축을 가능하게 하지만 W3 Total Cache와 같은 다른 도구는 해당 코드를 수동으로 추가해야 합니다.

이것은 일반적으로 GZIP 압축을 추가하는 가장 간단한 방법이지만 사이트에 추가 플러그인을 추가해야 합니다. 플러그인 라이브러리를 간결하게 유지하려는 경우 다음 솔루션 중 하나를 대신 사용할 수 있습니다.

Nginx용 GZIP 압축 활성화

웹 사이트에서 Nginx를 사용하는 경우 GZIP 압축을 활성화하는 데 사용할 수 있는 코드 스니펫이 있습니다. 아래의 코드 스니펫을 사이트의 nginx.conf 파일의 "http" 섹션에 배치해야 합니다. 이 코드 스니펫을 서버 또는 위치 구성 블록에 배치할 수도 있지만 일반적으로 http 섹션이 권장됩니다.

gzip on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;
gzip_min_length 1000;
gzip_vary on;
gzip_proxied no-cache no-store private expired auth;
gzip_diable “MSIE [1-6];

파일을 저장하고 닫은 후에는 Nginx를 다시 시작해야 합니다. 이렇게 하려면 다음 명령을 사용합니다.

sudo service nginx restart

다시 시작한 후 이전에 설명한 방법을 사용하여 GZIP 압축이 활성화되어 있는지 확인하십시오.

Apache용 GZIP 압축 활성화(.htaccess 파일 편집)

웹 호스트에서 Apache를 사용하는 경우 .htaccess 파일을 편집하여 GZIP 압축을 활성화해야 합니다. 이 파일은 파일 전송 프로토콜(FTP) 또는 파일 관리자를 통해 WordPress 설치의 루트 디렉터리에서 찾을 수 있습니다. 대부분의 WordPress GZIP 압축 방법은 .htaccess 파일을 편집해야 합니다.

GZIP을 활성화하는 데 사용할 수 있는 두 가지 Apache 모드가 있지만 mod_deflate는 가장 광범위하게 지원되고 가장 잘 문서화된 옵션입니다. mod_deflate 를 활성화하려면 다음을 추가하십시오.

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml

# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
</IfModule>

대신 mod_gzip을 활성화하려면 다음을 추가하십시오.

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_include mime ^text/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_include handler ^cgi-script$
</ifModule>

mod를 사용하기 전에 .htaccess 파일을 백업하고 mod_filter 모듈이 서버에 있는지 확인해야 합니다. 그렇지 않으면 500 오류가 발생할 수 있습니다.

WP 엔진으로 계속 학습

웹사이트 페이지의 크기를 줄이면 로딩 시간을 줄이고 전반적인 성능을 높일 수 있습니다. GZIP 압축은 이 감소를 활성화할 수 있지만 활성화된 경우에만 가능합니다.

다행히 여기 WP Engine에서는 기본적으로 GZIP 압축을 활성화합니다. 또한 방문자를 위한 뛰어난 디지털 경험을 구축하는 방법을 배우는 데 도움이 되는 뛰어난 리소스를 제공합니다!