Panduan Pemula untuk Memahami Web Design
Dalam satu bagian dari seri ini, saya akan membahas komponen dasar yang terdiri dari sebuah situs web. Karena seri ini ditujukan untuk mereka yang mungkin tidak terbiasa dengan desain web dan struktur website, mereka yang akrab dengan konsep-konsep ini kemungkinan akan menemukan informasi ini biasa atau bahkan SD.
Namun, dalam beberapa tahun pengalaman saya menginstruksikan klien
belum tahu, menjadi sangat jelas bahwa persentase macam orang memiliki
pemahaman yang sangat sedikit bahkan blok bangunan yang paling dasar dan
fundamental dari struktur situs web dan desain. Saya berharap untuk mengubah bahwa tren dengan seri ini.
Apa yang Membuat Website Website?
Semua situs web yang dibangun di atas bahasa mark-up yang disebut HTML (HyperText Mark-up Language).
Bahasa ini ditafsirkan oleh browser-misalnya Microsoft Internet
Explorer, Mozilla Firefox, Google Chrome, dll-yang kemudian ditampilkan
sebagai halaman web. HTML menggunakan benda-benda yang disebut tag untuk menginformasikan browser apa setiap bagian dari halaman diwakilinya. Tag ini pada dasarnya label ditutupi dalam kurung sudut. Sebagai contoh, berikut ini adalah mark-up untuk halaman web yang sangat sederhana dengan konten dasar: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Page Title</title> </head> <body> <h1>Document Title</h1> <p>This is the first sentence of the document.</p> </body> </html> Pergi bagian demi bagian di atas halaman web contoh, kita akan mulai dengan baris pertama. The <! DOCTYPE html> tag adalah tag khusus yang harus datang sebelum semua lainnya mark-up pada halaman.
Tag ini memberitahu browser apa jenis dokumen yang disajikan untuk itu,
dan dalam hal ini tag adalah standar HTML5 deklarasi, sehingga halaman
web memberitahu browser bahwa semua berikut mark-up harus diberikan
(lihat: ditampilkan) menggunakan aturan HTML5. (Pada cepat samping, HTML telah melalui beberapa kali revisi, dengan HTML5 menjadi versi saat ini.) Tag berikutnya adalah tag <html>, yang hanya memberitahu browser dokumen ini adalah dokumen HTML.
Anda akan melihat tag ini dan kebanyakan orang lain pada halaman
memiliki tag penutup yang menyertainya, dalam hal ini </ html>
tag.
Kebanyakan tag HTML ditetapkan sebagai pasangan, dengan kedua tag mulai
untuk memulai bagian dan tag penutup untuk mengakhiri bagian nya. Beberapa tag yang dikenal sebagai elemen kosong, berarti mereka mandiri. Tag ini hanya memiliki tag awal, dan kemudian "close" sendiri dengan garis miring. Tag berikutnya adalah tag <head>, yang menginformasikan browser ini adalah bagian judul dokumen. Bagian ini berisi <meta charset="utf-8" tag />, yang dapat Anda lihat adalah elemen kosong. Tag <meta> ini mendefinisikan set karakter di mana halaman dikodekan. Pengkodean karakter cukup teknis dan melampaui lingkup seri ini. Jangan ragu untuk membaca artikel Wikipedia pada UTF-8 encoding jika Anda ingin mempelajari lebih lanjut. Tag lain dalam bagian judul adalah tag <title>. Tag ini mendefinisikan judul dokumen, yang akan ditampilkan dalam judul bar dari browser ketika halaman yang diakses.
Selain tag <title>, sebagian besar informasi yang dimasukkan ke
bagian judul halaman web tidak ditampilkan secara visual pada halaman
Web.
Bagian ini sebagian besar digunakan untuk menentukan berbagai parameter
halaman dan juga termasuk link ke setiap CSS menyertai (Cascading Style
Sheets) dan file Javascript. Kami akan pergi ke ini jenis file lainnya dalam entri masa depan seri ini. Bagian berikutnya adalah bagian tubuh, yang ditunjuk oleh tag body. Bagian ini berisi semua konten utama halaman. Tag pertama dalam bagian ini adalah tag h1, yang merupakan singkatan dari "Heading 1". Dalam HTML, enam tingkat dari pos didefinisikan, dengan level 1 sebagai tertinggi dalam hirarki penting. Tag berikutnya adalah tag <p>, yang mendefinisikan sebuah paragraf standar.
Ada banyak tag lain untuk menentukan konten seperti diperintahkan
(<ol>) dan unordered (<ul>) daftar (juga dikenal sebagai
nomor dan daftar bullet, masing-masing), jeda baris (<br />),
blockquotes (<blockquote >), dll Berikut adalah bagaimana halaman halaman dasar kita terlihat bila dilihat dengan browser Firefox: Tag akhir menutup setiap bagian yang tepat. Meskipun ini adalah halaman web yang sangat sederhana, ini pada dasarnya adalah bagaimana semua halaman web yang dibangun.
Sebagian besar halaman web juga menggunakan styling melalui CSS serta
Javascript untuk setiap interaksi yang dinamis, namun diskusi yang akan
harus menunggu sampai artikel selanjutnya.
Looking Forward
Dalam artikel berikutnya, saya akan memberikan detail tentang apa CSS
bersama dengan cara Javascript dapat digunakan untuk menambah interaksi
dinamis untuk sebuah website.
terima kasi banyak ya min. artikel ini sangat berguna dan berfungsi bagi orang orang yang belum mengerti seperti saya , teruslah berkarya ya min ^^ semoga anda sukses dan sehat selalu ya min
BalasHapusjangan lupa juga kunjungi website saya di :
bandarq terpercaya
terima kasih salam hormat