Okeh untuk persyaratannya udah jelas yah, harus ngerti materi html dan css dasar. Layout atau susunan kerangka website adalah salah satu unsur pembuatan web yang harus paling di perhatikan. terutama untuk lu pada yang ingin mengkhususkan diri di jadi bagian web designer. karena tampilan website akan menggambarkan tingkat profesional seseorang web designer. di curhatan gue kali ini, gue akan coba untuk membahas tentang Membuat Tampilan Layout Website Sederhana Dengan HTML dan CSS.
Tampilan layout yang akan kita buat di sini adalah tampilan yang paling sederhana. Jadi jangan berharap langsung mewah, karena artikel ini gue buat untuk temen temen yang baru belajar atau setidaknya yang selevel dengan gue, yakni newbie. oleh sebab itu teknik membuat tampilan website nya akan di bahas yang sangat dasar dulu. Dan buat yang udah ngerasa jago, tetep pada baca aje, siapa tau bisa jadi moderator dan mohon juga koreksinya kalo ada yang salah yah para master.
Membuat Tampilan Layout Website Sederhana Dengan HTML dan CSS
Jadi di sini gue mau jelasin tentang layout yang paling standar banget kayak muka lu pada. bisa teman-teman perhatikan susuan kerangka website sederhana seperti di gambar berikut :
Tuh gambar udah gue kasih nomor biar gampang lu liat dan gampang juga gue jelasin.
- Bagian Header
- Bagian Navigasi
- Bagian Side Bar
- Bagian Left Content
- Bagian Footer
Langkah Pertama
langkah pertama yang harus di lakuin itu membuat 2 halaman dasar, index.html dan style.css. setelah membuat ke dua file tersebut, simpan dalam satu folder yang sama, lalu selanjutnya kaitkan file style.css ke dalam file index.html
<html>
<head>
<title>Belajar Bareng IndoNgoding</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
</body>
</html>
nah script ini <link rel="stylesheet" type="text/css" href="style.css"> berfungsi mengaitkan file style.css ke dalam file html. fungsinya adalah agar halaman html dapat tersingkronisasi dan menggunakan kode-kode yang ditulis dalam file style.css, script ini di tulis di halaman index.html di dalam tag <head> sebelum tag </head>.
Langkah Kedua
Tidak ada komentar:
Posting Komentar