Saat ini banyak jenis perangkat dirancang untuk dapat mengakses website, seperti tablet, smartphone dan lain sebagainya. Jika Anda memiliki website tentunya jika tampilan website dapat mendukung atau memiliki desain Responsive semua perangkat yang ada saat ini akan menambah pengalaman digital secara visual sangat menarik, dapat meningkatkan pengunjung website, meningkatkan SEO, dan lain sebagainya.
Sebelum masuk ke pembahasan inti, perlu Anda ketahui terlebih dahulu apa itu desain Responsive?. Desain Responsive adalah desain yang memungkinkan website dapat menyesuaikan pada semua ukuran perangkat (Desktop, tablet, tablet dan orientasi layar) seperti gambar, ukuran font, tombol dan lain sebagainya. Tujuan penggunaan responsive adalah sebuah website dapat digunakan dan mendukung di seluruh perangkat sehingga komponen website berada pada posisi yang tepat dengan ukuran yang proposional.
94% Pengunjung menilai website berdasarkan Responsivenya
Dapat dilihat pada gambar diatas, pada gambar sebelah kiri website tampak ukuran font dan gambar tertata dengan baik dan kelihatan bagus. Sedangkan pada gambar sebelah kanan terlihat judul artikel terpotong da ngambar juga terpotong, tidak ada jarak sebelah kanan gambar dan terlihat seperti terpotong.
Cara Cek Website Responsive
Lalu bagaimana cara cek website yang kita miliki sudah responsive atau belum? Cara ini tidak akan mempengaruhi website yang ada saat ini, jika anda melakukan beberapa perubahan pada kode HTML dan CSS itu hanya bersifat sementara dan tidak permanen. Anda dapat menggunakan beberapa cara dibawah ini.
Inspect Element
Cara cek website responsive atau tidak yang paling mudah adalah Inspect Element yang sudah tersedia pada web browser yang Anda pakai. Lalu bagaimana cara menggunakan inspect Element? Cukup mudah, Anda hanya perlu klik kanan pada layar browser lalu pilih Inspect, perhatikan gambar dibawah ini.
Setelah itu akan muncul pada bagian bawah layar Anda seperti tampilan jendela struktur element HTML pada kolom sebelah kiri dan tampilan jendela CSS pada kolom sebelah kanan Anda.
Aktifkan atau klik bagian yang bertanda merah pada gambar diatas. Kedua tool tersebut berfungsi untuk menyeleksi elemen mana yang akan di cek dan memilih beberapa perangkat apa saja yang sudah responsive atau belum. Anda dapat memilih perangkat dan ukuran layar denga sudah tersedia atau Anda dapat memasukkan nilai ukuran layar yang diinginkan. Perhatikan gambar dibawah ini. Jika Anda ingin menggunakan ukuran layar yang sudah ada, silahkan klik atau pilih tab atau kolom yang tersedia di bawah menu responsive.
Lalu bagaimana website yang kita miliki lebih responsive? Anda dapat menggunakan CSS (cascading style sheets) untuk mengatur ukuran elemen dan lain sebagainya dengan menargetkan beberapa ukuran perangkat yang ingin anda sesuaikan.
Google Search Console – Mobile Friendly Test
Google Search Console juga menyediakan fasilitas untuk Anda cek website responsive, tentunya website Anda sudah terdaftar di google search console sebelumnya untuk dapat mengetahui secara otomatis website Anda sudah mobile Friendly atau belum. Silahkan kunjungi https://search.google.com/test/mobile-friendly untuk uji coba, copy URL website Anda atau dapat juga menggunkan URL halaman atau Post yang ada pada website. Paste URL tadi pada kolom URL Pengujian mobile friendly test kemudian tekan tombol kuning uji URL.
Tunggu hingga proses analisa berjalan hingga selesai. Proses analisa ini membutuhkan waktu yang berbeda pada setiap halaman atau website. Jika halaman yang diuji memenuhi persyaratan mobile friendly atau responsive maka akan tampil seperti dibawah ini:
Am I Responsive
Am I Resonsive merupakan website yang menyediakan fasilitas cek responsive website. Anda akan mendapatkan hasil tampilan langsung pada beberapa perangkat seperti dekstop, mobile, dan tablet. Anda juga dapat menggunakan hasil yang di tampilkan langusung seperti tampilan sesungguhnya ketika anda menggunakan perangkat tersebut. Anda dapat melakukan scroll hingga klik pada elemen yang ada pada layar.
Caranya cukup mudah untuk menggunakan AM I RESPONSIVE, copy dan paste URL website atau halaman Anda pada kolom URL uji coba dan tekan tombol GO! Jika tampilan website Anda terlihat rapi dan proposional pada hasil yang ditampikan, maka website anda sudah responsive.
Demikan lah cara cek website responsive, jika wesbite Anda belum responsive silahkan cepat perbaiki demi kemajuan dan kenyamanan pengunjung wesbite Anda. Jika ada yang perlu ditambahkan dan di koreksi, silahkan ajukan pada kolom komentar dibawah ini ya!. Semoga bermafaat dan terimakasih.
