Sebelum kita mulai membuat
halam website terlebih dahulu kita memilih Framework apa yang akan kita gunakan
dalam pembuatan website,
Nah disini saya akan menggunakan framework Bootstrap,
Nah disini saya akan menggunakan framework Bootstrap,
Bootstrap adalah front-end framework yang solek, bagus dan luar biasa
yang mengedapankan tampilan untuk mobile device (Handphone, smartphone dll.)
guna mempercepat dan mempermudah pengembangan
website. Bootstrap menyediakan HTML, CSS dan Javascript siap pakai
dan mudah untuk dikembangkan.
Berikut ini langkah - langkah dalam membuat Halaman Website dengan
menggunakan Framework :
1. Download terlebih dahulu Bootstarp pada link di bawah ini
getbootstrap.com
maka akan
muncul gambar seperti di bawah ini :
2. setelah selesai
mendownload bootstrap, kita harus menginstal nya terlebih dahulu
3. Setelah menginstal Bootstrap kita pilih aplikasi apa yang akan kita gunakan
misalnya seperti: notepad ++, Sublime text, Dreamwever, dan lain-lain.
4. Disini saya menggunakan notepad ++ langkah pertama yaitu buat file
index.html terlebih dahulu
5. Disini saya menggunakan notepad ++ langkah pertama yaitu buat file index.html terlebih dahulu
agar website responsive
terhadap perangkat mobile Untuk memastikan render yang tepat dan sentuhan
zooming, tambahkan berikut <meta> tag
dalam <head> elemen:
·
meta
tag sendiri adalah rangkaian kode HTML yang biasa digunakan untuk mempermudah
Google dan browser untuk mengidentifikasi seluruh konten yang ada dalam website
tersebut.
·
meta
charset="utf-8" Universal Character
Set, atau yang umum disebut sebagai Charset adalah kumpulan dari beberapa jenis
pengkodean karakter baik huruf, angka, symbol, dll. Untuk untuk saat ini
pengkodean UTF-8 telah menjadi standarisasi untuk pengkodean dalam system
operasi, bahasa pemrograman, API, dan software.
·
width=device-width
Bagian menetapkan lebar halaman untuk mengikuti
layar-lebar perangkat (yang akan bervariasi tergantung pada perangkat).
·
initial-scale=1
bagian menetapkan tingkat zoom awal saat halaman
pertama dimuat oleh browser.
6. Setelah itu baru lah kita
hidupkan XAMPP Control Panel dan Start
7. Setelah itu panggil
module bootstrap di halaman index, kemudian akan tampil seperti gambar di bawah
ini yang menandakan bootstrap siap digunakan
8.Setelah itu kita akan membuat menu navigator
terlebih dahulu dengan perintah berikut ini
9. Langkah selanjutnya
masukan perintah berikut ini sesuai dengan apa yang akan kita mau buat :
10. Lalu
masukan perintah berikut dan desain dengan kreasi kita
11. Berikut
hasil nya
