Kesalahan umum

Halaman ini menjelaskan beberapa kesalahan paling umum yang dilakukan webmaster saat merancang untuk seluler.

File JavaScript, CSS, dan Gambar yang Diblokir

Untuk perenderan dan pengindeksan yang optimal, selalu izinkan Googlebot mengakses file JavaScript, CSS, dan gambar yang digunakan oleh situs web Anda, sehingga Googlebot dapat melihat situs seperti pengguna pada umumnya. Jika file robots.txt situs Anda tidak mengizinkan crawling aset tersebut, secara langsung hal ini akan mengganggu seberapa baik algoritme kami merender dan mengindeks konten Anda. Ini dapat mengakibatkan peringkat yang tidak optimal.

  1. Pastikan Googlebot dapat meng-crawl file JavaScript, CSS, dan gambar Anda menggunakan "fitur Inspeksi URL" di Search Console. Tindakan ini memungkinkan Anda melihat secara persis cara Googlebot melihat dan merender konten, sehingga akan membantu Anda mengidentifikasi serta memperbaiki sejumlah masalah pengindeksan pada situs.

  2. Periksa dan uji robots.txt Anda di Search Console.

  3. Uji halaman seluler dengan Pengujian Situs Mobile-Friendly untuk melihat apakah sistem kami mendeteksi situs Anda sebagai situs yang kompatibel untuk pengguna seluler.

  4. Jika menggunakan URL yang terpisah untuk halaman seluler, pastikan Anda menguji URL desktop dan seluler agar dapat mengonfirmasi bahwa pengalihan dikenali dan dapat di-crawl.

Konten yang Tidak Dapat Diputar

Beberapa jenis video dan konten tidak dapat diputar di perangkat seluler, seperti media yang dibatasi lisensi atau pengalaman yang memerlukan Flash maupun pemutar lain yang tidak didukung secara luas di perangkat seluler. Konten yang tidak dapat diputar, saat ditampilkan di halaman situs apa pun, dapat membingungkan pengguna.

Saat pengguna membuka halaman dengan konten yang tidak didukung di perangkat seluler, mereka akan melihat pesan error yang serupa dengan di bawah:

Video tidak dapat diputar

Hal ini memberikan pengalaman seluler yang buruk kepada pengguna!

Daripada menggunakan pemutar video kepemilikan atau menempatkan konten dalam format yang tidak didukung, sebaiknya gunakan tag standar HTML5 untuk menyertakan video atau animasi.

Untuk konten animasi yang dirender menggunakan Flash atau pemutar multimedia lain, pertimbangkan untuk menggunakan animasi HTML5 yang bekerja di semua browser web. Google Web Designer memudahkan Anda membuat animasi ini dalam format HTML5.

  • Gunakan standar HTML5 untuk animasi guna memberikan pengalaman yang baik kepada semua pengguna.
  • Gunakan penyematan video yang dapat diputar di semua perangkat.
  • Pertimbangkan untuk menyediakan transkrip video. Ini akan membuat situs Anda dapat diakses oleh pengguna yang menggunakan teknologi browsing asistif, atau yang memiliki browser yang tidak dapat memutar format video kepemilikan.

Untuk detail selengkapnya, baca tentang praktik terbaik video di Dasar-Dasar Web Google.

Pengalihan yang Salah

Jika Anda memiliki URL seluler yang terpisah, Anda harus mengalihkan pengguna seluler di setiap URL desktop ke URL seluler yang tepat. Pengalihan ke halaman lain (misalnya selalu diarahkan ke beranda) bukanlah tindakan yang benar.

Contoh:

  • Server situs desktop dikonfigurasikan untuk mengalihkan pengguna seluler ke halaman beranda situs seluler, terlepas dari URL mana yang awalnya mereka minta, meskipun situs seluler memiliki halaman yang setara dengan halaman desktop yang dialihkan.
  • URL situs desktop Anda dibuat secara dinamis dengan parameter URL yang tidak terpetakan dengan baik ke URL seluler yang setara. Misalnya, pengguna yang mencari jadwal kereta api pada tanggal tertentu di situs desktop akan bingung jika mereka dialihkan ke halaman penelusuran jadwal umum di situs seluler. Sebaiknya konfigurasikan pengalihan dengan benar jika Anda memiliki URL seluler setara sehingga pengguna akhirnya dapat membuka halaman yang mereka cari.

  • Situs desktop Anda mengalihkan beberapa jenis perangkat seluler, namun tidak untuk jenis lainnya. Misalnya, situs hanya mengalihkan pengguna Android ke situs seluler dan tidak mengalihkan pengguna iPhone atau Windows Phone.

  • Gunakan Search Console. Jika Anda adalah pengguna terverifikasi, kami akan mengirimkan pesan kepada Anda jika kami mendeteksi bahwa halaman situs mengalihkan pengguna smartphone ke halaman beranda. Kami juga akan menampilkan semua pengalihan yang salah, yang terdeteksi di bagian Error Crawl Smartphone pada Search Console. Gunakan URL contoh yang kami berikan di Search Console sebagai titik awal untuk melakukan debug secara tepat pada tempat terjadinya masalah di konfigurasi server Anda.

  • Siapkan server Anda sehingga server mengalihkan pengguna smartphone ke URL yang setara di situs smartphone.

  • Jika halaman di situs Anda tidak memiliki versi smartphone yang setara, pertahankan pengguna di halaman desktop, jangan alihkan mereka ke halaman beranda situs smartphone. Dalam kasus ini, lebih baik Anda tidak melakukan apa-apa daripada melakukan sesuatu yang salah.

  • Coba gunakan desain web yang responsif, yang menampilkan konten yang sama untuk pengguna desktop dan smartphone.

404 Khusus Seluler

Beberapa situs menyajikan konten kepada pengguna desktop yang mengakses URL, tetapi menampilkan halaman error kepada pengguna seluler.

404 khusus seluler

Untuk memastikan pengalaman pengguna terbaik, jika Anda mengetahui bahwa pengguna mengunjungi halaman desktop dari perangkat seluler dan Anda memiliki halaman seluler yang setara di URL lain, alihkan mereka ke URL tersebut daripada menunjukkan halaman 404 atau lhaaman 404 ringan. Selain itu, pastikan halaman yang mobile-friendly tersebut bukan halaman error.

Pengalihan yang baik
  • Gunakan Search Console. Jika Anda adalah pengguna terverifikasi untuk situs tersebut, kami akan mengirimkan pemberitahuan kepada Anda di Pusat Pesan.

  • Jika Anda memiliki situs smartphone di URL terpisah, siapkan server sehingga server mengalihkan pengguna smartphone ke URL yang setara di situs smartphone.

  • Jika Anda menggunakan Penayangan dinamis, pastikan deteksi agen pengguna dikonfigurasikan dengan benar.

  • Jika halaman di situs Anda tidak memiliki versi setara di smartphone, jangan alihkan pengguna dari halaman desktop. Menampilkan konten yang dicari pengguna merupakan pengalaman yang jauh lebih baik daripada menampilkan halaman error.

  • Gunakan desain web yang responsif jika memungkinkan. Konfigurasi ini memungkinkan Anda menampilkan konten yang sama kepada pengguna, apa pun perangkat yang mereka gunakan.

  • Lihat laporan Error Crawl di Search Console; tab Smartphone akan menampilkan daftar URL terdeteksi yang menampilkan error 404 khusus smartphone.

Hindari interstisial

Banyak situs web menampilkan interstisial atau overlay yang menutupi sebagian atau seluruh konten halaman yang dikunjungi pengguna. Interstisial ini, yang sering muncul di perangkat seluler untuk mempromosikan aplikasi asli situs web, milis, formulir pendaftaran, atau iklan, memberikan pengalaman yang buruk untuk pengguna. Pada kasus yang ekstrem, interstisial ini dirancang agar pengguna merasa kesulitan untuk menutupnya dan melihat konten asli halaman. Karena bidang di layar perangkat seluler sangatlah terbatas, interstisial apa pun dapat berdampak negatif pada pengalaman pengguna.

Interstisial Pengunduhan Aplikasi

Banyak webmaster yang mempromosikan aplikasi asli bisnis mereka kepada pengunjung situs versi seluler mereka. Jika tidak dilakukan dengan hati-hati, tindakan ini dapat menyebabkan masalah pengindeksan, dan mengganggu pengunjung dalam menggunakan situs.

Hindari interstisial
Interstisial tersebut menghambat pengguna menyelesaikan tugas.
Banner aplikasi
Banner memungkinkan pengguna menyelesaikan tugas selagi menampilkan aplikasi.
  • Gunakan banner sederhana untuk mempromosikan aplikasi Anda, sejajar dengan konten halaman. Banner ini dapat diterapkan menggunakan:

    • Banner yang didukung browser seperti Smart App Banners untuk Safari atau Native App Banners untuk Chrome.
    • Banner atau gambar HTML, serupa dengan iklan kecil biasa, yang tertaut ke app store yang benar untuk melakukan download.
  • Jika Anda memiliki aplikasi Android, pertimbangkan untuk menerapkan pengindeksan aplikasi: jika konten yang terindeks dari aplikasi Anda relevan untuk kueri tertentu, kami akan menampilkan tombol instal di hasil penelusuran, sehingga pengguna dapat mendownloadnya dan langsung membuka halaman tertentu di aplikasi Anda.

Praktik umum saat situs web disajikan ke pengguna pada URL seluler yang terpisah adalah dengan memberikan link ke versi yang dioptimalkan untuk desktop, sekaligus link dari halaman desktop ke halaman seluler. Salah satu kesalahan umum adalah membuat link mengarah ke halaman yang tidak relevan, seperti link halaman seluler ke halaman beranda situs desktop.

  • Periksa link untuk memastikan bahwa link mengarah ke halaman setara yang benar.

Halaman Seluler Lambat

Sangat penting untuk memastikan situs seluler dimuat dengan cepat. Pengguna dapat menjadi sangat tidak nyaman jika mereka harus menunggu lama untuk melihat konten.

Gunakan Google PageSpeed Insights untuk mengetahui apakah halaman Anda memiliki masalah yang dapat membuatnya lambat, dengan berfokus pada sub-bagian “Kecepatan”. Cobalah untuk menyelesaikan masalah yang ditandai sebagai "Harus Diperbaiki".

Untuk informasi selengkapnya, lihat:

Setel viewport dengan benar

Karena pengunjung ke situs Anda menggunakan berbagai perangkat dengan berbagai ukuran layar, halaman Anda harus menetapkan viewport menggunakan tag meta viewport. Tag ini memberi tahu browser cara menyesuaikan dimensi dan penskalaan halaman agar sesuai dengan perangkat. Berikut adalah dua masalah umum:

  • Menggunakan viewport dengan lebar tetap. Hal ini membuat halaman tidak terskalakan dengan benar untuk semua ukuran perangkat (dan hal ini sering terjadi). Baca selengkapnya.
  • Mengasumsikan viewport minimum yang terlalu lebar, yang dapat memaksa pengguna perangkat berlayar kecil untuk melakukan scroll secara horizontal agar dapat membaca konten. Hal ini terjadi saat halaman menggunakan nilai mutlak di deklarasi CSS, atau menggunakan gambar yang didesain agar terlihat sangat baik pada lebar browser tertentu (misalnya 980px). Untuk memperbaiki error ini, pastikan halaman menggunakan lebar relatif dan nilai posisi untuk elemen CSS, dan pastikan gambar juga dapat diskalakan. Pelajari lebih lanjut.

Ukuran font kecil

Hindari penetapan ukuran font yang terlalu kecil di perangkat seluler, yang memaksa pengunjung "mencubit untuk memperbesar" agar dapat membacanya. Setelah menentukan viewport untuk halaman, setel ukuran font agar diskalakan dengan benar di dalam viewport. Baca lebih lanjut tentang praktik terbaik ukuran font di Menggunakan Ukuran Font yang Dapat Dibaca.

Elemen sentuh terlalu dekat

Hindari penetapan elemen sentuh seperti tombol dan link yang terlalu dekat satu sama lain dan membuat pengguna seluler sulit untuk menge-tap elemen yang diinginkan dengan jari mereka tanpa menge-tap elemen di dekatnya. Untuk memperbaiki error ini, pastikan ukuran dan ruang untuk link navigasi dan tombol sudah sesuai bagi pengunjung seluler. Baca selengkapnya di Mengatur Ukuran Target Tap dengan Tepat.

Kirim masukan tentang...

Penelusuran
Penelusuran