Cara Mebuat Desain Responsive (Bootstrap) – Perkembangan teknologi membuat website dan aplikasi web dapat diakses melalu banyak perangkat. Dahulu website di akses melalui jaringan internet menggunakan komputer atau pc yang terkoneksi ke internet. Namun dengan kecanggihan teknologi yang semakin pesat aplikasi web dapat diakses dari banyak perangkat atau gadget. Perangkat tersebut kini sudah semakin mobile. Beberapa gadget yang sekarang banyak digunakan untuk mengakses internet misal smart phone, table, ipad dan banyak perangkat lainya.
Berdasarkan latar belakang tersebut para pengembang aplikasi khususnya web menciptakan konsep responsive pada web yang sekarang di kenal dengan istilah bootstrap. Bootstrap atau tampilan responsive adalah sebuah tampilan yang fleksibel mengikuti ukuran perangkat dalam akses internet.
Nah untuk yang beru belajar bagaimana cara buat web agar dapat di akses dari handphone atau hp dapat menggunakan beberapa dasar template yang sudah di kembangkan di beberapa pengembang desain mobile berikut ini. Inti dari bootstrap atau reponsive adalah pada casecading style sheet atau CSS.
Buat yang masih bingung perbedaan tampilan responsive, cara melihatnya dapat langsung mengakses melalu perangkat handphone atau juga dapat menggunakan browser semisal google chrome atau juga mozilla dan sejenisnya. Caranya yaitu dengan mengecilkan browser yang digunakan untuk mengaksesnya.. Berikut contohnya.
Contoh sebelum browser di kecilkan
Cara Mebuat Desain Responsive (Bootstrap)
contoh seduah browser di kecilkan
Cara Mebuat Desain Responsive (Bootstrap)
Mebuat Desain Responsive
Konsep dari tampilan mobile atau responsive adalah mengunakan style berdasarkan persentase. Untuk dasar pembuatan template website bootstrap dapat menggunakan yang sudah ada dan di kembangkan beberapa website berikut ini.
1. getbootstrap.com
Sebuah situs yang menyediakan beberapa dasar dan juga panduan menggunakan template responsive.
Beberapa template yang ada diantaranya:
- Starter template
- Boostrap theme
- Grids
- Jumbotron
- Narrow Jumbotron
- Navbars in action
- Custom components
Untuk download beberapa jenis template diatas disni
2. startbootstrap.com
Pada website ini template yang disajikan lebih terkesan menarik dan siap digunakan dibandingkan dengan situs diatas. Untuk website diatas lebih berfokus ke dasar-dasar bootstrap. Pada web ini menjadikan jenis template semisal untuk admin dan juga tampilan web atau blog.
Template yang ada pada startbootstrap yaitu:
- Creative
- Clean blog
- agency
- freelancer
- dan masih banyak lagi
Untuk mendownload templatenya disini
3. wrapbootstrap.com
Pada website ini template yang disajikan sangat menarik dan atraktif. Namun sayangnya banyak juga template yang di tampilkan tidak gratis alias berbayar. Namun buat kamu yang pengen belajar membuat desain yang menarik tidak ada salahnya mencoba beberapa template berbasar yang ada disitu sini
Untuk download templatenya disni
Demikian panduan singkat mengenai bagaiman acara membuat template mobile friendly semoga bermanfaat. Caranya dari pada bingung membuat dari awal, tinggal download beberapa template diatas, kemudian edit sesuai dengan kebutuhan.
Postingan berikutnya
- contoh script web responsive