Sebelum saya mendeskripsikan cara membuat design web tersebut saya akan memperkenalkan diri terlebih dahulu. Nama saya Rama Deyanto biasa disapa Rama, saya masih duduk di bangku SMK tepatnya di SMK Negeri 1 Kota Mojokerto, dan bidang keahlian yang saya tekuni adalah Teknik Komputer dan Jaringan(TKJ). Sudah lah basa-basinya langsung dimulai aja :)
1. Pertama adalah memilih software yang akan dipakai, bisa pakai notepad, notepad++, adobe dreamweaver, dll. Tapi kali ini saya memakai notepad saja.
2. Selanjutnya memasukkan tag dasar seperti: <html>....</html>, <head>....</head>, <title>....</title>, dan <body>....</body>.
3. Jika kita akan membuat sebuah tabel tentu saja wajib memakai tag: <table>....</table>, <caption>....</caption>, <tr>....</tr>, <td>....</td>, dan <th>....</th>. Agar lebih jelas saya akan menjelaskan fungsi dari tag-tag tersebut.
<table>....</table>: digunakan untuk membuat tabel dalam dokumen HTML.
<caption>....</caption>: digunakan untuk memberi judul yang terletak di luar tabel biasanya dibagian atas/bawah tabel.
<tr>....</tr>: baris pada tabel.
<td>....</td>: kolom pada tabel.
<th>....</th>: tabel header atau judul tabel, diletakkan di bagian paling atas atau paling kiri dari tabel.
4. Berkreasilah dangan menuliskan sesuatu didalam tabel tersebut. Ada juga elemen-elemen yang dapat ditambahkan dalam tabel, berikut ringkasannya:
...border...: untuk menentukan tebal garis batas tepi tabel.
...cellspacing...: untuk menentukan jumlah spasi diantara tiap-tiap sel.
...cellpadding...: untuk menentukan jumlah spasi antara data dalam suatu sel.
...width...: untuk mengatur lebar tabel.
...align...: untuk perataan tabel secara horizontal.
...valign...: untuk perataan tabel secara vertikal.
...bgcolor...: warna latar dari tabel atau pada sel.
...rowspan...: menggabungkan beberapa baris tabel.
...colspan...: menggabungkan beberapa kolom tabel.
5. Bila ingin menyimpan tulis nama file pada bagian belakang .html, contoh: Tabel Sederhana.html
7. Coba dibuka file htmlnya untuk melihat hasil dari design kalian.
8. Ini adalah contoh design punya saya, ma'af kalo jelek :D
http://youtu.be/-hvCIX6775o
semoga postingan diatas membantu kalian semua. :)
Tidak ada komentar:
Posting Komentar