Berkenalan dengan Responsive Web Design

Beberapa tahun belakangan ada sebuah tren didalam web design yang bernama “Resposive Web Design”. Dimana tampilan website jika dibuka menggunakan browser desktop dan browser smartphone akan memiliki tampilan yang berbeda. Dalam hal ini bukan di handle menggunakan 2 buah template yang berbeda, tetapi hanya handling pada property CSS yang mengatasinya.

Apa sih Responsive Web Design itu?
Responsive web design merupakan sebuah metode yang membuat tampilan website anda lebih nyaman ketika dibuka menggunakan smartphone atau tablet. Dulu ketika kita membuka halaman web tertentu dan membukanya dengan smartphone kita harus geser kiri, kanan, zoom in dan zoom out untuk membaca kontennya. Jika kita mengimplementasi responsive web design maka ketika halaman website kita dibuka menggunakan browser dari smartphone atau tablet maka tampilannya akan disesuaikan.

Contoh paling sederhana adalah website belajarngoding.com ini, jika kalian membuka website ini menggunakan browser desktop dan browser smartphone maka tampilannya akan berbeda, pada browser smartphone akan lebih fokus kepada konten dan dibuat hanya 1 kolom utama saja.

Untuk lebih jelasnya coba perhatikan gambar dibawah ini

responsive-desktop-vs-mobile

Pada gambar sebelah kiri merupakan implementasi pada desktop browser, sedangkan sebelah kanan merupakan implementasi responsive web design pada mobile browser (smartphone).

Sudahkah anda mengimplementasi responsive pada website anda?