Materi
Google memakai versi seluler sebuah situs, yang dirayapi dengan perayap berjenis ponsel, untuk mengindeks dan memeringkat. Ini disebut mobile-first indexing. Akibatnya, isi yang hanya ada di versi desktop tidak ikut diindeks. Dari tiga konfigurasi situs ramah seluler, Google merekomendasikan desain responsif: HTML dan URL yang sama untuk semua perangkat, dengan tampilan yang menyesuaikan lebar layar lewat CSS. Media query-nya dibahas di kelas CSS Tata Letak dan Responsif.
Desain responsif butuh satu baris di head: <meta name="viewport" content="width=device-width, initial-scale=1">. Tanpa baris itu, browser ponsel merender halaman selebar layar desktop lalu mengecilkannya. MDN mengingatkan dua hal: lebar tetap seperti width=980 membuat halaman tidak mengikuti layar, dan user-scalable=no mencegah orang dengan penglihatan rendah memperbesar halaman, padahal WCAG meminta pembesaran minimal dua kali.
<!-- lebar tetap dan pembesaran dimatikan -->
<meta name="viewport" content="width=1024, user-scalable=no">
<!-- mengikuti lebar layar perangkat -->
<meta name="viewport" content="width=device-width, initial-scale=1">Untuk situs yang versi selulernya berbeda dari desktop, panduan mobile-first Google meminta beberapa kesetaraan: isi utama yang sama, heading yang sama jelasnya, data terstruktur yang sama, dan meta robots yang sama. Menyimpan isi di akordeon atau tab untuk menghemat ruang boleh, tetapi isi utama jangan dimuat hanya setelah pengguna menggeser, mengklik, atau mengetik, karena Google tidak melakukan interaksi itu.
