Menggunakan Peta Panas di Halaman Harga

Mari kita mulai "Tes A/B Bulan Ini" dengan tes yang bukan A/B. Sebelum Anda pergi ke sudut lain Internet, izinkan saya menjelaskan kepada Anda mengapa kami akan mulai dengan peta panas.

Salah satu penyebab utama tidak menggunakan pengujian A/B secara teratur di situs web Anda adalah tidak tahu harus mulai dari mana: perubahan apa yang saya coba, di mana, dan mengapa? Itu adalah pertanyaan kunci yang akan Anda tanyakan pada diri sendiri. Jika Anda tidak tahu bagaimana menjawabnya, Anda akan menyerah pada pengujian.

Untuk mengatasinya, yang saya sarankan adalah hal pertama yang Anda lakukan adalah memilih halaman dari situs web Anda untuk memulai. Halaman ini harus relevan dengan tujuan Anda. Ini berarti bahwa ini adalah halaman tempat Anda menerima banyak kunjungan, atau halaman utama untuk aktivitas atau bisnis Anda.

Dalam contoh hari ini, kami telah memilih untuk memulai dengan halaman harga plugin premium kami: Pengujian A/B Nelio dan Konten Nelio. Halaman-halaman ini adalah kunci bisnis kami, karena pendapatan perusahaan kami berasal dari keduanya.

Sekarang kita telah memilih halaman, untuk mengetahui perubahan apa yang harus dibuat dan mengapa, lebih baik memulai dengan menjalankan tes peta panas. Kami melakukan ini karena peta panas memberi kami data nyata tentang bagaimana pengunjung kami berinteraksi dengan situs web kami.

Ketika kami benar-benar melihat bagaimana kinerja halaman kami dengan data pengguna nyata, jauh lebih mudah untuk mendapatkan ide untuk pengujian di masa mendatang untuk dijalankan. Inilah sebabnya mengapa peta panas selalu merupakan awal yang baik.

Cara Membuat Tes Peta Panas di WordPress

Membuat tes peta panas untuk halaman WordPress sangat mudah. Anda hanya perlu memilih halaman yang dipilih dan memulai pengujian.

Dalam Pengujian A/B Nelio, buat pengujian peta panas baru dengan memilih jenis pengujian ini dari dialog yang terbuka saat Anda mengklik tombol untuk menambahkan pengujian baru.

Pada layar pengeditan pengujian Anda menetapkan nama untuk pengujian Anda sehingga mudah untuk diidentifikasi nanti. Anda juga dapat menambahkan deskripsi tentang apa yang ingin Anda coba dalam tes. Last but not least, Anda harus memilih halaman tempat Anda ingin melakukan tes peta panas:

Setelah semuanya siap (seperti yang Anda lihat di tangkapan layar sebelumnya, sangat mudah), klik tombol di sudut kanan atas jendela untuk memulai tes. Anda hanya perlu menunggu pengunjung Anda datang agar Nelio A/B Testing mengumpulkan data dari perilaku mereka di halaman dan memproses hasilnya.

Hasil Peta Panas

Dalam kasus kami, kami memiliki dua pengujian peta panas yang berjalan pada saat yang sama di situs web kami: satu untuk halaman harga Pengujian A/B Nelio dan satu lagi untuk halaman harga Konten Nelio.

Setiap tes telah mengumpulkan data selama sekitar 20 hari dan telah menganalisis perilaku sekitar 500 pengunjung. Ini lebih dari cukup untuk dapat menarik kesimpulan tertentu dan memikirkan pengujian A/B di masa mendatang yang dapat kami jalankan di halaman ini.

Ingatlah bahwa halaman-halaman ini bukanlah halaman yang memiliki lebih banyak kunjungan di situs web kami. Mereka adalah tahap akhir dari corong konversi, sehingga lalu lintas hilang di sepanjang jalan. Tapi ingat bahwa kami memilih mereka karena pentingnya mereka untuk bisnis kami. Dalam pengujian mendatang kami akan mempelajari halaman lain dengan lebih banyak lalu lintas, untuk alasan lain yang akan kami jelaskan.

Halaman Harga Pengujian A/B Nelio

Mari kita mulai dengan hasil yang diperoleh untuk halaman harga Pengujian A/B Nelio. Tes peta panas menunjukkan kepada kita data dari tiga perspektif berbeda: peta panas, peta gulir, dan confetti. Menyematkan 3 gambar penuh di sini terlalu banyak, karena mereka cukup besar dalam hal tinggi piksel. Untuk menghindari memaksa Anda menggulir ke atas dan ke bawah sepenuhnya, saya hanya menautkannya di sini:

• Peta panas halaman harga Pengujian A/B Nelio.
• Scrollmap halaman harga Pengujian A/B Nelio.
• Confetti dari halaman harga Nelio A/B Testing.

Sekarang mari kita lihat fragmen yang paling relevan dari hasil sebelumnya:

Seperti yang Anda lihat di gambar sebelumnya, peta panas adalah representasi grafis yang menunjukkan interaksi pengguna dengan elemen halaman, secara agregat dan dengan skala warna di mana warna hangat menunjukkan relevansi yang besar.

Di halaman harga Nelio A/B Testing, lipatan pertama halaman adalah tempat di mana terdapat lebih banyak hot spot. Jika kita menganalisisnya secara rinci, unsur-unsur di bidang rencana dasar dan rencana profesional mendapatkan lebih banyak relevansi daripada perusahaan. Mengingat hal ini, mungkin kami dapat menyusun ulang rencana penetapan harga untuk menunjukkan rencana perusahaan terlebih dahulu. Perhatikan bahwa kami terbiasa membaca dari kiri ke kanan, jadi menampilkan paket paling mahal di halaman harga terlebih dahulu dapat menjadi perubahan yang baik untuk dicoba dalam pengujian A/B.

Elemen lain yang menerima banyak interaksi pengguna adalah tautan untuk menggulir ke bawah untuk melihat perbandingan rinci dari rencana. Ini bagus, karena itu berarti ada minat untuk melihat lebih banyak detail tentang rencana tersebut.

Apa yang tidak begitu baik adalah bahwa ada banyak interaksi dalam elemen yang tidak dapat diklik. Anda dapat melihatnya di confetti, yang merupakan representasi grafis di mana Anda dapat melihat semua klik yang dilakukan oleh pengunjung:

Di seluruh blok rencana yang dapat Anda lihat di tangkapan layar sebelumnya, hanya tombol yang muncul di setiap rencana yang merupakan elemen yang dapat diklik. Ingatlah bahwa mengklik yang lainnya tidak berpengaruh. Antarmuka kami saat ini menghasilkan kebingungan.

Pengunjung mengklik teks dan ikon fitur setiap paket, yang merupakan elemen yang tidak dapat diklik. Dari sini kami dapat memahami bahwa mereka mencoba menemukan lebih banyak informasi tentangnya, tetapi kami memiliki informasi ini lebih jauh di bagian bawah halaman.

Tes A/B lain yang dapat kita coba di sini adalah mengubah setiap fitur paket sehingga memiliki elemen mengambang yang muncul saat mengarahkan kursor ke teks dan memberikan lebih banyak informasi kontekstual kepada pengunjung. Kami dapat menguji versi ini dengan bantuan kontekstual terhadap versi saat ini untuk melihat mana yang menghasilkan lebih banyak pembelian.

Konfeti juga memberi kami informasi agregat pengunjung, yang diambil dari klik yang mereka buat. Pengujian A/B Nelio mencakup beberapa jenis filter untuk lebih memahami karakteristik pengunjung yang berbeda, seperti yang Anda lihat di sini:

Dari filter ini kami mengekstrak data berikut:

• Chrome dan Firefox adalah browser yang paling banyak digunakan oleh pengunjung kami, sejauh ini. Oleh karena itu, kita harus membuat web terlihat bagus, setidaknya, di browser ini.
• Setengah dari pengunjung halaman ini berasal dari Amerika Serikat. Ini cocok dengan data penjualan kami.
• Pengunjung mengunjungi kami lebih banyak pada 3 hari pertama dalam seminggu. Mengetahui informasi ini dapat berguna untuk, misalnya, membuat penawaran di hari-hari lain di area web lainnya, dan dengan demikian menarik lalu lintas pada hari-hari dengan lalu lintas rendah.
• Hampir 100% pengunjung mengakses halaman dari komputer desktop atau laptop. Kami jarang mendapat kunjungan dari perangkat seluler. Ini adalah sesuatu untuk dipelajari di masa depan.
• Windows 10 dan Mac OS X adalah sistem operasi tempat orang mengunjungi kami. Ini cocok dengan data sebelumnya, karena kami tidak memiliki pengunjung dari sistem operasi untuk perangkat seluler.
• Kami memiliki lebih banyak pengunjung selama hari kerja (tes dijalankan di zona waktu Chicago). Masuk akal, karena klien utama kami berasal dari Amerika Serikat.
• Kunjungan dilakukan pada layar dengan lebar minimum lebih besar dari 1500 piksel. Fakta lain yang menegaskan bahwa kunjungan berasal dari komputer desktop atau laptop.

Jika Anda memeriksa versi lengkap peta panas dan confetti, Anda akan melihat bahwa semua bagian lain dari halaman harga Pengujian A/B Nelio kurang relevan. Dengan mengingat hal itu, mari kita periksa scrollmap berikut:

Jika Anda memeriksa scrollmap lengkap, Anda dapat melihat bahwa sangat sedikit pengunjung yang melampaui lipatan pertama halaman. Ini membuat saya berpikir bahwa mungkin kita harus menggunakan versi halaman harga Nelio A/B Testing yang jauh lebih pendek, memadatkan informasi yang relevan di paro atas.

Bagian setelah lipatan pertama halaman memiliki banyak teks, dan pengunjung tidak membacanya. Kurang dari 20% datang untuk melihat dan berinteraksi dengan tabel terperinci yang membandingkan paket, yang dapat Anda temukan di bagian bawah web. Semua data ini disediakan oleh scrollmap:

Pengujian dengan versi halaman yang lebih pendek termasuk lebih banyak bagian visual dapat membantu meyakinkan calon pembeli dan mendapatkan halaman harga yang jauh lebih efektif dan efisien. Ini adalah gagasan lain tentang kemungkinan perubahan untuk dicoba dengan pengujian A/B.

Kami sudah memiliki beberapa ide yang dapat kami uji di masa mendatang, jadi jelas bahwa informasi yang diberikan peta panas sangat berguna untuk mendapatkan ide yang kemudian dapat kami terapkan dalam pengujian A/B.

Halaman Harga Konten Nelio

Seperti halaman harga Nelio A/B Testing, di sini Anda memiliki gambar lengkap dengan hasil peta panas untuk halaman harga Konten Nelio:

• Peta panas halaman harga Konten Nelio.
• Scrollmap halaman harga Konten Nelio.
• Confetti dari halaman harga Konten Nelio.

Halaman harga Konten Nelio lebih sederhana dan lebih pendek daripada halaman untuk Pengujian A/B Nelio. Di antara alasan lain, halaman ini hanya memiliki satu paket, sedangkan dengan Nelio A/B Testing kami memiliki 3 paket berbeda.

Jika Anda melihat peta panas lengkap dan membandingkannya dengan salah satu Pengujian A/B Nelio, Anda akan melihat bahwa dalam hal ini ada lebih banyak titik panas di bagian lain halaman, selain lipatan pertama.

Pada gambar sebelumnya kita melihat bahwa tombol tindakan dalam tabel yang membandingkan rencana mendapatkan relevansi khusus. Ini bagus, karena kami memiliki mereka di sana untuk alasan itu. Namun, perhatikan bahwa paket Pemula dalam tabel, yang tidak lebih dari versi gratis dari Konten Nelio, memiliki relevansi khusus.

Di sini pertanyaannya adalah apakah kita harus memiliki tautan ke direktori plugin WordPress di halaman harga kita sehingga pengunjung dapat mengunduh Konten Nelio versi gratis atau tidak. Sekarang kami memilikinya, tetapi peta panas menunjukkan bahwa mungkin beberapa pengunjung meninggalkan halaman harga kami untuk mendapatkan versi gratis.

Topik ini kontroversial dan menjadi sumber diskusi panjang dalam pertemuan kami. Di satu sisi, menjaga tautan tidak baik karena Anda kehilangan kemungkinan penjualan langsung di dalam halaman harga. Tetapi meskipun pengunjung meninggalkan situs kami, mungkin saja mencoba Konten Nelio secara gratis adalah hal yang baik. Pengguna mungkin menyukai alat ini dan akhirnya membelinya nanti setelah mereka mengujinya. Di Nelio kami telah membahas ini beberapa kali dan saya kira hari ini bukan terakhir kali kami melakukannya?. Untuk saat ini, tautannya tetap. Apa yang Anda pikirkan?

Kami juga melihat bahwa video tersebut menarik banyak perhatian. Kami membuat video yang sangat keren, dan mungkin kami bisa menampilkannya lebih awal di halaman. Kita dapat mencoba perubahan ini dengan pengujian A/B karena bagian setelah lipatan pertama juga tidak terlalu relevan.

Di sisi lain, kami melihat di peta gulir bahwa hilangnya pengunjung tidak terlalu tiba-tiba saat kami menggulir halaman ke bawah. Ini menegaskan bahwa halaman harga yang lebih pendek dapat bekerja lebih baik jika yang kami inginkan adalah pengunjung melihat konten sebanyak mungkin.

Selain itu, dikombinasikan dengan peta panas sebelumnya, kami melihat bahwa dua bagian setelah lipatan pertama, yang membahas tentang fitur tertentu dan menunjukkan pendapat orang, mungkin perlu didesain ulang. Mereka adalah bagian dengan terlalu banyak teks dan tidak terlalu menarik perhatian. Kita bisa mencoba versi alternatif yang lebih visual dan langsung.

Sehubungan dengan grafik confetti klik, menarik untuk melihat jumlah klik salah yang dibuat di area yang tidak dapat diklik dalam lipatan pertama halaman:

Meskipun sebagian besar klik tersebut tidak dapat dihindari (ya, asumsikan orang mengklik area samping, terutama di sebelah kanan, saat menggulir), ada juga yang disebabkan oleh pengunjung yang bingung. Ini adalah kasus klik pada nomor harga bulanan yang Anda lihat di tangkapan layar sebelumnya. Harga tersebut bukanlah item yang dapat diklik; Anda harus mengklik tombol oranye sebagai gantinya. Namun, nomor harga tahunan yang ditunjukkan di bawah ini adalah tautan yang tepat.

Kita harus mencari cara lain yang tidak terlalu membingungkan untuk menunjukkan kedua harga, dengan interaksi yang sama untuk kedua kasus. Ini adalah pengujian A/B lain yang dapat kami jalankan di halaman ini.

Dan Sekarang Apa?

Kami memulai tanpa memiliki gagasan tentang pengujian A/B apa yang dapat kami jalankan di situs web kami. Kami telah melihat bahwa peta panas membantu kami mendapatkan ide dengan mudah untuk diuji dalam pengujian A/B di halaman kami. Setelah kita memiliki ide pengujian ini, yang harus kita lakukan adalah memprioritaskannya sesuai dengan kebutuhan kita.

Ingatlah bahwa perubahan di lipatan pertama halaman lebih cepat untuk diuji karena lebih banyak orang akan melihatnya dan dengan demikian Anda akan memperoleh hasil lebih cepat. Anda dapat mulai memprioritaskan pengujian A/B yang mencoba perubahan di bagian halaman tersebut.

Dan pelajaran terpenting di sini adalah: begitu Anda mulai menguji, jangan berhenti. Setelah setiap iterasi dari proses pengujian, Anda akan mempelajari sesuatu yang baru dari situs web dan pengunjung Anda.

Sampai jumpa bulan depan dengan jenis tes lain di mana kami akan menganalisis hasil nyata. Ingatlah untuk meninggalkan saya komentar dengan pendapat Anda tentang posting ini dan semua yang saya jelaskan di sini. Di halaman mana situs Anda akan menjalankan peta panas?

Gambar unggulan oleh Steve Halama di Unsplash.