Membuat web untuk smartphone dan tablet menggunakan twitter bootstrap

Hallo blogger yang budiman,  selamat datang kembali di blog ini.  Pada kesempatan kali ini kita akan sharing mengenai membuat web untuk smartphone  dan tablet  menggunakan twitter bootstrap.
Berbicara sedikit tentang bootstrap,  bootstrap  adalah sebuah framework yang berisi style css dan library javascript yang dibuat oleh developer twitter yaitu mark otto,  yang digunakan oleh banyak web site yang sudah tidak asing lagi bagi kita,  seperti twitter.
Kenapa twitter bootstrap  banyak digunakan oleh web site? Ada beberapa keunggulan dari twitter bootstrap, diantaranya memiliki framework yang simple, dapat digunakan untuk membuat web reponsive, memiliki library icon.
Sebentar, kita baca ulang alasa kedua menggunakan twitter bootstrap, yaitu web responsive. Apa itu web responsif? Web responsif adalah web yang dapat menyesuaikan ukuran tampilan pada browser yang digunakan, browser pada smartphone, tablet, netbook maupun desktop. Berikut ini beberapa contoh web responsif.

Terlihat perbedaan antara versi dekstop dengan versi mobile ( smartphone atau tablet), ada yang merubah posisi layoutnya, ada yang menghilangkan beberapa elementnya, ada juga yang merubah tampilan web secara keseluruhan.

Sebelum kita mulai membuat web, ada beberapa persiapan yang dibutuhkan dalam tutorial ini :
framework twitter bootrap, dapat diunduh melalui http://twitter.github.io/bootstrap/assets/bootstrap.zip , versi saat tulisan ini ditulis adalah versi 2.3.2

jquery, dapat diunduh melalui http://code.jquery.com/jquery-1.10.1.min.js, versi saat tulisan ini ditulis adalah versi 1.10.1

dan terakhir adalah bracktes, dapat diunduh melalui http://download.brackets.io/, braket adalah ide yang digunakan untuk membuat koding, ini optional dapat juga menggunakan notepad++, dreamwever atau software lain yang sejenis.

Sekarang kita mulai membuat webnya.

Setelah semua kebutuhan dasar diunduh, ektrak file bootstrap.zip, hasil foldernya akan kita gunakan sebagai tempat untuk membuat web. di dalam folder bootstrap terdapat tiga buah folder yaitu :

  • css, berisi file css
  • img, berisi gambar icon
  • js, berisi file javascript

 

4 thoughts on “Membuat web untuk smartphone dan tablet menggunakan twitter bootstrap

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s