SampelKode - Hallo semuanya, kemarin saya sudah memposting mengenai Script Database menggunakan coding PHP, kali ini saya tidak akan membahas mengenai database lagi dan akan kembali mulai mempelajari HTML. Karena saya yakin pengunjung disini sebagian belum terlalu paham mengenai HTML.
Pada postingan Tutorial HTML kali ini saya akan memposting mengenai struktur penulisan HTML atau tata cara penulisan HTML. Seperti biasa pertama-tama anda harus menggunakan text editor untuk membuat sebuah halaman HTML.
Anda bebas menggunakan text editor yang seperti apa, bisa menggunakan sublime text 3, kodomo editor, notepad++, adobe dreamweaver dan lain-lain. Disini saya menggunakan text editor berupa sublime text 3.
Anda bisa mendownload sublime text 3 disini. Kalau pake aplikasi lainnya tidak apa-apa. Sebelumnya saya akan menjelaskan mengenai tag html.
Apa itu TAG HTML?
Tag html adalah script html yang akan memberikan informasi kepada web browser untuk menampilkan teks. Saat web browser menampilkan sebuah halaman web, web browser membaca halaman web tersebut dari sebuah file teks dan kemudian mencari kode-kode special (dalam hal ini adalah tag HTML).
Simbol Tag html sebagai berikut ini :
- "<" karakter tersebut di definisikan/diartikan sebagai tag pembuka.
- ">" karakter tersebut di definiskan/diartikan sebagai tag penutup.
- "/" karakter tersebut di definiskan/diartikan sebagai tag penutup dari tag pembuka.
Tag HTML sendiri memiliki aturan penulisan yang tepat, tag html harus di tulis dengan tag pembuka dan penutup, tanpa adanya tag pembuka atau penutup html tidak bisa dibaca oleh web browser.
Contoh penulisan Tag html sebagai berikut ini :
Benar
<html> </html> Penulisan seperti ini sudah benar
Salah
<html> <html> Penulisan seperti ini salah karena tidak ada tag "/" dibagian tag akhir html.
Penulisan seperti diatas berlaku pada tag lainnya seperti : <head> <style> <script> <body> <meta> <h1> <p> <article> <footer> dan lain-lain
Buatlah script seperti dibawah ini
Penulisan Struktur HTML
<!DOCTYPE html>
<html>
<head>
<title> Belajar HTML - Struktur Penulisan HTML </title>
</head>
<body>
<h1>Ini Adalah Header </h1>
<p> Ini Adalah Paragraf </p>
</body>
</html>
Simpan script tersebut dengan nama file "index.html" dan kemudian buka dengan browser google chrome atau mozilla firefox. Hasilnya akan jadi seperti dibawah ini.
Baiklah saya akan menjelaskan mengenai struktur penulisan HTML.
Penjelasan Singkat : <!DOCTYPE html> adalah tag yang menentukan ekstensi script tersebut, script ini tidak di tulis juga tidak masalah!! Namun tradisi kita harus menulis code tersebut.Struktur penulisan HTML harus ada 3 komponen yaitu :
- HTML
- HEAD
- BODY
Saya akan membahas ke 3 komponen tersebut secara singkat,padat dan jelas. Pokoknya yang mudah dipahami deh!!!HTMLBaiklah, jika kalian lihat coding di atas, kalian akan melihat kode setelah "<!DOCTYPE html>" adalah kode HTML. Mengapa harus ada html baru ada head?Penjelasannya seperti ini, tag html adalah tag untuk memulai sebuah dokumen html, tanpa adanya tag html ini tidak akan mungkin terjadinya web!! Mengapa hal ini bisa terjadi?Masalah utamanya adalah web browser tidak bisa menentukan apakah code tersebut html atau tidak, nah dengan adanya tag HTML tersebutlah web browser bisa mengenai code yang ditulis berupa script HTML.
TagHEADHead bahasa indonesianya adalah kepala, lalu apa yang diisikan oleh kepala? Ya sudah jelas adalah otaknya. Otak yang dimaksud disini ada script yang akan di tulis di bagian head. Biasanya script yang ditulis di bagian head ini tidak akan muncul di web browser karena bagian head ini cuma di tulis perintah-perintah saja.Tag yang di tulis di halaman head :
- <meta> <title> <style> <script> dan lain-lain
BODYBody bahasa indonesianya adalah badan, pasti taulah apa yang dilakukan badan? Badan di html ini adalah isi dari html itu sendiri. di dalam badan ini bisa di isi apa saja dan akan tampil di web browser.Tag yang di tulis di halaman body :
- <h1> <h2> <h3> <h4> <h5> <h6>
- <p> <marquee> <div> <article> dan lain-lain
Oke, saya yakin anda dapat mengerti tentang 3 komponen utama di html. Sebagai tambahan saya akan menjelaskan tag <title> yang terdapat di dalam tag <head>
TITLE
Tag <title> Title adalah istilah dalam bahasa inggris, jika diartikan title itu tulisan, maksud tulisan disini adalah tulisan yang akan ditampilkan di bar web browser. Untuk lebih jelasnya silahkan anda copy script html dibawah ini dan isi title tersebut.
<!DOCTYPE html>
<html>
<head>
<title> SampelKode </title>
</head>
<body>
<h1>Ini Adalah Header </h1>
<p> Ini Adalah Paragraf </p>
</body>
</html>
Hasilnya akan jadi seperti dibawah ini:
Oke, cukup sampai disini postingan Tutorial HTML - Struktur Penulisan HTML, saya harap dengan postingan singkat ini anda paham mengenai penulisan struktur HTML, jangan lupa membaca tutorial selanjutnya ya!!
Perkenalkan!! Nama saya Nilla Lukita sebagai author SampelKode, saya tinggal di kudus. Hobi saya adalah blogging, anime lovers dan gamers, ya meskipun saya sekarang ini masih menekuni dunia blogging dan anime lovers (No Wibu). Saya masih sekolah dan masih kelas 2 SMK jurusan TKJ, saya senang sekali kalau ada masalah mengenai coding, design dan hal yang berhubungan dengan website.
ConversionConversion EmoticonEmoticon