9 Tips Untuk Optimasi Kecepatan Situs Shopify

Diterbitkan: 2020-06-29

Shopify adalah platform yang sangat mudah diakses, dengan perusahaan besar seperti Lindt dapat membuat dan membuka toko e-niaga mereka hanya dalam 5 hari . Sangat mudah untuk meluncurkan toko dan mulai berdagang dalam waktu singkat, dan memiliki banyak fungsi bawaan untuk mempermudah proses ini.

Namun ada beberapa hal yang perlu diperhatikan pedagang untuk mendapatkan hasil maksimal dari toko mereka. Kecepatan situs tetap menjadi salah satu faktor penting ini. Situs yang memuat lambat memiliki banyak hal negatif: mulai dari keterlibatan rendah dan rasio pentalan tinggi, hingga lalu lintas yang lebih sedikit, penjualan yang lebih rendah, dan bahkan peringkat mesin telusur yang rusak (Google menyukai laman dengan waktu pemuatan yang cepat), masuk akal untuk melakukan apa yang Anda bisa untuk membuat situs secepat mungkin.

Dalam artikel ini, kami akan memeriksa cara untuk menilai kecepatan situs Anda saat ini, dan kemudian memberikan tips terbaik kami untuk memastikan Anda melakukan semua yang Anda bisa untuk meningkatkan kecepatannya.

Cara memeriksa kecepatan situs Shopify Anda saat ini

Gunakan PageSpeed ​​Insights yang akan memberi Anda skor kecepatan dan rekomendasi untuk peningkatan. Ini akan memisahkan hasil desktop dan seluler dan membuat rekomendasi seperti:

  • Optimalkan gambar Anda
  • Perkecil JavaScript dan CSS
  • Hilangkan JavaScript dan CSS yang memblokir render di paro atas
  • Manfaatkan cache browser dan kurangi waktu respons server
  • Hindari pengalihan
  • Kompresi Gzip

Menjalankan pengujian di beranda saja tidak cukup - ada baiknya menguji setidaknya 10 halaman teratas yang paling sering dikunjungi di situs Anda - di situlah peningkatan kecepatan akan memiliki dampak terbesar. Lihat panduan kami untuk menjalankan dan menafsirkan audit kecepatan situs web.

Ada beberapa peringatan untuk alat Wawasan. Meskipun berguna, ada baiknya mengingat beberapa hal. Ini menandai situs yang sangat bergantung pada Javascript (seperti yang dilakukan sebagian besar situs Shopify) dan menilai situs berdasarkan daftar periksa teknis yang tidak memperhitungkan beberapa pertimbangan praktis. Ini juga dapat bervariasi tergantung pada seberapa banyak bandwidth yang tersedia saat pengujian dilakukan.

Saya ingat seorang klien di agensi lain yang skornya turun dari 98 menjadi 96 setelah beberapa perubahan situs, dan bersikeras untuk mendapatkan skor kembali dengan membuat perubahan lain. Apa yang mereka tidak mengerti bahwa melakukannya dapat merusak atau merusak area lain dari situs mereka dan bukan angka dalam skor yang merupakan faktor kritis, tetapi kegunaan dan kecepatan situs itu sendiri di dunia nyata.

Jadi secara ringkas: ini adalah panduan yang baik untuk mendapatkan gambaran tentang di mana Anda berada dengan kecepatan situs Anda, tetapi bukan segalanya dan akhir segalanya.

Anda juga dapat menggunakan Pingdom atau GTmetrix untuk menilai kecepatan halaman Anda - mencoba beberapa alat yang berbeda akan memberi Anda gambaran yang lebih luas tentang kinerja kecepatan, masalah, dan tindakan perbaikan.

Cara Meningkatkan Kecepatan Situs Anda

Setelah Anda memiliki gagasan tentang bagaimana kinerja situs Anda, Anda mungkin memiliki beberapa tindakan yang disarankan yang berasal dari alat apa pun yang Anda gunakan untuk menjalankan halaman Anda. Jika demikian, untuk melengkapinya, berikut adalah sepuluh tindakan teratas kami yang dapat Anda ambil untuk meningkatkan kecepatan situs Anda.

1 Gunakan AMP untuk membuat halaman lebih cepat

AMP (halaman seluler yang dipercepat) membantu meningkatkan kecepatan pemuatan halaman di perangkat seluler. Premisnya adalah untuk menyajikan halaman web dalam format standar (ditentukan oleh Google) untuk mengurangi ukuran halaman dan waktu pemuatan. Misalnya, semua konten halaman dimuat sekaligus, dan browser mengetahui tata letak halaman AMP sebelumnya.

Meskipun Shopify tidak menawarkan versi AMP tokonya sebagai standar, ada aplikasi seperti RocketAmp yang tersedia di toko aplikasi yang akan membuat versi AMP halaman toko Anda atas nama Anda. Ingatlah bahwa jika Anda mengikuti rute ini dan berhenti menggunakan aplikasi nanti, itu dapat menyebabkan masalah dengan kesalahan halaman.

2 Pengoptimalan gambar

Mengompresi gambar Anda penting untuk memuat halaman web dengan lebih cepat, terutama di situs e-niaga.

Kompresi gambar berarti mengambil gambar dalam ukuran aslinya dan kemudian mengurangi ukuran filenya, tanpa memengaruhi kualitasnya.

Shopify memungkinkan Anda untuk menggunakan format gambar berikut:

  • JPEG atau JPG
  • JPEG Progresif
  • PNG
  • GIF

Gambar PNG berguna jika Anda membutuhkan piksel transparan dalam gambar Anda (Anda akan sering melihatnya dengan pola kisi di latar belakang yang menunjukkan bagian transparan), tetapi biasanya menggunakan lebih banyak ruang daripada JPEG, jadi pertimbangkan untuk menggunakan JPEG sebagai standar jika Anda bisa.

Ada dua tingkat kompresi:

  • 'kompresi lossless', yang memberi Anda file kecil tanpa pengurangan kualitas gambar
  • 'kompresi lossy', yang menghasilkan file yang lebih kecil TAPI mengorbankan kualitas gambar

Kedua opsi tersedia untuk Anda, tetapi sebagai situs e-niaga yang menjual produk, kemungkinan besar citra merupakan bagian penting dalam membujuk pelanggan untuk membeli. Dalam survei terbaru terhadap 1.500 pembeli online yang dilakukan oleh Eastside Co, 37,8% responden mengatakan mereka menganggap citra produk 'sangat atau sangat berpengaruh' dalam keputusan pembelian mereka. Dengan pemikiran ini, pertimbangkan untuk menggunakan kompresi lossless untuk file yang lebih kecil tetapi tidak ada pengurangan kualitas.

Saat Anda mengunggah gambar ke situs Anda, pastikan bahwa itu adalah ukuran yang diperlukan untuk halaman dalam hal lebar dan tinggi piksel. Anda dapat menggunakan alat gratis tinypng.com untuk mengurangi ukuran gambar Anda.

3 Gunakan tema yang cepat dan responsif

Jika Anda menggunakan tema yang tidak biasa daripada menggunakan layanan Ahli Shopify seperti Eastside Co, pastikan Anda memilih yang cepat dan responsif. Ini berarti mereka akan mengubah elemen di situs web Anda berdasarkan dimensi perangkat yang digunakan untuk melihatnya, membuat pengalaman pengguna yang lebih baik dan lebih cepat.

4 Tinjau aplikasi yang diinstal di toko Anda

Masuk ke admin toko Shopify Anda dan tinjau semua aplikasi yang telah Anda instal, dan hapus semua yang tidak Anda perlukan atau tidak gunakan. Seringkali, masalah di balik kecepatan situs Shopify yang lebih lambat adalah jumlah aplikasi yang berjalan di situs tersebut: setiap aplikasi yang Anda instal memiliki lebih banyak kode di situs web Anda dan lebih banyak elemen untuk dimuat.

Selain aplikasi, ada baiknya juga melihat kode pihak ketiga yang Anda gunakan dan merapikan secara umum jika ada sesuatu yang tidak lagi diperlukan.

5 Kurangi jumlah permintaan HTTP

Setiap kali pengunjung memuat salah satu halaman web Anda di browser mereka, file web tambahan juga dimuat, seperti file CSS, Javascript, gambar desain, dll. Setiap kali file seperti ini diminta, itu membuat permintaan tambahan untuk browser proses. Ini dikenal sebagai permintaan HTTP dan semakin banyak, semakin lama waktu yang dibutuhkan.

Ada sejumlah langkah teknis yang dapat Anda ambil untuk mengurangi jumlah permintaan HTTP. Artikel ini memberikan 9 tindakan yang akan membantu Anda melakukannya, dan meningkatkan kecepatan situs Anda.

6 Minimalkan tautan dan pengalihan yang rusak

Tautan rusak dapat meningkatkan permintaan HTTP Anda (lihat poin 5), dan Anda tidak ingin pengunjung Anda mengunjunginya karena meningkatkan kemungkinan mereka meninggalkan toko Anda dan berbelanja di tempat lain.

Pengalihan yang tidak perlu (halaman A menunjuk ke halaman B yang mengarah ke halaman C tempat pengunjung akhirnya tiba, misalnya) berarti pengunjung Anda membutuhkan waktu lebih lama untuk tiba, dan menurunkan kecepatan situs secara keseluruhan.

Ada aplikasi yang tersedia di toko aplikasi Shopify untuk mengidentifikasi tautan dan pengalihan yang rusak dan membantu Anda memperbaikinya secara berkelanjutan.

7 Singkirkan gambar slider dan carousel

Slider tetap ada di beberapa situs web, tetapi kami akan merekomendasikan gambar pahlawan tunggal di atas korsel gambar. Mengapa?

  • Hampir tidak ada orang yang mengklik slide pertama, apalagi menunggu untuk melihat slide kedua atau ketiga
  • Setiap slide berarti bobot tambahan pada halaman dan karena tidak ada yang benar-benar melihat atau menggunakannya, sebagian besar berlebihan
  • Mereka bahkan kurang efektif di perangkat seluler

Gunakan satu gambar 'pahlawan' sebagai gantinya (dioptimalkan seperti yang dijelaskan). Ini semua yang Anda butuhkan.

8 Masukkan semua kode pelacakan melalui Google Tag Manager (GTM)

Pindahkan salah satu kode pihak ketiga yang Anda gunakan ke Google Pengelola Tag. Seiring waktu, perangkat lunak pemasaran atau kode analitik akan ditambahkan ke situs Anda dan itu bisa menjadi berat. Menggunakan GTM berarti semua kode pihak ketiga lebih mudah dikelola, ditambah lagi hanya dimuat di halaman yang relevan. Ini juga berarti Anda dapat melacak semuanya dan menghapus elemen apa pun yang menjadi berlebihan.

9 Pemuatan malas

Ini adalah cara mudah lainnya untuk meningkatkan kecepatan toko Shopify Anda. Pemuatan malas adalah metode di mana apa pun yang tidak 'di paro atas' pada halaman tidak dimuat sampai pengguna menggulir lebih jauh ke bawah.

Ini adalah 'curang' yang bagus untuk mengoptimalkan kecepatan pada halaman yang banyak gambarnya atau menampilkan video di bagian bawah. Pada dasarnya, Anda hanya mengambil elemen sesuai kebutuhan, alih-alih memuat semuanya secara bersamaan. Lihat panduan mendalam tentang cara menerapkan pemuatan lambat dari Trik CSS.

Jadi begitulah: 9 poin praktis yang perlu diingat untuk memastikan Anda melakukan semua yang Anda bisa untuk meningkatkan kecepatan situs Anda. Jika Anda memerlukan bantuan dengan toko Shopify Anda, mulai dari kecepatan situs hingga peningkatan penjualan, hubungi kami!