Membuat Layout Website

Pada pembahasan sebelumnya, kita sudah diperkenalkan dengan makhluk yang namanya HTML, untuk selanjutnya saya harap kita sudah mulai akrab dan mulai membuka diri agar hubungan ini bisa terus langgeng #halah..  Oke kita kembali ke topik pembahasan. Disini kalian akan belajar membuat layout sebuah website.

Salah satu tag dalam HTML yang biasa digunakan untuk membuat sebuah tampilan web
adalah tag table (<table></table>) berikut anak keturunannya dari tag table tersebut tentunya. Sebagai ilustrasi tampilan web yang akan dibuat adalah sebuah halaman yang memiliki header diatas, dibawahnya satu kolom yang berisi menu atas (top menu), dibawahnya ada dua kolom yaitu kolom kiri sebagai menu kiri (left menu) dan kolom utama (main) yang berisi konten web dan terakhr dibawahnya ada footer.  Agar lebih mudah membayangkan, gambar bisa dilihat seperti dibawah ini.
layout web

Gambar : Layout Tampilan Web

Setelah kita memiliki bayangan terhadap tampilan yang akan kita buat, maka kita bisa mulai membuat kodingan  untuk tampilan tersebut (koding atau coding adalah istilah yang akan sering saya gunakan dalam penjelasan kedepannya, maka sejak saat ini kalian juga harus mulai familiar dengan istilah ini.. okeh ^-^).

Sebagai informasi : untuk text editor, saya menggunakan notepad++, kalau ditanya alasannya kenapa.. hmmm.. ya karena sudah terbiasa aja.. hehe.. sebenarnya saya lebih memilih notepad++ dibandingan dreamweaver atau IDE untuk editor lainnya adalah karena ringan dan melatih sensitivitas saya dalam membuat atau membaca koding.. Just simple reason right =) .

Mengenal HTML

HTML Icon

HTML Icon

Hypertext Markup Language atau lebih akrab kita kenal dengan HTML adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. [sumber : Wikipedia]

Berdasarkan pengertian diatas yang saya kutip dari wikipedia, rasanya sudah cukup jelas mengenai apa itu HTML. Jika masih ada yang merasa bingung, mari kita permudah saja dengan bahasa begini “kalau pengen tulisan baik informasi/gambar yang kita tulis muncul di browser, ya gunakan script/kode HTML”.

Saya kira pengenalan tentang apa itu HTML sudah cukup jelas dan selanjutnya mari kita mengenal kode HTML agar kita bisa faham lebih jauh lagi. Agar lebih enak belajarnya, serangkaian tutorial ini akan bersifat bersekinambungan dan diakhir kita akan membuat sebuah tampilan halaman website dengan menggunakan kode HTML.

Secara garis besar, dokumen HTML memuat kode sebagai berikut :

<html>

<head><title>Belajar HTML Yuk!</title> </head>

<body>

Hai.. Ini adalah contoh kode dokumen HTML

<body>

</html>

Untuk selanjutnya, penulisan konten dilakukan diantara tag body (<body> </body>). Untuk lebih memahami lagi mengenai HTML maka sebaiknya kita juga mengenal tag lainnya yang dikenali oleh HTML .

Pada pembahasan selanjutnya kita akan membuat sebuah layout halaman website menggunakan tag table (<table></table>).