Jenis-Jenis Layout

hai teman teman :) kali ini saya akan memberitahukan jenis jenis layout beserta contohnya. sebelumnya, apakah kalian tau layout itu apa?Layout situs merupakan tata letak elemen halaman situs web.Layout situs yang baik akan menjadikan halaman web web baik juga. nah sekarang kalian tau kan apa itu layout.. nah sekarang saya akan menyebutkan model layout yang biasa digunakan dalam mendesain suatu halaman web, diantaranya adalah

1. Top index
     top index digunakan untuk menampilkan link yang banyak ke situs lain, seperti search engine . dibawah ini merupakan tata letak elemen layout top index

gambar 1.1 tata letak elemen top inndex

nah kalian sudah tau kan seperti apa tata letak elemen layout top index. nah dibawah ini saya akan memberikan contoh coding beserta hasilnya tentang layout top index

gambar 1.2 contoh coding layout top index

gambar 1.2 contoh coding layout top index

nah dibawah ini adalah hasil tampilan dari coding diatas 

gambar 1.3 hasil tampilan layout top index

2. Bottom Index

    bottom index Biasanya digunakan apabila isi dari halaman banyak berhubungan dengan topik tunggal . dibawah ini adalah tata letak dari layout bottom index

nah sekarang kalian tau kan bagaimana tata letak layout bottom index. dibawah ini merupakan contoh coding untuk layout bottom index

gambar 1.2 dan 1.3 contoh coding layout bottom index

nah dibawah ini adalah hasil dari coding diatas

3. Left Index
    Left index  Digunakan untuk layar dengan resolusi yang lebar sehingga mudah dalam penyediaan navigasi, tanpa menimbulkan kekacauan penyajian pada halaman utama. dibawah ini adalah model layout left index.

nah kalian sudah tau kan tata letak elemen layout left index, dibawah ini adalah contoh coding untuk layout left index

dibawah ini adalah hasil tampilan dari coding diatas

4. `Layout Split
     Layout split  Merupakan model yang banyak dipakai, karena terjaga keseimbangan dalam halaman web . dibawah ini adah tata letak elemen layout split.

dibawah ini adalah contoh coding layout split

Dibawah ini merupakan hasil tampilan dari coding diatas

5,  Alternating Index
     Alternating index  digunakan untuk halaman yang banyak menampilkan grafik, foto dan produk yang disertai dengan teks berupa keterangan, harga, jumlah, dan lain - lain.
     dibawah ini merupakan tata letak elemn layout alternating index

nah kalian sudah tau kan seperti apa tata letak elemen layout alternating index. dibawah ini adalah contoh coding untuk membuat layout alternating index

nah dibawah ini adalah hasil tampilan dari coding diatas