Trik Cepat Membuat Desain Website Menggunakan Bootstrap

Setelah beberapa hari  tidak nulis blog, akhirnya siang ini saya berkesempatan untuk menulis tentang trik cepat membuat desain website. Ide dari tulisan ini bermula ketika saya mengikuti acara Startup Springboard World Tour pada tanggal 15-17 November 2013 yang lalu.

Pada acara kompetisi “startup” tersebut, saya bertugas menjadi seorang web desainer. Salah satu tugas saya tentu saja adalah membuat desain website untuk implementasi ide dari startup tim kami. Dalam waktu yang terbatas, membuat desain website keren adalah mustahil kecuali bagi seorang desainer web profesional. Oleh karena itu sebagai seorang web desainer di dalam tim, saya harus mencari cara tercepat untuk  membuat desain website.

Trik Cepat Membuat Desain Website

Sebenarnya untuk membuat desain website kita bisa saja mengambil template yang sudah banyak tersebar di internet. Tetapi waktu itu saya tidak menemukan template yang cocok. Ditambah lagi, sebagian besar dari template yang dapat diunduh dengan gratis tersebut [harus] menyertakan credit pada footer template.  Ehm, sebenarnya bisa saja sih credit dihilangkan, tapi ga enak donk, karena seperti itu sama saja tidak menghargai si pembuat template tersebut. Ingat, membuat template keren itu tidak mudah!

Oke, setelah beberapa saat browsing, saya teringat akan Bootstrap, dengan boostrap kita bisa membuat template website dengan mudah dan cepat…katanya. Terus terang sebelumnya saya belum pernah menggunakan bootstrap secara langsung, jadi untuk belajar pun masih  meraba-raba hahaha. Untuk mendownload Bootstrap gunakan link berikut ini http://getbootstrap.com/

Menggunakan Start Bootstrap

Oke, ini adalah trik yang saya maksud. Jika dengan mendownload bootstrap belum menyelesaikan permasalahan, maka yang harus kita lakukan adalah mencari cara supaya dapat dengan mudah menggunakan fitur-fitur bootstrap.

Website Start Bootstrap adalah salah satu website yang dapat digunakan sebagai starter atau ide awal kita mendevelop sebuah template dengan menggunakan bootstrap. Di dalam website tersebut, dapat kita temukan berbagai style tampilan halaman yang dapat kita unduh dan gunakan dalam pengembangan website kita.

Pada halaman http://startbootstrap.com/all-templates dapat kita temukan berbagai macam  bentuk seperti portofolio, blogpost, thumbnail dan masih banyak lagi, yang jelas template awal yang saya butuhkan sudah tersedia di sana. Tanpa pikir panjang, langsung saja saya gunakan template di website tersebut.

trik cepat membuat desain website menggunakan bootstrap
Gambar Halaman Web StartBootstrap

Mencari template untuk komponen tertentu

Permasalahan tentang template sudah selesai, tapi masih ada permasalahan baru yaitu bagaimana mendesain komponen di dalam website seperti form, button, header, dan lain sebagainya karena saya tidak tahu class apa yang digunakan untuk format yang saya inginkan.

Untuk menjawab pertanyaan tersebut, kita bisa menggunakan contoh-contoh komponen di dalam bootstrap yang disediakan oleh website Bootsnipp. Bootsnipp menyediakan banyak contoh komponen di dalam bootstrap seperti form Login, Navbar, Button, Table  yang dapat kita copas ke dalam template buatan kita tadi. Sebagian besar komponen di dalam Bootsnipp dapat digunakan secara langsung selama bootstrap yang kita gunakan memiliki versi yang sama dengan yang ada di Bootsnipp.

Sekian post tentang trik cepat membuat desain website.

Semoga bermanfaat.

Leave a Comment