Skip to content
Ditulis.ID – Cara kita mengakses informasi telah berubah secara dramatis akhir-akhir ini. Dengan teknologi seluler yang meningkat, kami menghabiskan lebih banyak waktu di mobile devices kami, membaca berita saat bepergian, menjelajahi website yang menarik, dan bahkan berbelanja.Di mana sebelum kami menggunakan komputer kami, kami sekarang melakukan tugas-tugas itu di ponsel cerdas dan tablet kami.
Faktanya, laporan dari SimilarWeb menyatakan bahwa 56% dari semua traffic (pengunjung) online berasal dari mobile devices, dan data dari StatCounter mengungkapkan bahwa seluler dan tablet sekarang lebih banyak digunakan daripada desktop. Statistik menarik lainnya datang dari Statistik menarik lainnya datang dari laporan IBM yang menunjukkan peningkatan penjualan mobile e-commerce selama musim liburan.
Tambahan dari fakta bahwa pengumuman Google dibuat pada tahun 2015 yang menyatakan bahwa Google mempertimbangkan mobile friendliness saat memberi peringkat situs dan kamu bisa mulai melihat mengapa penting untuk mempunyai website yang mobile-friendly.
Dan jika kamu adalah pemilik website untuk UKM (atau akan membuat website untuk UKM kamu ), memastikan website kamu mobile-friendly sangat penting untuk kesuksesan kamu mengingat 72% konsumen menginginkan website yang mobile-friendly.
Pada artikel ini, kami akan menunjukkan kepada kamu bagaimana kamu bisa menguji apakah website kamu mobile-friendly, dan bagaimana membuat situs WordPress kamu dioptimasi untuk mobile devices.
Kami juga akan memandu kamu, langkah demi langkah, apa yang bisa kamu lakukan untuk memastikan pengunjung website kamu mendapatkan pengalaman pengguna yang optimal saat mengunjungi website kamu di ponsel. Langsung saja kita masuk ke cara bagaimana membuat website WordPress mobile friendly.
Daftar Isi
Cara Mengecek Apakah Situs WordPress Kamu Mobile-Friendly
Sebelum mengecek apakah website kamu mobile-friendly, selalu berguna untuk mengetahui dengan tepat berapa banyak traffic yang kamu peroleh dari mobile devices. Cara termudah untuk melakukannya adalah dengan menggunakan Google Analytics. Yang harus kamu lakukan adalah masuk ke akun Google Analytics kamu dan pilih properti web yang sesuai untuk website kamu. Di menu sebelah kiri, klik Mobile lalu Overview.
Kamu akan bisa melihat berapa banyak pengunjung kamu yang berasal dari devices desktop, seluler, dan tablet.Jika kamu ingin tahu devices mana yang digunakan pengunjung kamu saat menjelajahi situs kamu, kamu bisa mendapatkan informasi itu dengan mengklik Devices.
Sekarang setelah kamu mengetahui berapa banyak traffic seluler yang diperoleh website kamu, inilah saatnya untuk melihat apakah website kamu mobile-friendly. Ada tiga alat yang bisa kamu gunakan untuk mengecek ini.
» Google Mobile Friendly Test
Alat pertama datang langsung dari Google dan sangat sederhana dan mudah digunakan. Buka browser kamu, buka Google Mobile Friendly Test dan masukkan URL website kamu, lalu klik Analisis. Setelah analisis singkat, ini akan memberi tahu kamu apakah website kamu mobile-friendly atau tidak.
Jika website kamu mobile-friendly, kamu akan mendapatkan pesan hijau yang memberi tahu kamu demikian.Jika tidak, pengujian akan memberitahu kamu bahwa website kamu tidak mobile-friendly, menunjukkan kesalahan mana yang menyebabkan masalah, dan memandu kamu menuju sumber daya yang berguna untuk membuat situs kamu mobile-friendly.
» Screenfly
Alat kedua, Screenfly sedikit lebih kuat. Meskipun Screenfly tidak akan memberi kamu saran tentang cara membuat website kamu mobile-friendly, atau menunjukkan kesalahan apa pun, Screenfly akan memungkinkan kamu melihat bagaimana website kamu muncul di berbagai ukuran layar, termasuk ponsel cerdas, tablet, dan bahkan TV.
Kegunaan alat ini berasal dari fakta bahwa website kamu mungkin mempunyai desain yang responsif, tetapi mungkin masih ada elemen di website kamu yang tidak ditampilkan sebagaimana mestinya.
» MobileTest.me
Alat terakhir adalah MobileTest.me. Alat ini memungkinkan kamu untuk memilih mobile devices tertentu dan setelah memasukkan URL website kamu, kamu bisa melihat bagaimana website kita muncul di devices tertentu itu.
Apa yang membuat alat ini berbeda dari dua lainnya, adalah kenyataan bahwa kamu benar-benar bisa berinteraksi dengan website kamu seolah-olah kamu sedang menjelajah dari devices tertentu. Ini adalah cara yang bagus untuk melihat cara kerja situs kamu di mobile devices dan untuk menguji beberapa elemen umum seperti tombol berbagi dan formulir pendaftaran.
Cara Optimasi Website kamu Agar Mobile-Friendly
Meskipun kamu lulus semua tes, itu tidak berarti website kamu ditampilkan dengan benar. Dalam kebanyakan kasus, pemilik website benar-benar hanya akan menguji beranda yang mungkin terlihat mobile-friendly. Namun, begitu kamu mulai menggali lebih dalam, kamu mungkin menemukan bahwa ada beberapa masalah potensial.Sebagai contoh
- Apakah pengunjung kamu yang menjelajahi situs di mobile devices bisa mengklik tombol berbagi ?
- Apakah formulir pendaftaran kamu sulit ditutup sehingga membuat website kamu sulit untuk digulir dan dilihat?
- Bagaimana dengan toko online kamu, apakah produk kamu bisa dibeli menggunakan devices mobile?
- Apakah kolom input cukup besar sehingga kamu bisa melihat apa yang kamu ketik?
»Tombol Social Sharing
Ada banyak plugin social sharing yang tersedia untuk WordPress, tetapi tidak semuanya dioptimasi untuk penggunaan di mobile devices. Sebagian besar dari mereka memungkinkan kamu untuk menampilkan tombol social sharing di atas konten, di bawah konten, sebagai sidebar mengambang atau semua hal di atas; dengan harapan mendorong pengunjung untuk membagikan konten kamu. Meskipun tujuannya bagus, dalam banyak kasus, tombol-tombol itu juga
Meskipun tujuannya bagus, dalam banyak kasus, tombol-tombol itu mengambil lebih banyak real-estate layar daripada yang tersedia di mobile devices; atau jika kamu menggunakan opsi sidebar mengambang, itu menutupi konten kamu.
Untuk mengatasi ini, periksa pengaturan plugin dan jika kamu bisa, nonaktifkan sidebar mengambang di tampilan seluler, atau jika tidak ada opsi seperti itu, nonaktifkan sepenuhnya. Jika tombol social sharing kamu saat ini tidak berfungsi dengan baik di mobile devices, pertimbangkan untuk menggunakan plugin lain seperti
Jika tombol social sharing kamu saat ini tidak berfungsi dengan baik di mobile devices, pertimbangkan untuk menggunakan plugin lain seperti SumoMe. SumoMe adalah plugin gratis yang mempunyai floating share bar yang secara otomatis ditampilkan di bagian bawah layar ketika mendeteksi pengunjung menggunakan mobile devices. Pilihan menarik lainnya adalah Social Warfare yang mengubah ukuran semua tombol berbagi sesuai dengan ukuran layar, serta memungkinkan kamu untuk menonaktifkan tombol berbagi mengambang sepenuhnya di mobile devices.
» Formulir Keikutsertaan Email
Salah satu cara paling efektif untuk mengembangkan daftar email kamu adalah plugin pop-up. Sayangnya, banyak dari mereka mengambil terlalu banyak real-estate layar pada mobile devices, membuatnya tidak mungkin untuk ditutup atau terlalu kecil sehingga pengguna tidak bisa membaca teks atau mengisi bidang yang diperlukan.
Jika kamu menggunakan plugin pop-up, pastikan untuk mengujinya dengan hati-hati di berbagai mobile devices. Jika kamu perlu menemukan plugin yang akan ditampilkan dengan benar di mobile devices, berikut adalah beberapa opsi untuk dipertimbangkan.
Jika kamu menggunakan plugin pop-up, pastikan untuk mengujinya dengan hati-hati di berbagai mobile devices. Jika kamu perlu menemukan plugin yang akan ditampilkan dengan benar di mobile devices, berikut adalah beberapa opsi untuk dipertimbangkan. SumoMe, plugin yang disebutkan di atas adalah salah satu plugin yang benar-benar ditampilkan dengan baik di mobile devices dan gratis. Pilihan lainnya adalah
Pilihan lainnya adalah Bloom – plugin premium yang dikembangkan oleh Elegant Themes jadi jika kamu memutuskan untuk berinvestasi di Bloom, kamu juga akan mendapatkan akses ke seluruh rangkaian theme mereka. Optin Forms adalah plugin gratis lainnya yang responsif dan ditampilkan tanpa masalah di mobile devices.
Ini menawarkan 5 desain formulir keikutsertaan yang berbeda yang bisa kamu tambahkan ke posting, halaman, dan widget kamu melalui kode pendek.
Pemilik UKM akan ingin mempertimbangkan plugin WordPress HubSpot. Plugin gratis ini menyediakan formulir, pop-up, obrolan langsung, dan analitik. Ini terintegrasi dengan HubSpot CRM (database kontak) gratis yang memudahkan untuk mengelola prospek kamu dan mengirim tanggapan email otomatis ketika seseorang mengisi formulir.
» E-Commerce
Jika kamu menjalankan website untuk UKM dan sangat bergantung pada WooCommerce, sangat penting bahwa toko kamu ditampilkan dan berfungsi sebagaimana mestinya di seluler, serta di desktop. Jika kamu membuat website menggunakan salah satu theme Woo, kemungkinan besar toko kamu mobile-friendly.
Pengembang di balik WooCommerce dan WooThemes telah membangun theme responsive sejak 2011 sehingga website yang menggunakan theme mereka seharusnya tidak mengalami masalah. Jika kamu menempuh rute yang berbeda dan membeli theme dari pasar theme atau kamu mempunyai situs kustom yang dikembangkan, maka kamu mempunyai dua opsi. Opsi pertama adalah
Jika kamu menempuh rute yang berbeda dan membeli theme dari pasar theme atau kamu mempunyai situs kustom yang dikembangkan, maka kamu mempunyai dua opsi. Opsi pertama adalah menghubungi perancang web kamu dan minta mereka memastikan toko online kamu dioptimasi untuk traffic seluler.
Ini berarti skala gambar produk kamu tergantung pada ukuran layar tanpa terlihat terpotong, tombol toko tidak melebihi ukuran layar yang diizinkan, dan bidang input pada formulir pemesanan memicu keyboard yang benar untuk bidang yang tepat. Pilihan kedua adalah
Opsi kedua adalah memasang plugin mobile-friendly seperti WPTouch atau modul theme mobile-friendly Jetpack. Kelemahan dari pendekatan ini adalah website kamu akan terlihat berbeda di mobile devices.
» Embedding Objects Dengan Lebar dan Tinggi yang Ditetapkan
Jika kamu mengandalkan penyematan video atau infografis YouTube di website kamu, kamu mungkin memperhatikan bahwa mereka mempunyai lebar dan tinggi yang ditetapkan. Hal ini bisa merugikan pengalaman pengunjung dari seluler kamu, jadi cara terbaik untuk memastikan hal ini tidak terjadi adalah dengan mengikuti tips yang diuraikan dalam artikel Majalah Smashing ini yang menjelaskan cara menyematkan konten eksternal dengan benar di website kamu.
» Slow Loading Times
Website yang memuat lambat akan merusak pengalaman pengunjung kamu tidak hanya di komputer biasa tetapi juga di mobile devices, terutama bagi mereka yang tidak mempunyai paket data yang banyak. Sejumlah tweak kecil seperti memperkecil style sheet dan file JavaScript kamu, meminimalkan jumlah plugin yang kamu gunakan dan mengkompresi gambar sebelum kamu mengunggahnya ke situs akan mempercepat website kamu. Menggunakan sebuah
Menggunakan plugin caching wp rocket serta berinvestasi dalam CDN Tercepat dan Termurah dan perusahaan hosting yang baik juga akan membuat perbedaan besar dalam waktu pemuatan website kamu dan meningkatkan peluang pengunjung dari seluler kamu bertahan. Selain masalah yang disebutkan di atas, ada beberapa hal lagi yang bisa kamu lakukan untuk memastikan website kamu mobile-friendly.
Solusi pertama dan paling jelas adalah dengan menggunakan theme WordPress yang responsif. Jika kamu mencari theme responsive gratis, tempat yang baik untuk memulai adalah repository theme resmi tempat kamu bisa memfilter pencarian kamu untuk theme responsive. Solusi berbayar termasuk
Solusi berbayar termasuk Genesis Framework (framework WP yang kami gunakan) yang theme turunannya (kami menggunakan Altitude Pro tetapi ada juga theme anak gratis di luar sana) responsif di luar kotak, atau cari theme responsif di ThemeForest.
Jika kamu belum tertarik untuk beralih theme, pertimbangkan untuk menggunakan plugin yang memberikan versi mobile-friendly dari situs kamu. Salah satu plugin tersebut adalah WP Mobile Detector. Secara otomatis mendeteksi jika pengunjung menggunakan ponsel standar atau smartphone dan memuat mobile theme WordPress yang kompatibel untuk masing-masing.
Plugin lain yang akan membantu kamu optimasi website kamu untuk seluler adalah Any Mobile Theme Switcher. Plugin ini mendeteksi mobile browser dan menampilkan theme sebagai pengaturan yang dilakukan dari area admin situs kamu, memberi kamu opsi untuk memilih mobile theme yang berbeda untuk setiap mobile browser.
Inisiatif AMP Google
Tahun lalu di bulan Oktober, Google mengumumkan proyek baru di bawah ikat pinggang mereka, yang disebut Accelerated Mobile Project. AMP adalah inisiatif open source yang bertujuan untuk meningkatkan dunia mobile web:
“Kami ingin laman web dengan konten yang kaya seperti video, animasi, dan grafik berfungsi bersama iklan pintar, dan dimuat secara instan. Kami juga ingin kode yang sama berfungsi di berbagai platform dan devices sehingga konten bisa muncul di mana saja dalam sekejap—apapun jenis ponsel, tablet, atau mobile devices yang kamu gunakan.” Sumber Proyek AMP bergantung pada AMP HTML – framework baru yang memungkinkan website membuat halaman web yang ringan.
Pada dasarnya, ini menghilangkan sebagian besar elemen yang menyebabkan halaman web dimuat lebih lambat di seluler, seperti JavaScript dan skrip pihak ketiga. Beberapa nama besar seperti Twitter, WordPress.com, Pinterest, Adobe Analytics, LinkedIn, telah menerima inisiatif ini dan bekerja sama dengan Google untuk membuat mobile web lebih baik bagi semua orang.
Apa Artinya Bagi Pemilik Website Seperti kamu?
Ada alasan bagus mengapa kamu mungkin mempertimbangkan untuk menggunakan AMP. Di bawah inisiatif AMP, halaman mobile-friendly akan muncul lebih tinggi di mesin pencari serta disorot dengan tanda lampu hijau kecil, mengundang pengguna untuk mengunjunginya.
Google telah membuat tutorial yang memandu kamu melalui pembuatan halaman AMP, sehingga memudahkan pemilik website untuk memulai AMP. Ini tidak berarti bahwa kamu harus meninggalkan WordPress demi peringkat yang lebih tinggi di mesin pencari.
Yang harus kamu lakukan adalah menginstal plugin AMP. Dengan plugin AMP aktif, semua postingan di situs kamu akan mempunyai versi kompatibel AMP yang dihasilkan secara dinamis, yang berarti pengunjung kamu tidak akan mengalami pengalaman seluler yang buruk.
Instant articles Facebook
Serupa dengan inisiatif AMP Google, Instant articles Facebook dibuat untuk memecahkan satu masalah tertentu – mengakhiri waktu pemuatan yang lambat di mobile devices. Seperti yang dijelaskan Josh Roberts:
“Tujuan Facebook adalah menghubungkan orang-orang dengan cerita, postingan, video, atau foto yang paling penting bagi mereka. Membuka Instant articles akan memungkinkan penerbit mana pun untuk menceritakan kisah menarik, yang dimuat dengan cepat, kepada orang-orang di seluruh dunia. Dengan Instant articles, mereka bisa melakukan ini sambil mempertahankan kontrol atas pengalaman, iklan, dan data mereka.”
Dalam istilah awam, Instant articles akan memungkinkan penerbit menghasilkan konten dan pengguna melihat konten sebagai dokumen HTML5 yang dioptimasi untuk kinerja seluler yang cepat. Pengguna Facebook iPhone dan Android akan bisa terlibat dalam artikel multimedia yang menarik secara visual, interaktif, langsung dari platform Facebook. Instant articles akan mencakup pemutaran video otomatis, peta interaktif, fitur zoom-in, dan audio.Dan karena Instant articles akan dimuat langsung dari server Facebook, itu akan menjadi sepuluh kali lebih cepat daripada memuat melalui browser smartphone.
Ini mengarah pada pembagian yang lebih cepat yang berarti konten kamu akan menyebar lebih jauh dan dalam periode waktu yang lebih singkat, yang secara alami menghasilkan lebih banyak klik, lebih banyak eksposur, dan pada akhirnya lebih banyak penjualan. Menurut data dari pengujian platform sejak Mei 2015
- Instant articles menerima klik 20% lebih banyak daripada artikel mobile web dari Kabar Beranda
- Setelah seseorang mengklik Instant articles, mereka 70% lebih kecil kemungkinannya untuk meninggalkan artikel sebelum membaca
- Mereka dibagikan 30% lebih banyak daripada rata-rata artikel mobile web
Untuk memulai Instant articles Facebook, hal pertama yang perlu kamu lakukan adalah mendaftar melalui http://instantarticles.fb.com/. Setelah itu, kamu harus memilih halaman bisnis Facebook kamu dan mengklaim URL kamu. Setelah kamu mengklaim URL kamu, langkah selanjutnya adalah membuat artikel. Kabar baiknya adalah artikel bisa diterbitkan langsung dari WordPress.
Facebook telah membuat plugin untuk merampingkan proses pembuatan Instant articles. Sampai sekarang plugin bisa diunduh dari GitHub tetapi akan segera tersedia dari repositori plugin resmi. Langkah selanjutnya adalah mengunggah logo kamu sendiri dan memilih font yang akan digunakan dalam artikel kamu.
Terakhir, kirimkan umpan kamu untuk ditinjau oleh Facebook untuk memverifikasi bahwa semua artikel yang dihasilkan dari website kamu telah diformat dengan benar. Perlu disebutkan bahwa kamu bisa memonetisasi artikel serta menyertakan formulir pendaftaran email.
Kesimpulan
Mempunyai website WordPress yang mobile-friendly bisa membuat perbedaan yang signifikan antara bisnis kamu menarik pelanggan dan klien baru atau mengirim mereka ke website pesaing kamu. Cara terbaik untuk memastikan situs WordPress kamu mobile-friendly adalah dengan mengikuti tip dan praktik yang diuraikan dalam artikel ini. Apakah kami melewatkan sesuatu atau kamu punya saran? Beri tahu kami di komentar di bawah!
