웹사이트 속도, 무엇부터 고쳐야 합니까

먼저 무엇이 느린지 나눕니다

「느리다」에는 서로 다른 세 가지가 섞여 있습니다. 어느 쪽인지 먼저 갈라야 고칠 것이 정해집니다.

• 서버가 늦게 답한다

  주소를 눌러도 한참 흰 화면입니다. 서버나 데이터베이스 조회가 원인입니다.

• 화면이 늦게 그려진다

  응답은 왔는데 내용이 늦게 보입니다. 큰 이미지나 글꼴이 원인인 경우가 많습니다.

• 보이는데 눌리지 않는다

  화면은 나왔는데 버튼이 반응하지 않습니다. 스크립트가 원인입니다.

이미지 — 대부분 여기서 나옵니다

기업 사이트에서 페이지 용량의 대부분은 이미지입니다. 촬영 원본을 그대로 올려 한 장이 몇 메가바이트인 경우가 흔합니다.

화면에 보이는 크기에 맞춰 줄이고, 최근 형식으로 저장하면 용량이 크게 줄어듭니다. 같은 화질로 절반 아래가 되는 경우가 많습니다.

첫 화면 아래에 있는 이미지는 나중에 불러오게 하십시오. 반대로 첫 화면의 큰 이미지는 먼저 불러오도록 지정해야 합니다.

관리자에서 이미지를 올릴 때 자동으로 줄여 주도록 만들어 두면 오픈 후에도 상태가 유지됩니다. 이 장치가 없으면 몇 달 뒤 다시 무거워집니다.

외부 스크립트 — 눈에 안 보이는 무게

광고 추적, 방문 분석, 채팅, 지도, 글꼴처럼 외부에서 불러오는 것이 쌓입니다. 하나씩은 작아도 열 개가 넘어가면 차이가 큽니다.

지금 실려 있는 목록을 뽑아 보십시오. 몇 해 전 캠페인 때 넣고 그대로 둔 것이 남아 있는 경우가 많습니다. 쓰지 않는 것을 걷어내는 것만으로 개선되기도 합니다.

남길 것은 화면이 그려진 뒤에 불러오게 미룹니다. 첫 화면을 그리는 일과 다투지 않게 하는 것입니다.

글꼴

브랜드 글꼴을 쓰면 그 파일을 내려받는 동안 글자가 안 보이거나 다른 글꼴로 잠깐 보입니다.

쓰는 굵기만 골라 싣고, 한글은 자주 쓰는 글자만 담은 파일로 나누면 용량이 줄어듭니다. 내려받는 동안 기본 글꼴로 먼저 보여 주도록 설정해 두면 글자가 사라지는 구간이 없어집니다.

서버 쪽

여기까지 하고도 느리면 서버를 봅니다. 데이터베이스 조회가 오래 걸리거나, 한 페이지에서 조회를 너무 많이 하는 경우가 대표적입니다.

자주 바뀌지 않는 내용은 만들어 둔 결과를 재사용하게 하면 응답이 빨라집니다. 이미지·CSS·스크립트는 브라우저가 저장해 두게 하면 두 번째 방문부터 훨씬 빠릅니다.

다만 저장 기간을 길게 잡으면 파일을 바꿔도 방문자에게 반영되지 않습니다. 파일 이름이나 주소에 버전을 붙여 바뀐 것을 알 수 있게 해야 합니다.

측정하는 방법

검색엔진이 제공하는 측정 도구로 지금 상태를 확인할 수 있습니다. 실제 방문자의 기기에서 측정된 값을 함께 보여 주는 도구도 있습니다.

측정할 때는 실제 방문자와 비슷한 조건으로 보십시오. 사무실의 빠른 인터넷에서 잰 값은 휴대폰으로 들어오는 방문자의 경험과 다릅니다.

고치기 전과 후를 같은 조건에서 재어 두면 무엇이 효과가 있었는지 알 수 있습니다.