웹사이트 속도 최적화 – 구글 페이지 스피드 점수 올리는 법

웹사이트 속도는 SEO와 사용자 경험(UX)에 큰 영향을 미칩니다. 구글은 페이지 로딩 속도가 빠른 웹사이트를 검색 순위에서 우대하며, 사용자가 오래 머무를 가능성이 높아집니다.

이번 글에서는 구글 페이지 스피드 점수를 올리고 웹사이트 로딩 속도를 최적화하는 방법을 단계별로 소개합니다.

1. 웹사이트 속도 측정 – 현재 점수 확인하기

먼저 구글 페이지 스피드 인사이트(PageSpeed Insights)를 사용해 현재 웹사이트 속도를 측정해야 합니다.

✔️ 웹사이트 속도 측정 방법

1. Google PageSpeed Insights 접속
2. 웹사이트 URL 입력 후 [분석] 클릭
3. 데스크톱 & 모바일 성능 점수 확인

보통 점수 기준은 다음과 같습니다.

• 90~100점 → 매우 빠름 (최적화 완료)
• 50~89점 → 보통 (개선 필요)
• 0~49점 → 느림 (긴급 최적화 필요)

이제 웹사이트 속도를 높이기 위한 최적화 방법을 살펴보겠습니다.

2. 이미지 최적화 – 웹사이트 속도 개선의 핵심

이미지는 웹페이지에서 가장 많은 용량을 차지하므로 압축 및 포맷 변경이 필수입니다.

✔️ 이미지 최적화 방법

• JPG 대신 WebP 포맷 사용 (구글이 추천하는 차세대 포맷)
• PNG 이미지는 투명도가 필요할 때만 사용
• 압축 도구 활용 (예: TinyPNG, Squoosh)

✔️ HTML 예제 (WebP 이미지 사용)

<picture>
    <source srcset="image.webp" type="image/webp">
    <img src="image.jpg" alt="최적화된 이미지">
</picture>

3. 브라우저 캐싱 설정 – 반복 방문 속도 향상

캐싱(Cache)은 웹페이지의 정적 리소스를 사용자의 브라우저에 저장하여 재방문 시 로딩 속도를 빠르게 하는 방법입니다.

✔️ .htaccess 파일에서 캐싱 활성화

<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType text/css "access plus 1 month"
    ExpiresByType application/javascript "access plus 1 month"
</IfModule>

4. CSS & JavaScript 최적화 – 코드 정리로 속도 향상

불필요한 CSS와 JavaScript 파일을 줄이면 웹사이트가 훨씬 빠르게 로드됩니다.

✔️ CSS & JS 최적화 방법

• CSS & JS 파일 최소화 (Minify) → CSS Minifier, JS Minifier 활용
• 불필요한 CSS 제거 → PurifyCSS 사용
• JavaScript 비동기 로딩 (async 또는 defer 사용)

✔️ JavaScript 비동기 로딩 예제

<script src="script.js" defer></script>

5. CDN(Content Delivery Network) 사용 – 글로벌 속도 최적화

CDN은 웹사이트 데이터를 전 세계 여러 서버에 분산하여 사용자가 가장 가까운 서버에서 빠르게 콘텐츠를 받을 수 있도록 합니다.

✔️ 무료 CDN 서비스 추천

• Cloudflare (가장 인기 있음)
• AWS CloudFront
• Fastly

6. 웹폰트 최적화 – 글꼴 로딩 속도 줄이기

웹폰트는 사이트 디자인에 중요하지만, 최적화되지 않으면 속도를 저하시킬 수 있습니다.

✔️ 웹폰트 최적화 방법

• 필요한 글자만 포함된 웹폰트 사용 (Google Fonts Subset 활용)
• 웹폰트 미리 로드 (Preload) 설정

✔️ 웹폰트 최적화 예제

<link rel="preload" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">

💡 결론 – 페이지 속도 최적화를 위한 핵심 체크리스트

웹사이트 속도를 최적화하면 검색 순위와 사용자 만족도가 높아집니다.

✔️ 속도 최적화 핵심 체크리스트

• ✅ 이미지 최적화 – WebP 사용 및 압축
• ✅ 브라우저 캐싱 설정 – .htaccess에서 설정
• ✅ CSS & JS 파일 최소화 – Minify 적용
• ✅ CDN 활용 – Cloudflare 등 사용
• ✅ 웹폰트 최적화 – 필요 글자만 로드

이제 구글 페이지 스피드 점수를 높이고, 빠르고 최적화된 웹사이트를 운영해 보세요!