Softonic

Penguji Keramahan Seluler

Langkah 1 / 2
Berikutnya

Masukkan sebuah URL, lalu alat pengujian akan memuatnya dalam tampilan layar ponsel simulasi (ukuran default 375×812 piksel, sesuai ukuran iPhone), memeriksa berbagai kesalahan keterbacaan yang umum terjadi pada perangkat seluler, yang sebelumnya ditandai oleh Tes Mobile-Friendly milik Google sebelum tes tersebut dihentikan, dan mengembalikan daftar masalah yang dapat diperbaiki: tag meta viewport yang hilang, teks dengan ukuran kurang dari 12px, target tap yang lebih kecil dari 48×48px, fitur gulir horizontal, plugin Flash atau plugin yang tidak didukung, serta konten yang lebar melebihi ukuran viewport.

Cara pelaksanaan tes

  1. 1

    Masukkan URL

    URL lengkap dengan protokol. Hanya untuk halaman publik.

  2. 2

    Halaman ditampilkan dalam viewport berukuran ponsel

    375×812 secara default, dapat dikonfigurasi.

  3. 3

    Pemeriksaan otomatis sedang berjalan.

    Meta viewport, ukuran teks, jarak antar titik tap, overflow, plugin.

  4. 4

    Pratinjau dan laporan

    Tangkapan layar tampilan ponsel hasil render beserta daftar masalah spesifik.

Apa yang diperiksa oleh pengujian

Konfigurasi viewport

Apakah ada model <meta name="viewport" content="width=device-width, initial-scale=1">? Jika tidak, peramban seluler akan menampilkan tampilan seolah telepon memiliki lebar layar setara dengan komputer desktop dan akan menyusut agar sesuai dengan ukuran layar, sehingga teks yang ditampilkan menjadi sangat kecil.

Ukuran teks

Setiap teks yang ditampilkan dengan ukuran kurang dari 12 px akan ditandai, sulit dibaca di ponsel tanpa fitur pinch-zoom. Banyak panduan gaya merekomendasikan ukuran huruf minimal 16 px untuk teks utama. Keterangan yang sangat kecil masih dapat diterima; namun, teks utama dengan ukuran 11 px tidak disarankan.

Ukuran target tekanan

– Tombol, tautan, dan kontrol formulir harus memiliki ukuran minimal 48×48 px (sesuai pedoman aksesibilitas seluler Google/W3C). Sasaran yang lebih kecil sulit disentuh secara akurat dengan ibu jari dan akan ditandai.

Jarak antar titik target

– Target yang berjarak lebih dekat dari 8 px dari target sekitarnya dapat menyebabkan tekanan yang tidak tepat; masing-masing ditandai secara terpisah.

Gulir horizontal

– Konten yang melebihi ukuran viewport memaksa pengguna melakukan geseran horizontal, sehingga menghasilkan pengalaman pengguna (UX) yang buruk di perangkat seluler. Hal ini umumnya disebabkan oleh gambar yang tidak memiliki kode identifikasi max-width: 100% atau tabel yang tidak dapat menyesuaikan tampilannya secara otomatis (reflow).

Plugin yang tidak didukung

Flash, Silverlight, dan ActiveX tidak dapat digunakan di ponsel. Situs lama terkadang masih menggunakannya.

Pemuatan font

Font web yang sangat besar dan menyebabkan proses rendering terhenti selama beberapa detik akan ditandai.

Mengapa hal ini masih penting

Google telah menghentikan uji coba khusus untuk perangkat seluler pada Desember 2023, namun tingkat kecocokan situs dengan perangkat seluler tetap menjadi indikator langsung dalam peringkat melalui metrik Core Web Vitals dan pengalaman pengguna halaman. Pendekatan indeksasi “mobile-first” berarti Google memindai situs Anda sebagaimana ditampilkan di ponsel; hal-hal yang tidak optimal saat digunakan di perangkat seluler juga akan muncul dalam peringkat versi desktop.

Perbaikan Umum

  • Tambahkan meta viewport ke <head> dan <meta name="viewport" content="width=device-width, initial-scale=1">.
  • CSS Responsif melalui kueri media: @media (max-width: 768px) { ... }.
  • Flexbox dan Grid, bukan tata letak berlebar tetap.
  • Atur gambar max-width: 100%; height: auto agar ukurannya menyusut seiring perubahan ukuran viewport.
  • Buat tabel dapat digulir pada layar kecil: gunakan format wrapping <div style="overflow-x: auto">.
  • Gunakan rem atau em untuk penentuan ukuran teks agar skala sesuai preferensi pengguna dapat berfungsi dengan baik.

Apa yang tidak terdeteksi oleh pengujian

– Kinerja pada perangkat keras nyata: Ponsel Android kelas bawah yang menggunakan jaringan 3G akan mengalami keterlambatan yang tidak disimulasikan oleh alat pengujian ini. Gunakan Lighthouse untuk mengukur kinerja secara akurat.

  • Interaksi sentuh: Daftar drop-down yang hanya dapat digunakan saat kursor di atasnya dan berfungsi secara otomatis saat disentuh perlu diuji secara manual pada perangkat nyata. – Aksesibilitas yang melampaui keterbatasan ukuran layar perangkat seluler. Gunakan fitur kontras, dukungan pembaca layar, dan navigasi menggunakan keyboard dengan alat aksesibilitas khusus.
  • Kesalahan JavaScript pada peramban khusus perangkat seluler. Safari di iOS terkadang berperilaku berbeda dibandingkan versi WebKit lainnya.

Pertanyaan yang Sering Diajukan

Pemeriksaan yang serupa, tetapi implementasinya berbeda. Google telah menghentikan layanan alat publiknya pada akhir tahun 2023. Alat pengujian ini menjalankan rangkaian pemeriksaan klasik yang sama seperti yang digunakan Google, terhadap versi halaman yang diambil oleh peramban tanpa header.

Ya, Google telah menerapkan pendekatan “mobile-first” sejak tahun 2020, artinya tampilan aplikasi untuk perangkat seluler menjadi versi utama yang digunakan dalam penentuan peringkat. Masalah terkait pengalaman pengguna di perangkat seluler dapat memengaruhi peringkat meskipun pencarian dilakukan dari komputer desktop.

Tidak. Alat pengujian hanya mengambil URL yang dapat diakses secara publik. Untuk pengujian tahap prototipe yang dilindungi, lakukan pengujian secara lokal menggunakan mode emulasi perangkat dari Chrome DevTools.

Nilai defaultnya adalah 375×812 (iPhone 12/13/14). Bisa dikonfigurasi menjadi 390×844 (iPhone 14 Pro), 360×640 (Android umum), atau 412×915 (Pixel 7).

Secara umum, prosesnya memakan waktu 5 hingga 15 detik, tergantung pada berat halaman. Halaman yang kompleks dan mengandung banyak kode akan membutuhkan waktu lebih lama; alat pengujian akan menunggu terjadinya peristiwa pemuatan serta periode tidak aktif singkat sebelum melakukan pencatatan data.

Alat Terkait

Pemeriksa Panjang Deskripsi Meta

Ukur meta deskripsi dalam karakter dan perkiraan piksel, bandingkan acuan editorial, lalu tinjau contoh tata letak desktop dan seluler.

Simulator SERP Google

Periksa snippet perkiraan bergaya Google dengan batas karakter untuk seluler dan desktop. Draf Anda tetap di sesi browser ini.

Validator Sitemap XML

Periksa XML sitemap di browser untuk menemukan error parsing, lokasi yang hilang, URL duplikat, dan nilai kolom umum.

Pemeriksa header keamanan HTTP

Tempel header respons HTTP dan tinjau HSTS, CSP, clickjacking, MIME, referrer, serta kebijakan lintas origin secara lokal.

Ekstraktor Tautan Eksternal

Tempelkan kode HTML mentah, tentukan URL dasar secara opsional, dan dapatkan daftar bersih tanpa duplikat dari semua tautan eksternal http/https dalam kode untuk audit tautan dan evaluasi SEO.

Pemeriksa URL Canonical

Tempelkan HTML sebuah halaman dan periksa tag rel=canonical-nya: apakah ada, apakah URL absolut yang valid, apakah cocok dengan URL halaman?

Alat ini tersedia dalam bahasa lain