적절한 최적화를 통한 웹사이트 로딩 속도 향상을 위한 팁

사용자는 일상 업무에서 다양한 이유로 웹 사이트를 사용합니다. 사용자가 전화기에서든 책상에서든 디지털 비서를 사용하여 요청을 검색하면 빠르고 관련성 높은 답변을 기대합니다.

예를 들어 사용자가 '웹 사이트 로드 속도' 쿼리를 처음 작성하면 일반적으로 첫 번째 표시된 결과를 클릭하지만 페이지 로드 속도가 예상보다 훨씬 길면 좋은 기회가 있습니다. 사용자가 다른 사이트로 이동할 수 있습니다.

귀하의 비즈니스를 위해 설계된 사이트만으로는 이제 작동하지 않습니다. 웹 사이트 로드 속도를 개선하는 것도 중요한 프로세스입니다. Google 가이드라인에 따르면 웹사이트는 3초 이내에 로드되어야 합니다.

또한 몇 년 전에 실시한 설문 조사에 따르면 사용자가 다운로드하는 데 25초 이상 걸리면 웹사이트를 떠나는 것으로 나타났습니다. 이는 웹 사이트의 느린 로딩 속도가 사이트 트래픽 감소와 사이트 순위 저하를 초래함을 나타냅니다.

웹사이트의 느린 로딩 속도는 다음과 같이 온라인 활동에 영향을 미칩니다.

1. 변환
2. 시계

1. 전환

웹 사이트의 로딩 속도를 최적화하는 것은 온라인 활동에 직간접적으로 영향을 미칩니다. 웹사이트의 느린 로딩 속도는 특정 웹사이트의 전환율에 영향을 미칩니다.

Hub Spot에 게재된 보고서에 따르면 페이지 로딩이 1초만 지연되어도 기업의 전환율이 최대 7~8% 감소할 수 있다고 합니다. 웹 사이트를 로드하는 데 시간이 너무 오래 걸리는 경우 때때로 매우 실망스러울 수 있습니다.

트래픽의 약 40~45%가 이 페이지를 떠나 다른 사이트로 이동합니다. 이것은 1-2초 지연이 모든 활동을 다른 경쟁 사이트로 이전할 수 있고 해당 회사에 상당한 수익 손실을 초래할 수 있음을 의미합니다.

2. 가시성

느린 로딩 속도는 웹사이트의 바운스 랫에도 영향을 미칩니다. 이탈률이 무엇인지 모르는 사람들을 위해, 이것은 페이지를 본 직후 웹사이트를 떠나 다른 웹사이트에 접속한 사용자의 비율입니다.

이것은 또한 자연 검색 결과에서 낮은 순위로 이어집니다. 이탈률이 낮을수록 순위가 높아집니다.

또한 성능이 가장 낮은 웹 사이트는 고객을 유지하지 못하는 것이 주요 활동 이유입니다.

웹 사이트가 더 효율적일수록 고객은 더 만족할 것이며 회사의 주요 역할은 고객을 만족시키는 것입니다.

그러나 웹 페이지를 로드하는 데 시간이 너무 오래 걸리면 고객은 곧 좌절할 것입니다.

최신 Google 광고에 따르면 모바일 페이지가 먼저 색인이 생성됩니다. 이는 Google에서 실적이 저조한 웹사이트를 위한 공간이 없음을 의미합니다.

자연 검색 결과에서 웹사이트의 순위를 지정하려면 데스크톱 및 모바일 버전 모두에 대해 웹사이트를 최적화해야 합니다.

보고서에 따르면 모바일 버전에서 웹 페이지를 로드하는 데 약 3초가 걸립니다.

따라서 웹 페이지를 그보다 적게 로드하도록 최적화하면 사용자는 다른 웹 사이트보다 경쟁 우위를 확보할 수 있으며 웹 사이트의 유기적 검색 결과에서 웹 사이트의 순위를 매기기 쉽습니다.

모바일 버전에서 더 빠르게 로드되는 웹 페이지의 경우 가속 모바일 페이지(AMP)에 대해 이야기합니다. 이제 적절한 최적화를 통해 웹사이트의 로딩 속도를 향상시키는 것이 매우 중요해졌습니다.

이 최적화는 다음과 같은 방법으로 수행할 수 있습니다.

1. 웹사이트를 더 나은 호스트로 옮기기
2. 서버 응답 시간 단축
3. CSS 및 JavaScript 파일 수 줄이기
4. 파일 줄이기 및 결합 시도
5. 자바스크립트 로드 연기
6. 이미지 크기 최적화
7. 플러그인 및 위젯 수 줄이기
8. 콘텐츠 배포 네트워크 사용
9. 로딩 속도를 줄이는 대역폭
10. 브라우저 캐싱 사용
11. 추천 줄이기
12. 외부 스크립트 줄이기
13. 시간 경과에 따른 속도 모니터링 시작
14. 모바일 페이지의 속도 모니터링

1. 웹사이트를 더 나은 호스트로 이동 공유 호스팅

1. 호스팅 가상
2. 사설 서버(VPS)
3. 전용 서버

(a) 공유 호스팅 – 프로세서와 RAM을 공유하므로 가상 사설 호스트 및 전용 서버에 비해 속도가 느려지기 때문에 가장 저렴한 호스팅 유형입니다.

이것은 귀하의 사이트를 매우 빠르고 저렴하게 온라인에 올릴 수 있는 세계에서 가장 인기 있는 호스팅 유형입니다.

(b) 가상 사설 서버(VPS) 호스팅 – 공유 호스팅으로 가는 가장 빠른 방법입니다. 여기서 서버는 공유되지만 다른 클라이언트가 정보에 액세스할 수 없는 VPS의 고유한 부분도 있습니다.

이는 제한된 기간 동안만 트래픽을 증가시키는 전자 상거래와 같은 사이트에 유용합니다.

(c) 전용 서버 – 가장 비싼 서버 유형 자신의 물리적 서버입니다. 여기서 서버를 임대하고 특정 관리자에게 유지 관리를 요청합니다.

2. 서버 응답 시간 단축

DNS 조회는 웹페이지 로딩 시간에 영향을 미칩니다. DNS는 도메인 이름 시스템을 나타냅니다. 기본적으로 URL을 IP 주소로 변환하는 반면 DNS 조회는 데이터베이스에서 특정 DNS 레코드를 찾습니다.

예를 들어, www.facebook.com 웹사이트의 URL을 입력한다고 가정해 봅시다. DNS는 이를 매우 길고 사용자가 기억하기 어려운 IP 주소로 변환합니다. 이 시간은 DNS 서버의 속도에 따라 달라지며 사이트 로드 속도를 결정합니다.

3. CSS 및 JavaScript 파일 수 줄이기

사이트에 적절한 JavaScript 및 CSS 아카이브 레이아웃이 포함되어 있는 경우 사이트 방문자가 너무 명시적인 레코드를 가져와야 할 때 많은 종류의 HTTP 요청이 생성됩니다.

이러한 요청은 방문자의 프로그램에 의해 자율적으로 관리되며 사이트 작업을 조정합니다. JavaScript 및 CSS 레코드의 양을 거부하면 사이트가 가속화되지 않습니다.

모든 JavaScript를 하나로 통합하고 모든 CSS 아카이브를 상속하도록 노력하십시오. 이렇게 하면 모든 HTTP 요청을 줄일 수 있습니다. HTML, CSS 및 JavaScript 아카이브를 빠르게 줄일 수 있는 엄청난 양의 도구가 있습니다.

예를 들어, WillPeavy, Script Minifier 또는 Grunt 장치를 사용할 수 있습니다.

4. 파일 줄이기 및 결합 시도

아시다시피 작은 코드라도 파일 크기를 증가시켜 웹사이트의 로딩 속도를 더욱 낮출 수 있습니다. 파일 크기를 줄여야 하는 경우가 있습니다.

이 작업을 수행하는 가장 좋은 방법은 웹사이트의 모양을 담당하는 HTML 및 JavaScript로 시작하는 것입니다.

또한 파일 크기에 불필요하게 추가되는 작은 파일을 최소화하고 결합하십시오. 여기서 축소는 불필요한 서식과 공백을 제거하는 것입니다.

5. 자바스크립트 로딩 연기

JavaScript 보고는 페이지 내용이 로드될 때까지 JavaScript 로드 또는 분석이 시작되지 않음을 의미합니다. 이는 페이지의 기본 렌더링에 영향을 미치지 않습니다.

페이지 분석이 완료되면 스크립트 실행이 시작됩니다. 이러한 제안 중 하나는 페이지가 끝나기 직전에 JavaScript를 페이지 하단에 로드해야 한다는 것입니다. 상표.

다시 말하지만, JavaScript를 페이지 맨 아래에 배치하면 사용자가 먼저 페이지 로드를 확인한 다음 JavaScript 코드가 백그라운드에서 로드됩니다.

6. 이미지 크기 최적화

이미지는 시각적인 매력을 부여하고 사이트와 상호 작용하도록 점점 더 많은 사용자를 끌어들이기 때문에 웹사이트에서 매우 중요한 부분입니다. 이미지가 없고 콘텐츠만 있는 웹사이트는 사용자가 가장 선호하지 않는 웹사이트입니다.

특히 전자 상거래 사이트와 같은 전자 상거래 사이트는 사용자에게 제품에 대한 보다 명확한 정보를 제공하고 웹 사이트 활동을 증가시키기 때문에 웹 사이트의 필수적인 부분입니다.

이 차원에서 변환 속도를 얻는 가장 이상적인 접근 방식에는 친절한 개체 사진 더미가 포함됩니다. 공지에 따르면 구매자의 66%는 구매하기 전에 최소 3장의 사진을 볼 필요가 있다고 말했습니다.

이는 전자상거래 사이트를 효과적으로 관리하기 위해서는 이미지가 절대적으로 필요하다는 것을 의미합니다.

그러나 동시에 이러한 이미지는 웹사이트의 로딩 속도도 감소시킨다는 점에 유의해야 합니다.

이 경우 반응형 웹사이트를 정의하는 민감한 HTML 이미지를 사용해야 합니다. 또 다른 솔루션은 이미지를 압축하여 이미지 품질을 손상시키는 것입니다. 이 방법은 웹 사이트에서 선호하지 않지만 이미지 품질을 손상시킬 수는 없습니다.

7. 플러그인 및 위젯 수 줄이기

플러그인은 이제 웹사이트의 중요한 부분이 되었습니다. 그들은 특정 기능을 추가하여 웹 사이트와 함께 작동합니다.

이것은 웹 사이트를 기능의 수 측면에서 매우 풍부하게 만듭니다. 그러나 이러한 플러그인은 웹사이트의 로딩 속도를 늦추고 웹사이트의 성능에도 영향을 미치므로 주의해야 합니다.

가장 먼저 할 일은 어떤 플러그인이 실제로 사이트의 속도를 늦추는지 확인하는 것입니다. 플러그인을 가능한 한 적게 유지하려고 노력해야 합니다. 그렇지 않으면 로딩 속도가 점차 감소하기 시작합니다.

8. 콘텐츠 전송 네트워크 사용

이것은 사용자에게 웹사이트의 콘텐츠를 제공하는 지리적으로 분산된 웹 서버의 집합입니다. 단일 서버에서 호스트하는 경우 모든 요청이 동일한 하드웨어에서 전송되고 각 요청에 개별적으로 응답하므로 각 요청의 응답이 느려집니다.

CDN의 도움으로 사용자의 요청이 가장 가까운 서버로 전송되어 웹사이트의 로딩 속도가 빨라집니다. 약간 비싸지 만 사이트 속도를 향상시키는 매우 효과적인 방법입니다.

9. 로딩 속도를 줄이는 대역폭

때때로 웹사이트 디자인을 변경하면 사용자가 할당한 웹사이트에서 대역폭이 확보됩니다. 이것은 때때로 웹사이트의 로딩 속도를 감소시킵니다.

10. 브라우저 캐싱 활성화

당신이 medium.com이라는 웹사이트를 방문했다고 가정해 봅시다. 어제와 같은 웹사이트를 다시 방문하면 이 웹사이트의 로딩 속도가 이전보다 훨씬 빨랐습니다. 이거 본 적 있어?

웹 사이트를 방문할 때마다 많은 양의 데이터가 하드 드라이브와 캐시에 저장됩니다. 다음에 동일한 웹사이트를 방문하면 디스크에 저장된 데이터가 해당 특정 웹사이트에 대해 저장되기 때문에 더 빨리 로드됩니다.

따라서 캐싱을 활성화하면 웹 사이트가 더 빨리 로드됩니다.

11. 리디렉션 줄이기

끊어진 링크 문제는 종종 리디렉션 기술을 사용하여 제거됩니다. 페이지를 이동하거나 삭제하면 리디렉션이 자주 수행됩니다. 그러나 Google에 따르면 리디렉션은 사이트에서 완전히 제거되어야 합니다. 어쨌든, 그것은 생각할 수 있는 모든 의도와 목적을 위한 것은 아니기 때문입니다.

따라서 최소화할 필요가 있습니다. 많은 시장 도구는 사이트에 대한 모든 리디렉션을 식별하기 때문에 모든 웹사이트 리디렉션을 찾습니다.

모든 리디렉션을 분석한 후 최소화하십시오. 다른 웹사이트를 통해 웹사이트에 링크된 페이지를 볼 수도 있습니다.

12. 외부 스크립트 최소화

위에서 논의한 바와 같이 JavaScript와 CSS는 느린 로딩 페이지를 담당합니다. 그러나 그 외에도 사이트의 로딩 속도에 영향을 미치는 다른 외부 스크립트도 있습니다. Chrome 개발자 도구의 네트워크 탭을 다시 열어 찾을 수 있습니다.

예를 들어 사이트가 열리면 모든 사람이 Facebook을 열면 이러한 외부 스크립트가 코드에 첨부됩니다.

이것은 JavaScript와 CSS가 스크립트에 영향을 미치고 웹사이트의 속도를 늦추는 유일한 원인이 아님을 나타냅니다. 다른 타사 스크립트도 웹사이트의 성능에 영향을 미칩니다.

13. 시간이 지남에 따라 속도 모니터링 시작

웹사이트를 최적화한 후 몇 시간 간격으로 속도 모니터링을 시작합니다. 웹사이트를 열고 웹사이트의 로딩 시간을 기록하기만 하면 됩니다. 다른 시장 도구를 사용하여 웹사이트의 속도를 모니터링할 수도 있습니다.

14. 모바일 페이지의 속도 모니터링

위에서 언급했듯이 Google은 웹사이트의 모바일 페이지에 대한 색인 생성도 시작했습니다. 따라서 모바일 웹사이트의 속도도 테스트하고 모니터링하는 중요한 요소가 되었습니다.

최근 보고서에 따르면 데스크톱에서도 점진적인 변화가 있었던 것으로 보입니다. 인터넷 사용자에서 모바일 사용자로 시간이 지남에 따라 모바일 페이지의 속도를 모니터링하는 것이 필수적이 되었습니다.

웹사이트가 데스크톱 컴퓨터에서는 빠르게 로드되지만 모바일 페이지는 그리 빠르지 않은 경우 자연 검색 결과에 따라 웹사이트 순위가 낮아집니다.

결론

작업은 그렇게 쉽지 않을 것이며 사용자는 오늘 어떤 수단도 구현할 것으로 기대하지 않습니다. 우리는 웹사이트에서 더 많은 시간을 보내고 각 단계를 분석하려고 노력해야 합니다.

각 단계의 효과를 확인한 후 다음 단계로 이동합니다. 이것은 웹사이트의 동작과 프런트 엔드, 플러그인, 코딩, 스타일 시트, 서버 호스팅 또는 기타 요소의 작은 변경이 웹사이트 성능에 어떤 영향을 미칠 수 있는지 이해하는 데 도움이 됩니다.

또한 그 중 일부는 사소해 보일 수 있으며 부하의 부담을 줄이기 위한 작은 단계라도 어느 정도 영향을 미칠 수 있으며 한 순간이 변경 사항과 성과에 미칠 수 있는 영향을 고려할 때 모든 상황에도 불구하고 상당히 정당합니다. 문제.