Pernahkah kamu membuka situs website menggunakan smartphone dan menemukan tampilan yang morat-marit? sehingga menyebabkan informasi yang ingin kamu ketahui tidak dapat terbaca dan dipahami. Kesal sekali bukan? pastinya kamu akan bergegas menutup situs tersebut dan mencari informasi dari sumber yang lain. Hal tersebut merupakan pengalaman pengguna (user experience) yang tidak menyenangkan karena tampilan website (user interface) yang buruk.
Bagaimana jika hal yang sama terjadi dan mengganggu pengunjung website milikmu? dampaknya, websitemu akan berpotensi kehilangan traffic pengunjung bahkan target konsumen. Untuk menghindari hal tersebut maka kamu perlu membuat website responsif yang dapat menyesuaikan antarmuka (user interface) dengan berbagai ukuran layar dan area pandang. Desain website responsif adalah tentang membuat halaman website yang terlihat bagus di semua perangkat (W3schools, n.d.).
Untuk merancang website menjadi responsif, kamu dapat menggunakan bootstrap sebagai front-end framework ketika proses pengembangan pada website yang kamu rancang.
Apa itu Bootstrap?
Bootstrap adalah front-end open source toolkit sebagai framework bagi html, css, dan javascript yang digunakan untuk membantu developer merancang sebuah website responsif dengan cepat. Bootstrap berisi elemen antarmuka yang biasa digunakan seperti navbar, container, footer, dan elemen lainnya dalam bentuk “class”, sebagai template desain yang dapat diaplikasikan langsung pada halaman html.
Sebelum Kamu menggunakan komponen class dalam bootstrap, kamu harus menambahkan beberapa komponen JavaScript dalam bentuk plugin jQuery pada struktur html yang kamu buat. Untuk aturan dan tata cara mengaplikasikan bootstrap dapat kamu pelajari selengkapnya di Introduction · Bootstrap
Kegunaan Bootstrap
- Mempermudah Developer Merancang Website yang Responsif
Rangkaian grid system pada bootstrap terdiri dari containers, rows, dan column yang digunakan untuk menata dan menyelaraskan konten di berbagai macam ukuran layar pada perangkat. - Menyediakan Template Desain Elemen Website yang Siap Digunakan
Bootstrap memiliki berbagai template desain untuk komponen website seperti navigasi, tombol, tipografi, formulir, dan komponen antarmuka (user interface) yang lainnya. - Membuat Website Lebih Interaktif
Mengembangkan website menjadi lebih interaktif dengan menambahkan elemen interaktif seperti pop up, transisi, image carousel, dan lainnya menggunakan plugin custom JQuery.
Credit
- "Bootstrap" from Toptal blog The 10 Most Common Bootstrap Mistakes that Developers Make
Categories: Technology
Tags: #Website #Development #Responsive #Bootstrap #Framework
0 Comments
Leave a comment