Perangkat seluler sudah terdiri dari sejumlah besar, jika bukan mayoritas, jumlah pembaca online untuk banyak situs web, jadi pastikan bahwa situs Anda akan terlihat dan berfungsi dengan baik pada iPhone atau tablet sangat penting. Ada banyak layanan yang menawarkan pratinjau tata letak seluler untuk URL yang diberikan, tetapi Apple membuat situs web pengujian untuk kesiapan seluler jauh lebih mudah dengan Safari 9 di OS X El Capitan. Fitur baru yang disebut Mode Desain Responsif dapat dengan cepat melihat seperti apa tampilan situs web di berbagai perangkat Apple serta resolusi layar ponsel yang umum. Begini cara kerjanya.
Penting untuk menegaskan kembali bahwa Mode Desain Responsif adalah fitur baru yang eksklusif untuk Safari 9 di OS X El Capitan, jadi Anda harus menjalankan setidaknya versi browser dan sistem operasi ini untuk mengaksesnya. Jika Mac Anda memenuhi persyaratan ini, Anda harus terlebih dahulu mengaktifkan Mode Pengembang Safari. Untuk melakukannya, luncurkan Safari dan klik Safari di Bilah Menu. Kemudian pilih Preferensi> Tingkat Lanjut .
Di tab Lanjut pada jendela Preferensi Safari, centang kotak berlabel "Tampilkan Menu Berkembang di Bilah Menu." Seperti yang tersirat dari nama opsi, Anda akan melihat menu "Kembangkan" muncul di bilah Menu Safari di sebelah kanan "Bookmark."
Selanjutnya, tutup jendela Safari Preferences dan navigasikan ke situs web yang ingin Anda uji dalam Mode Desain Responsif. Setelah situs web dimuat penuh di peramban Anda, gunakan pintasan keyboard Command-Option-R dan Anda akan melihat jendela peramban dikonversi menjadi pratinjau salah satu dari beberapa resolusi perangkat seluler (Anda juga dapat mengakses Mode Desain Responsif dengan mengeklik Kembangkan di Safari Menu Bar dan memilih Enter Mode Desain Responsif ).
Mode Desain Responsif Safari memungkinkan Anda melihat pratinjau bagaimana situs web terlihat pada semua resolusi perangkat seluler Apple, dari iPhone 4S 3, 5 inci hingga iPad Pro 12, 9 inci. Pengguna juga memiliki opsi untuk memilih resolusi "Retina" 1x, 2x, atau 3x dan mengubah agen peramban untuk meniru perilaku peramban paling populer seperti Chrome, Firefox, dan Edge.
Untuk setiap perangkat dan ukuran layar, pengguna dapat mengklik ikon perangkat untuk mengubah antara orientasi potret dan lanskap atau, untuk perangkat seperti iPad Air dan iPad Pro yang mendukung tampilan split, Anda dapat mengklik untuk memutar antara berbagai tata letak tampilan split.
Meskipun Mode Desain Responsif Safari tidak memiliki beberapa opsi alat yang sudah ada sebelumnya, membuatnya langsung menjadi Safari dapat menghemat waktu bagi para perancang web, dan alat pembelajaran dan pengujian yang bagus untuk pemilik situs web yang ingin memastikan bahwa pengunjung seluler mereka mendapatkan pengalaman terbaik terlepas dari resolusi atau ukuran layar.
Setelah selesai melakukan pengujian, Anda dapat meninggalkan Mode Desain Responsif dengan menutup jendela atau tab browser, atau menekan pintasan Command-Option-R lagi.
