Part 8 Cara Buat Layout Di HTML

Embed Size (px)

Citation preview

Setelah pada tutorial sebelumnya Sobat Bloger belajar dasar HTML baik itu untuk membuat tabel, memasukkan gambar, order list, ataupuntag HTML, kini saya akan coba mengajarkan cara membuat layout yang nantinya menjadi kerangka dasar dari web itu sendiri. Layout dalam web bisa dibangun dengan 2 cara yaitu : 1. Menggunakan tabel Membangung website dengan memanfaatkan tabel untuk membuat kerangkanya. 2. Tanpa menggunakan tabel atau biasa disebut tableless Membangun layout website tanpa menggunakan tag tabel. Secara umum perkembangan website sekarang dalam membuat layout sudah tidak menggunakan tabel sebagai kerangkannya hal itu dikarenakan tabel sebenarnya diperuntukan dalam menampilkan data. Hal tersebut juga didasari dengan berkembangnya CSS (Cascade Style Sheet) yang memungkinkan pembuatan layout tanpa mempergunakan tabel. Pada tutorial cara membuat website statis ( part 8 ) ini saya akan menjelaskan cara membuat layout web dengan mempergunakan tabel dahulu, untuk yang tableless akan saya bahas pada tutorial yang akan datang.

Ok, langsung saja Sobat Bloger jalankan editor untuk mulai membuat layout. Pada editor tersebut ketik atau copy paste script dibawah ini Tutorial cara membuat layout Header website Menu website Sidebar websiteisi website Footer

Simpan file tadi dengan nama layout.html lalu jalankan pada web browser Sobat Bloger. Jika Sobat Bloger menjalankannya maka akan mendapatkan tampilan pada web browser seperti gambar 1.1

gambar 1.1

Dari gambar 1.1 saya membuat layout website dengan satu (1) sidebar dibagian kiri website. Ini merupakan standar layout yang sering Sobat Bloger jumpai di internet. Akan tetapi jika Sobat Bloger ingin bereksploarsi dalam membuat layout bisa dengan menambahkan tabel sesuai dengan keinginan Sobat Bloger. Semoga tutorial kali ini bisa bermanfaat buat Sobat Bloger