2012-08-28

Template : menata tampilan

Sebenarnya saya tidak bisa mengatakan tutorial sebelumnya jelas. Pada dasarnya style masing-masing orang berbeda. Cara sebelumnya buat beberapa orang kurang sesuai karena terlihat boros dan banyak sekali perulangan.

Padahal perulangan yang bagus adalah perulangan bagian yang minor bukan yang major. Dimaksud bagian yang major adalah bagian seperti body, header, mid, footer dan bagian dibawahnya.

Melihat dari artikel sebelumnya, kita melihat bahwa terjadi perulangan dibagian mainbody. Seharusnya mainbody hanya 1 bukan 3!!

Ada alasan sendiri kenapa bentuknya seperti sebelumnya (banyak div). Hal itu untuk mempermudah programer (dalam contoh ini CI) dalam membagi-bagi scriptnya dalam bentuk dan bagian yang terperinci.

Membangun template sederhana (DIV)

Sebelum masuk ke DIV, mari ingat pada script terdahulu
HEADER 
Menu Content web 
Footer 
disini kita melihat struktur dari DIV
apabila kita ingin membuat menjadi bentuk div, minimal yang akan kita buat seperti ini
<div class='mainbody'>
<div class='header'></div header>
</div>
<div class='mainbody'>
<div class='mid'>
<div class='midleft'></div><div class='midright'></div>
</div mid>
</div>
<div class='mainbody'>
<div class='footer'></div footer>
</div>
kira-kira hasilnya seperti dibawah:

Membangun template sederhana (table)

Di buku lama, untuk membuat sebuah template kita memulai dari table.Table adalah salah satu tag sederhana yang harus kita ketahui terlebih dahulu. Tetapi dalam prosesnya penggunaan table sangat tidak di anjurkan dalam membuat template.

Untuk mudahnya mari membuat template sederhana dengan script sebagai berikut:
<table width="100%" border="1" bgcolor="lightblue">
<tr><td colspan=2>HEADER&nbsp;</td></tr>
<tr><td width=30%>Menu&nbsp;</td><td width=70%>Content web&nbsp;</td></tr>
<tr><td colspan=2>Footer&nbsp;</td></tr>
</table>

Hasil:
HEADER 
Menu Content web 
Footer 

Bila diperhatikan, table di atas masih terdapat lowong di antara sisinya. Untuk menghilangkan kita dapat memanfaatkan cellspasing dan cellpadding

2012-08-27

Templat website dasar


tutorial sebenarnya adalah tutorial lama, karena sekarang model template lebih kepada bentuk yang lainnya. Tetapi semua itu tergantung kebutuhan dan keingian dari user. Terakhir nanti akan kujelaskan alternatif menu lainnya.

Membuat website dasar : Stuktur dan menu

Tanpa usah berpanjang lebar, saya akan jelaskan tentang bagaimana membuat struktur yang terbaik. Dalam membuat struktur website (HTML) kita dapat memakai apa yang kita kehendaki. Misalnya menaruh semuanya di halaman depan (root), termasuk gambar, js dan css. Tetapi cara ini tidak disarankan. Bila nantinya kamu bekerja dalam team, maka kamu akan kerepotan!!