Shopify 속도 최적화를 수행하는 8가지 시도되고 진정한 방법

소개

Shopify 속도 최적화는 Shopify 스토어 소유자가 고려해야 하는 최고의 측면 중 하나입니다 . 로딩 속도가 느린 웹사이트는 높은 이탈률, 낮은 사용자 참여, 적은 트래픽으로 이어져 판매에 다양한 영향을 미칩니다. 사이트 속도와 페이지 성능이 적절하면 사이트의 SEO가 향상되고 사용자 경험(UX)이 향상됩니다. 결국, 그들은 검색 엔진 순위를 향상시킵니다.

이 기사에서는 LitExtension – #1 쇼핑 카트 마이그레이션 전문가 가 빠른 로딩 속도로 Shopify를 다른 사이트보다 돋보이게 만드는 방법을 안내합니다.

Shopify 스토어 성능을 최적화하는 방법에 대해 자세히 알아보기 전에 Shopify Review에 대한 이 비디오에서 이 놀라운 플랫폼에 대해 자세히 알아보세요!

상위 빠른 Shopify 속도 최적화 체크리스트

다음은 Shopify 스토어의 로딩 시간과 속도를 개선할 수 있는 입증된 8가지 방법입니다. 이러한 방법은 상점 소유자가 Shopify 페이지 속도 최적화를 통해 고객을 유지하고 새로운 구매자를 유치하는 데 도움이 될 수 있습니다.

1. 이미지 및 비디오 최적화

최적화되지 않은 많은 양의 이미지와 비디오가 웹사이트 속도 저하의 가장 흔한 원인입니다. 다음과 같이 Shopify 사이트의 속도를 높이기 위해 고려할 수 있는 4가지 솔루션 이 있습니다.

1.1. 이미지 압축 및 병합

큰 이미지를 압축 하는 것은 Shopify 사이트 속도를 높이는 가장 효율적인 방법 중 하나입니다. 특히 TinyJPG 또는 TinyPNG 는 무손실 압축으로 품질 저하 없이 이미지 크기를 압축할 수 있는 좋은 옵션입니다.

또는 서버의 이미지 요청 로드를 요구하는 다양한 이미지를 업로드할 때 이미지 통합을 선택할 수 있습니다. "CSS Sprites" 또는 "CSS Image Sprites" 라고 하는 많은 고유한 아이콘과 썸네일을 하나로 병합하는 데 도움이 됩니다. 이후 Shopify 속도 최적화를 잘 수행하게 됩니다.

1.2 지연 로드 이미지 사용

전자 상거래 웹 사이트는 수많은 페이지로 가득 차 있습니다. 고객이 웹 사이트의 링크를 클릭하면 브라우저가 작동을 시작하고 페이지에서 사용 가능한 모든 콘텐츠를 다운로드하여 웹 페이지를 탐색할 준비를 해야 합니다. 따라서 모든 콘텐츠를 로드하는 데 상당한 시간이 걸립니다.

Lazy-loading 을 사용하면 그녀는 사과가 될 것이고 문제는 능숙하게 해결될 것입니다. 수요와 공급의 원칙에 따라 작동합니다. 브라우저는 방문자가 처음 접하는 콘텐츠, 즉 스크롤 없이 볼 수 있는 콘텐츠만 로드합니다. 고객이 아래로 스크롤하지 않는 한 스크롤 없이 볼 수 있는 부분 아래의 콘텐츠는 표시되지 않습니다.

브라우저는 전체 웹사이트 콘텐츠를 한 번에 로드할 필요가 없으므로 Shopify 웹사이트 속도를 높이는 방법에 대한 질문을 해결하는 데 도움이 됩니다.

1.3 지연된 비디오 로딩 적용

판매자가 고려해야 하는 Shopify 사이트 속도를 개선하기 위한 또 다른 솔루션은 비디오입니다. 그런 면에서 동영상은 이미지와 매우 흡사합니다. 지연된 비디오 로딩은 필요할 때까지 비디오 리소스의 로딩을 연기함으로써 사이트가 더 빨리 로딩되도록 하는 성능 기술입니다.

이 기술을 사용하는 Shopify 속도 테스트가 있습니다. 2MB의 페이지 무게를 줄이고 페이지 로딩 속도를 0.75초 더 빠르게 하는 데 기여했습니다.

– 스피드부스터, 2021

1.4 GIF를 정적 이미지로 바꾸기

Shopify 속도 최적화를 실행할 때 GIF를 움직이지 않는 사진으로 교체하는 것은 말할 것도 없습니다. GIF는 고객 경험을 위한 귀중한 자산으로 볼 수 있습니다. UX 및 브랜딩 측면에서 Shopify 속도를 매혹적으로 향상시킵니다.

그러나 이러한 파일은 특히 크기가 크므 로 GIF 이미지에는 여러 프레임이 있습니다. 따라서 지속 시간이 길수록 더 많은 프레임으로 구성 됩니다. 동영상 2초 이내에 GIF에 20개 이상의 이미지가 포함될 수 있습니다. 이러한 파일은 사이트 무게에 크게 추가되므로 웹 사이트 전문가는 가능한 경우 정적 이미지로 전환하는 것이 좋습니다. 이것을 적어 두십시오. 이것은 Shopify 사이트 속도 최적화를 수행하는 가장 쉽고 빠른 방법 중 하나로 간주되어야 합니다!

2. 적절한 글꼴 선택

Shopify 속도 최적화를 수행하기 위해 제외할 수 없는 가장 주목할만한 요소 중 하나는 적절한 글꼴입니다. Shopify의 글꼴 라이브러리에는 시스템 글꼴, Google 글꼴 및 Monotype의 라이선스 글꼴 과 같은 글꼴 모음이 포함되어 있습니다. 이러한 모든 글꼴은 모든 Shopify 온라인 상점에서 무료로 사용할 수 있습니다.

고객의 컴퓨터에 없는 글꼴을 사용하는 경우 고객이 텍스트를 표시하기 위해 새 글꼴을 다운로드해야 하는 것은 짜증날 수 있습니다.

고객의 컴퓨터에 새 글꼴을 다운로드하지 않으려면 시스템 글꼴을 사용하는 것이 좋습니다. 시스템 글꼴은 대부분의 컴퓨터에 이미 존재하는 글꼴로 알려져 있습니다. mono, serif 또는 sans-serif family 와 같이 선택할 수 있는 옵션이 많이 있습니다. 이러한 패밀리 중에서 굵게 및 기울임꼴과 같은 글꼴 스타일을 사용할 수도 있습니다.

고객의 컴퓨터에 표시되는 서체는 사용 중인 운영 체제에 따라 결정됩니다. 시스템 글꼴 모음을 선택하면 다양한 서체 중에서 선택하여 텍스트를 렌더링할 수 있습니다.

• 모노 글꼴: Menlo, Consolas, Monaco, Liberation Mono 또는 Lucida Console.
• 산세리프 글꼴: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu 또는 Helvetica Neue.
• Serif 글꼴: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times 또는 Source Serif Pro.

3. 불필요한 Shopify 앱 제거

특히 기술에 익숙하지 않고 코딩에 대한 사전 경험이 없는 경우 앱이 편리하고 유용하다는 사실을 부인할 수 없습니다.

필요에 맞는 앱을 설치하여 Shopify 웹사이트에 더 많은 기능을 추가할 수 있습니다. 예를 들어 전자 상거래 상점 소유자는 처음부터 라이브 채팅 앱을 만드는 대신 라이브 채팅 앱을 다운로드할 수 있습니다.

그러나 이러한 앱은 사용하지 않는 경우에도 웹사이트에 부하를 추가합니다. 이러한 앱에는 백그라운드에서 실행되고 Shopify 페이지 속도에 부정적인 영향을 미치는 많은 JS 및 CSS 파일이 있습니다.

따라서 사용 중인 모든 앱을 자주 검토하는 것이 중요합니다. 그런 다음 따를 수 있는 두 가지 간단한 단계가 있습니다.

• 더 이상 사용하지 않는 앱 기능을 비활성화 하거나 스토어에 적용되지 않는 기능을 제거하십시오 . 온라인 상점 기능과 속도 최적화를 고려하십시오.
• 앱을 삭제하는 경우 설치 절차 중에 추가된 코드를 제거하는 것을 고려하십시오 . 일부 앱은 앱 이름을 포함하는 {% comment %} 태그로 코드를 묶어 이 절차를 지원합니다.

불필요한 앱 코드를 삭제하면 사용되지 않는 기능에 대한 코드가 실행되지 않고 테마 코드를 더 쉽게 이해할 수 있습니다.

• 앱 개발자에게 컨설팅을 요청하세요.
• Shopify 전문가를 고용하여 추가 도움 받기

참고: Shopify Local Delivery 앱과 같은 관리자 전용 앱은 스토어 속도에 영향을 주지 않습니다.

4. 빠르고 반응이 빠른 Shopify 테마 업데이트/다운로드

Shopify 테마는 Liquid, HTML, CSS 및 JavaScript 코드로 구성됩니다. 이러한 파일 크기는 테마를 편집하거나 사용자 정의할 때 커질 수 있으며 결국 Shopify 사이트 속도에 영향을 미치고 궁극적으로 Shopify 최적화 실패로 이어집니다.

새 테마를 설치하는 경우 항상 다음을 확인하십시오.

• 빠르고 반응이 빠른 테마를 선택하세요.
• 테마의 최신 버전과 테마의 실시간 미리보기를 확인하세요. Google PageSpeed ​​Insight를 통해 테마 미리보기 페이지를 실행하여 사이트 속도를 최적화할 수 있는 개선 사항을 확인하세요.

테마에서 온라인 스토어 속도를 저하시키는 것을 감지하면 다음 단계를 수행하십시오.

• 더 이상 사용하지 않는 테마를 비활성화하십시오. 전자 상거래 웹 사이트에서 기능과 속도 사이의 균형을 맞추는 방법을 고려하십시오.
• 가능하면 시스템 글꼴을 사용하십시오.
• 앱 개발자에게 컨설팅을 요청하세요. Shopify의 무료 테마를 사용하는 경우 기술 지원 팀의 도움을 받을 수 있습니다. 타사 테마를 사용하는 경우 테마 개발자에게 문의하거나 Shopify 전문가를 고용할 수 있습니다.
• Dawn과 같은 성능 최적화 테마를 설치하는 것은 결코 현명한 선택이 아닙니다.
• Shopify 전문가를 고용하여 추가 도움 받기

복잡한 작업을 반복적으로 수행하면 Liquid 렌더 시간이 느려져 전체 저장 속도가 저하될 수 있습니다. 코드가 최적화되지 않은 것이 우려되는 경우 다음 지침을 따르세요.

• 비효율적이거나 사용하지 않는 코드를 식별하는 데 도움을 줄 Shopify 전문가를 고용하십시오.
• Chrome용 Shopify 테마 검사기를 사용하여 온라인 스토어에서 페이지 속도를 늦추는 코드 라인을 찾으십시오.

5. 하네스 AMP

Shopify 속도 최적화를 위한 또 다른 솔루션은 판매자가 빠르게 로드되는 모바일 친화적인 웹 페이지를 개발할 수 있도록 하는 표준 프레임워크 인 Mobile Accelerated Pages 또는 AMP입니다.

스마트폰은 급변하는 오늘날의 세상에서 사치품에서 필수품으로 진화했습니다. 이 디지털 기술 시대에 사람들은 더 이상 통신만을 위해 휴대폰을 사용하지 않고 온라인 수업을 듣고, 지불하고, 웹사이트를 서핑하고, 온라인 쇼핑을 하고 있습니다.

모바일 방문자의 사용자 경험을 개선하는 것이 얼마나 중요한지 알아보려면 아래 통계(Statista에서 업데이트)를 살펴보십시오.

• 2021년에는 전 세계적으로 스마트폰 구독이 60억 건을 넘어섰고 앞으로 몇 년 동안 수억 명이 증가할 것으로 예상됩니다.
• 모바일 상거래는 2017년 58.9%에서 2021년 전체 소매 전자 상거래의 72.9%를 생성할 것으로 예상됩니다.

따라서 Shopify 매장 소유자가 AMP를 고려할 때입니다. 웹 사이트가 빠르게 로드되거나 모바일 장치에서 제대로 작동하지 않는 한 많은 잠재 고객을 잃을 수 있습니다. 이 프레임워크 덕분에 고객은 훨씬 더 빨리 웹사이트를 방문할 수 있습니다. 4성 등급 FireAMP 또는 RocketAMP 와 같은 많은 앱은 Shopify 앱 스토어에서 AMP 페이지 생성을 지원하는 데 사용할 수 있습니다. 또는 Shopify API를 구축하여 이러한 AMP 페이지를 개발할 수 있습니다. 이 앱은 Shopify 웹사이트의 속도를 높이는 방법에 대한 질문을 완벽하게 해결합니다.

6. Google 태그 관리자로 모든 추적 코드 구성

사이트에서 수집하는 데이터는 클라이언트의 행동에 대한 더 많은 통찰력을 얻는 데 필요하지만 웹사이트 속도가 느려질 수 있습니다.

전환, 목표 및 리타게팅을 개별적으로 측정할 때 이러한 모든 추적 태그가 페이지의 요청 수에 추가되어 결국 전체 속도가 저하될 수 있습니다. 또한 비동기식으로 수행되지 않는 경우 페이지의 콘텐츠가 렌더링되지 않도록 할 수도 있습니다.

Google 태그 관리자와 같은 관리 솔루션을 사용하여 모든 추적 태그를 하나의 자바스크립트 요청으로 압축할 수 있습니다 . 하나의 코드 스니펫으로 다양한 상점 태그를 처리할 수 있습니다. Shopify 스토어에서 Google 태그 관리자를 사용하는 방법에 대한 자세한 내용은 이 가이드를 확인하세요.

7. 리디렉션 및 끊어진 링크 최소화

Shopify 속도 최적화를 수행하기 위해 사이트에서 많은 리디렉션과 깨진 링크를 만날 수 있습니다. 부당한 행위를 피하는 방법은 다음과 같습니다.

7.1. 리디렉션의 경우

원치 않는 리디렉션은 웹 사이트 성능을 억제하고 페이지 로드 시간을 느리게 합니다. 이는 차례로 웹사이트의 전체 로딩 시간에 영향을 미칩니다 .

Broken link 404/301 Redirect 는 Giraffly에서 개발한 현명한 선택 솔루션입니다. 다음을 수행하는 데 도움이 됩니다.

• 404 오류 페이지 식별
• 앱의 대시보드에 끊어진 모든 링크가 눈에 띄게 표시됩니다. 또한 메일로 보고서를 받을 수 있습니다.
• 301 URL 리디렉션을 쉽게 생성합니다. 리디렉션 패턴을 설정하기만 하면 나머지는 소프트웨어가 알아서 처리합니다.

7.2. 깨진 링크의 경우

사용자는 확실히 이 메시지로 인해 기피할 것입니다. 따라서 사용자를 짜증나게 하고 쫓아내는 브랜드가 되어서는 안 됩니다. 불필요한 HTTP 쿼리를 피하려면 Dead Link 검사기와 같은 무료 온라인 도구를 사용하여 웹사이트에서 끊어진 링크를 감지한 다음 업데이트하거나 제거하십시오 .

깨진 링크는 SEO에 해를 끼칩니다. 사용자가 사용할 수 없는 페이지를 방문하면 브라우저에서 뒤로 버튼을 누릅니다. 이것은 웹사이트의 이탈률을 증가시킵니다.

8. Google Pagespeed Insights를 통해 매장 속도 성능 확인

솔루션으로 넘어가기 전에 다음 질문에 답해 보겠습니다. 좋은 Shopify 속도 점수는 무엇입니까? Shopify 속도 점수는 스토어가 Google Lighthouse 테스트 환경에서 얼마나 잘 실행되는지를 기반으로 합니다. 50 이상은 존경할만한 Shopify 속도 점수로 간주되는 반면 70 이상은 우수한 것으로 간주됩니다 !

스토어 성능을 확인하기 위한 권장 사항은 Google PageSpeed ​​Insights를 사용하여 웹 페이지를 평가 하고 로딩 시간을 늘리는 웹사이트 부분을 찾은 다음 제공된 제안에 따라 로딩 시간을 최소화하고 웹사이트 속도와 성능을 향상시키는 것입니다.

Google PageSpeed ​​Insights는 모바일 및 데스크톱 웹사이트에 대해 다음과 같은 주요 요소를 보여줍니다.

• CSS 및 JavaScript 최소화
• 이미지 최적화
• 스크롤 없이 볼 수 있는 웹 페이지 콘텐츠에서 렌더링 차단 CSS 및 JS 삭제
• 서버 응답 시간 줄이기
• 브라우저 캐싱 사용
• 랜딩 페이지로의 리디렉션은 어떤 경우에도 피해야 합니다.
• 압박 붕대

Google PageSpeed를 사용하여 웹사이트 성능을 분석하는 것은 사이트 속도를 늦추는 측면을 찾는 데 도움이 되는 최고의 Shopify 속도 최적화 서비스 일 수 있습니다.

Shopify 페이지 속도가 중요한 이유는 무엇입니까?

전자 상거래의 성공은 웹 사이트의 속도에 달려 있습니다. 그리고 2021년 5월에 Google 검색 순위가 임박하게 변경됨에 따라 온라인 성능이 경쟁 우위로 더욱 중요해질 것입니다.

다음 요인을 살펴보겠습니다.

• 전환 증가

낮은 이탈률과 증가된 전환은 전환 속도가 빠른 웹사이트와 연결되었습니다. Google에 따르면 사이트 속도가 1초 빨라지면 모바일 전환율이 최대 27% 증가할 수 있습니다. 쇼핑객의 70%가 모바일 장치에서 구매하므로 사이트 속도는 확실히 수익 잠재력에 상당한 영향을 미칩니다.

사이트 속도가 1초만 빨라도 모바일 전환 은 최대 27%까지 증가할 수 있습니다.

• 고객 충성도 구축

"새로운 고객을 확보하는 것보다 현재 소비자가 재구매하도록 하는 것이 더 저렴합니다."라는 말을 들어보셨을 것입니다.

여기에서 사이트 속도가 작용합니다. Skilled에 따르면 고객의 79%는 사이트 속도에 "불만족"하면 온라인 비즈니스에서 재구매할 의사가 적습니다(즉, 사이트 속도 가 빠르면 재구매 가능성이 더 높음).

• Google 검색 순위 향상

Google과 같은 검색 엔진에서 더 높은 순위를 기록하면 더 많은 잠재 고객이 귀하의 비즈니스를 찾을 수 있습니다. 가장 유명한 검색 엔진인 Google은 사이트 속도를 검색 결과의 순위 구성 요소로 사용합니다. 더 빠른 사이트는 Google에서 더 높은 순위를 차지하므로 신규 고객이 더 쉽게 찾을 수 있습니다.

Shopify 속도 최적화 – FAQ

결론

이 문서가 Shopify 속도 최적화를 수행하는 방법을 이해하고 배우는 데 도움이 되었기를 바랍니다. 우리는 고속 성과를 달성하기 위해 적용하고 따를 수 있는 8가지 강력한 방법을 강조했습니다.

Shopify 매장은 고객에게 보다 쉽고 풍부한 쇼핑 경험을 제공하는 데 중점을 둡니다. 기능을 제대로 적용하지 않으면 웹사이트 속도가 느려질 수 있습니다.

현재 Shopify 또는 기타 전자 상거래 플랫폼을 사용 중이고 속도 문제가 발생할 수 있는 경우 LitExtension – #1 쇼핑 카트 마이그레이션 서비스가 도와드리겠습니다! 우리 팀은 Shopify 속도 최적화를 완벽하게 수행하는 데 성공하도록 도와줄 것입니다! 저희에게 연락하십시오. 우리는 항상 도움을 요청합니다.

또한 커뮤니티에 가입하여 점점 더 많은 전자 상거래 뉴스를 볼 수 있습니다.