Shopify 스토어의 속도를 최적화하는 7가지 방법

방문자의 거의 1/4은 로드하는 데 4초 이상 걸리면 사이트를 떠납니다. 이들 중 46%는 웹사이트 성능이 좋지 않아 사이트를 다시 방문하지 않습니다. 느린 사이트는 열악한 고객 경험으로 이어지고 고객을 멀어지게 합니다.

웹사이트가 콘텐츠를 로드할 때까지 15초를 기다리시겠습니까? 당신은 즉시 사이트를 떠나 다른 상점을 찾습니다. 따라서 느린 사이트는 웹사이트 트래픽을 방해하고 이탈률을 높입니다. 이 두 가지 모두 잠재적인 고객 기반에 부정적인 영향을 미칩니다.

사이트 속도는 기술 유지 관리에만 국한되지 않습니다. 수익에 직접적인 영향을 미칩니다. 그렇다면 Shopify 스토어 사이트 속도를 어떻게 수정합니까? 오늘은 Shopify 스토어 사이트 속도를 최적화하기 위한 7가지 팁을 살펴보겠습니다.

1. 이미지 최적화
2. 타사 앱 분석
3. AMP(Accelerated Mobile Pages) 구현
4. 올바른 테마 및 기능 선택
5. 게으른 로더
6. 팝업 피하기
7. 리디렉션 및 끊어진 링크 줄이기
8. Shopify 스토어 사이트 속도 벤치마크

Shopify는 대시보드 자체에서 사이트 속도 점수를 제공합니다. 이 점수는 Google Lighthouse 성능 측정항목을 기반으로 사이트가 로드되는 속도를 측정합니다. 평균 Shopify 사이트 속도 점수는 50입니다. 70 이상이면 속도 점수가 좋습니다.

사이트 점수가 50점 미만인 경우 이러한 전술을 사용하여 사이트 성능을 개선해야 합니다. 이 외에도 Java 및 HTML 스크립트 축소 또는 CSS 및 Javascript 렌더링 차단과 같은 기술적 뉘앙스에 대한 전문적인 도움을 받아야 합니다. Shopify 사이트는 HTML, CSS, Javascript 등에서 많이 작동하므로 사이트 속도가 느려집니다. 따라서 아래에 언급된 팁 중 어느 것도 작동하지 않으면 코드와 사이트 백엔드를 확인하십시오.

1. 이미지 최적화

기본 사항부터 시작하십시오: 이미지. 고해상도 이미지는 사이트 속도를 늦출 수 있습니다. 상점에 HD 이미지, 그래픽 및 비디오가 여러 개 있는 경우 사이트가 많이 지연됩니다. 다음은 이미지를 최적화하고 사이트 속도를 향상시키는 5가지 방법입니다.

압축된 이미지 업로드

파일 크기를 줄이고 사이트에 로드합니다. 그러나 품질이 낮은 이미지를 방지하려면 지정된 이미지 크기를 따라야 합니다.

슬라이더를 피하고 영웅 레이아웃을 선택하십시오

방문자의 1%만이 슬라이더를 통과합니다. 따라서 4-7개의 HD 이미지를 선택하는 대신 1개의 고해상도 이미지를 사용하십시오.

GIF나 동영상을 피하세요.

제품에 여러 이미지가 필요한 경우 3-4개의 고해상도 이미지로 이동하십시오. 고품질 GIF 또는 비디오는 방문자 시스템에서 지연되고 로드되는 데 시간이 걸릴 수 있습니다.

지연 로더 사용

많은 이미지, 동영상, GIF를 업로드하는 것을 지양할 수 없는 경우, 이 경우 사이트는 사용자의 화면에서 볼 수 있는 콘텐츠만 로드합니다. 따라서 사용자가 슬라이더를 열지 않거나 비디오에 도달하지 않는 한 로드되지 않습니다. 결과적으로 제한된 콘텐츠 로드뿐만 아니라 사이트가 더 빠르게 실행됩니다.

정적 이미지에 충실

GIF 또는 비디오 대신 사이트의 부하를 줄이고 속도를 크게 향상시킵니다.

2. 타사 앱 분석

타사 앱 설치는 Shopify 스토어 소유자의 표준 관행입니다. 성능 향상, 기능 추가, 자동화 등을 위해 이러한 기능을 추가합니다. 그러나 너무 많은 앱을 사용하면 코드에도 영향을 미칩니다. 느린 속도로 이어집니다. 그래서?

• 어떤 목적에도 도움이 되지 않고 쓸모가 없는 앱을 식별합니다.
• 이러한 앱을 제거합니다. 앱의 특정 기능이 효과가 없는 경우 제거하십시오.
• 기능을 비활성화하거나 앱을 제거해도 코드 통합은 제거되지 않습니다. 따라서 수동으로 제거해야 합니다.

사용하지 않는 앱을 ​​제거합니다. 그 외에도 사이트 속도를 방해하는 응용 프로그램에 대한 대안을 찾으십시오.

3. AMP(Accelerated Mobile Pages) 구현

2020년에는 웹사이트 트래픽의 61%가 미국에서 모바일 장치에서 발생했습니다. 사용자의 절반 이상이 전화로 매장을 확인하고 있습니다. 그러나 전화는 PC에서 일반 웹 사이트를로드하는 데 더 오래 걸립니다. 따라서 전화에 맞게 웹사이트를 최적화하는 것은 타협할 수 없습니다.

기술 팀에서 모바일 최적화를 도와드릴 수 있습니다. 그러나 Shopify 타사 앱 디렉터리의 일부 앱을 DIY에 추가할 수 있습니다. FireAMP 및 Shopsheriff와 같은 앱은 AMP에서 도움이 됩니다. 이를 설정하는 데 상당한 시간이 걸립니다. 그러나 그렇게 하면 훨씬 더 많은 잠재고객을 확보할 수 있습니다.

4. 올바른 테마 및 기능 선택

Shopify에는 방대한 테마, 기능 및 글꼴 라이브러리가 있습니다. 이것들은 웹사이트의 디자인을 향상시켜 매력적으로 보이게 합니다. 그러나 모든 추가 테마/기능으로 인해 사이트 속도가 느려집니다.

• 반응형 테마 를 추가해야 합니다. 테마가 웹사이트를 느리게 하는지 확인한 다음 교체하세요.
• 추가된 모든 기능이 사용되는지 여부를 분석합니다. 기능이 무가치한 경우 제거/비활성화합니다.
• 시스템 글꼴 선택 : Mono, Serif 및 Sans-serif. 사용자 시스템이 먼저 다운로드해야 하는 멋진 글꼴을 피하십시오. 이러한 경우 폰트를 다운로드하고, 폰트를 로딩하고, 웹사이트를 로딩하는데 많은 시간이 소요됩니다. Shopify는 다양한 글꼴 옵션을 제공하지만 기본 시스템 글꼴을 고수하는 것이 좋습니다.

모든 테마와 기능은 사이트 속도에 영향을 미치는 CSS/HTML에 무겁습니다. 현명하게 선택하고 불필요한 요소를 피하십시오.

5. 게으른 로더

지연 로딩은 페이지가 제한된 콘텐츠만 로드하는 최적화 기술입니다. 사용자가 상점/사이트의 특정 부분에 있는 경우 해당 특정 부분만 로드합니다. 지연된 비디오 로딩과 유사합니다. 필요하지 않은 경우 페이지는 사용자가 참여하는 요소만 로드합니다.

이미지, 동영상, GIF, 기타 대용량 파일을 많이 추가하는 매장에 효과적입니다. 상당한 로딩 시간을 절약하고 사이트 속도를 높일 수 있습니다.

6. 팝업 피하기

팝업은 기업이 정보 제품이나 뉴스레터를 강조하는 데 매우 중요합니다. 특정 콘텐츠가 주목을 받아 더 많은 관심을 끌 수 있도록 도와줍니다. 그러나 사이트 속도를 줄이고 사용자 경험에 영향을 미칩니다.

• 전체 페이지를 차지하는 큰 팝업을 사용하지 마십시오. 로딩 시간이 늘어나고 사이트 지연/정지가 발생합니다. 또한 전체 페이지를 덮는 팝업을 얻는 것은 사용자 측에서 실망스러울 수 있습니다.
• 특정 가치가 높은 페이지에 팝업을 사용합니다. 모든 단일 사이트/매장 페이지에 팝업을 추가할 필요는 없습니다. 요구 사항을 분석하고 적절하게 사용하십시오.
• 사용자가 웹사이트에서 마우스를 가져간 후 몇 초 후에 팝업을 표시합니다. 귀하의 웹사이트에 들어오고 나가는 사용자는 귀하의 팝업에 참여하지 않을 것입니다. 따라서 사용자가 상점에 방문한 후 7-15초 후에 팝업을 추가하십시오. 더 효과적이며 더 나은 클릭률을 제공합니다.

7. 리디렉션 및 끊어진 링크 줄이기

상점에는 다양한 리디렉션이나 끊어진 링크가 있을 수 있습니다. 그러나 사이트가 지연되고 속도가 크게 감소합니다. 404 리디렉션을 수행하여 Shopify 대시보드를 통해 직접 이 문제를 해결할 수 있습니다.

또는 사용자를 새 URL로 안내하는 301 리디렉션을 추가할 수 있습니다. 또한 기술 팀의 도움을 받아 이러한 링크를 제거할 수 있습니다. 깨진 링크를 제거하고 리디렉션을 줄입니다.

이 모든 팁 외에도 매장 최적화를 위해 Google 태그 관리자를 사용할 수 있습니다. 코드를 도구로 마이그레이션하면 모든 코드를 함께 비동기식으로 로드하는 데 도움이 됩니다. 기술적인 측면에서 스토어 속도를 향상시키는 방법은 여러 가지가 있습니다. HTML/CSS 축소, 렌더링 차단, 불필요한 코드 제거 및 마이그레이션을 의미할 수 있습니다.

그러나 사이트를 로드하는 데 평균적으로 얼마나 걸리나요? 몇 가지 벤치마크를 살펴보겠습니다.

8. Shopify 스토어 사이트 속도 벤치마크

대시보드에서 사용할 수 있는 좋은 Shopify 스토어 속도는 50 이상입니다. 그러나 사이트 속도를 확인하기 위해 배포할 수 있는 다른 도구가 있습니다.

평균 사이트는 첫 번째 이미지를 로드하는 데 약 3.8초가 걸리고 대화형이 되는 데 22.1초가 걸립니다. 사이트가 더 오래 걸리나요? Shopify 스토어의 사이트 로딩 속도를 확인하십시오.

다음은 평균 및 최고의 Shopify 스토어 속도 벤치마크를 보여주는 차트입니다.

이 외에도 여기에서 사이트 속도를 확인할 수도 있습니다.

이러한 사이트를 사용할 때 선명한 그림을 얻으려면 테스트를 세 번 실행하십시오. 거기에서 평균을 사용하지만 단일 테스트에 의존하지 마십시오. 이것은 더 나은 결과와 매장 속도에 대한 명확한 그림을 보장합니다.

자주 묻는 질문

Shopify 스토어에 가장 적합한 속도는 무엇입니까?

Shopify 속도 점수는 대시보드 자체에 반영됩니다. 상점은 50점 이상의 점수를 얻으려고 노력해야 합니다. 속도 점수 70점은 Shopify 상점에 좋은 것으로 간주됩니다.

웹 사이트, 특히 Shopify 웹 사이트를 느리게 만드는 가장 일반적인 항목은 무엇입니까?

저장 속도에 영향을 미치는 가장 일반적인 항목은 이미지와 무거운 백엔드 코드입니다. 고해상도 사진, 비디오 및 GIF는 로드하고 상호 작용하는 데 시간이 걸립니다. 반면에 테마, 기능 및 타사 앱은 웹사이트 코드를 증가시켜 스토어 속도를 감소시킵니다.