MACAM-MACAM TAG HTML DASAR SERTA FUNGSINYA DALAM WEBSITE
Kita analogikan halaman website itu adalah sebuah majalah atau koran,didalamnya tentu ada judul, paragraf juga terdapat gambar,nah fungsi dari HTML adalah mengelompokkan atau memilah antara judul,paragraf atau kolom kemudian menampilkannya dalam halaman browser.
Banyak yang salah paham bahwa HTML adalah bahasa pemrograman,tapi secara spesifik HTML bukanlah sebuah bahasa pemrograman dimana didalamnya tidak memiliki fungsi logika seperti bahasa pemrograman yang lain dalam menjalankan setiap perintahnya.
Sesuai namanya Hyper Text Mark Up Language, kata markup disini dapat diartikan sebagai si pemberi identitas apakah tag yang dibuat termasuk golongan judul,paragraf atau yang lainnya.
HTML memiliki peranan penting,dapat dikatakan sebagai pondasi dalam struktur sebuah website,walaupun demikian bahasa html masih bersifat statis atau dalam artian kita hanya bisa menggunakan html ini pada browser milik kita sendiri,agar html bersifat dinamis dan mempunyai tampilan yang atraktif maka perlu berkolaborasi dengan bahasa pemrograman lain seperti css sebagai bahasa yang memperindah tampilan website,javascript agar website bisa lebih dinamis,serta PHP agar bisa terkoneksi ke server dan bisa terhubung ke jaringan internet.
Struktur HTML
<html>
<head>
<title>Tutorial HTML</title>
</head>
<body>
<h1>ini heading</h1>
<p>ini paragraf</p>
</html>
Penjelasan dari kode html diatas adalah
- <!DOCTYPE html> ini adalah tag untuk memberitahu browser atau mendeklarasikan bahwa dokumen html yang dipakai adalah seri html5 yang menjadi standar html untuk browser saat ini,tag ini wajib ada di setiap dokumen html dan tidak perlu menggunakan tag penutup
- <html> tag ini sebagai identifikasi untuk browser bahwa dokumen yang dibuka adalah html
- <title>TUTORIAL HTML</title> tag untuk menempatkan title saat browser membuka tag html
- <head> tag untuk menempatkan metadata dari sebuah dokumen html,tag ini jug sebagai pembungkus tag <body>
- <body> tag dimana seluruh informasi yang terdapat dalam dokumen html ditampilkan atau dibilang tag ini adalah yang berperan untuk semua tampilan pada layar website semua ditampung atau dibungkus oleh tag ini
- <h1> tag untuk menempatkan judul atau header dengan ukuran terbesar yaitu h1
- <p> tag untuk mendefinisikan artikel
tag <h> dalam sebuah dokumen html mempunyai 6 varian yaitu tag <h1>,<h2>,<h3>,<h4>,<h5> dan <h6> semakin besar nilai tag <h> maka ukuran font akan semakin kecil,disarankan dalam sebuah dokumen html sebaiknya hanya mempunyai satu tag <h1> di dalamnya sedagkan untuk tag <h> lainnya boleh memakai lebih banyak
sedangkan tag <p> yang mendeklarasikan sebuah paragraf untuk membuat baris baru maka digunakan tag tambahan yaitu tag <br> atau break tanpa adanya tag ini maka paragraf akan terus menjadi satu line dan tidak membentuk baris baru dibawahnya.
kita juga bisa memberi atau menambah atribut lain pada sebuah tag untuk membuat variasi dalam tag tersebut,misalnya kita ingin membuat paragraf dan heading menjadi rata tengah dan berwarna biru serta fontnya menjadi italic maka formatnya akan menjadi seperti ini
<html>
<head>
<title>Tutorial HTML</title>
</head>
<body>
<h1 align = "center">INI HEADING</h1>
<p align = "center" style="color:blue"><i>ini paragraf tentang pengertian </br> struktur bahasa HTML<i></p>
</html>
penjelasan dari html diatas adalah saya menambahkan atribut baru pada <h1> berupa perintah align="center" yang akan menjadikan header tersebut menjadi rata tengah
sedangkan pada paragraf saya memberikan dua atribut yaitu align="center" untuk membuat paragraf tersebut menjadi rata tengah dan atribut style untuk memberikan gaya pada paragraf tersebut, tag <style> disini disebut sebagai atribut sedangkan "color" bertugas sebagai pendeklarasi dari nilai "blue" dan saya selipkan tag tambahan yaitu tag <i> sehingga hasil akhir dari perintah tersebut akan membuat paragraf menjadi rata tengah dengan huruf miring dan berwana biru
jika dibuka pada tab browser kode html tersebut akan menjadi seperti dibawah ini
TAG HTML DASAR
|
|
Tag
|
penjelasan
|
<!DOCTYPE>
|
Mendefinisikan jenis dokumen
html yang dipakai
|
<html>
|
Mendefinisikan jenis dokumen
|
<head>
|
Mendefinisikan informasi
mengenai dokumen
|
<title>
|
Mendefinisikan judul dokumen
|
<body>
|
Mendefinisikan dokumen
tentang apa yang terlihat pada browser
|
<h1> to <h6>
|
Mendefinisikan hading pada
dokumen
|
<p>
|
Mendefinisikan paragraf
|
<br>
|
Memberi garis baru pada
paragraf
|
<hr>
|
Mendefinisikan perubahan
thematic pada isi konten
|
<!--...-->
|
Mendefinisikan komen untuk
mempermudahkan dalam menganalisa dokumen html
|
|
TAG |
PENJELASAN |
|
<acronym> |
Tidak didukung lagi di HTML5.untuk saat ini menggunakan <abbr> untuk mendefinisikan akronim |
|
<abbr> |
Untuk mendefinisikan akronim pada html5 |
|
<address> |
Mendefinisikan informasi dari autor/pembuat artikel |
|
<b> |
Mendefinisikan huruf tebal |
|
<bdi> |
Mengisolasi bagian teks yang mungkin formatnya berbeda dari format luarnya |
|
<bdo> |
Merubah arah teks |
|
<big> |
Tidak didukung lagi di html5,sekarang menggunakan css,untuk mendefinisikan teks besar |
|
<blockquote> |
Mendefinisikan sesi yang kuota teksnya berasal dari sumber |
|
<center> |
Tidak didukung di html 5,gunakan css |
|
<cite> |
Mendefinisikan judul dari artikel |
|
<code> |
Mendefinisikan bagian dari kode komputer |
|
<del> |
Mendefinisikan teks telah dihapus dari dokumen |
|
<dfn> |
Represents the defining instance of a term |
|
<em> |
Mendefinisikan teks empasis |
|
<font> |
Mendefinisikan huruf,warna,ukuran dan
teks |
|
<i> |
Mendefinisikan teks miring |
|
<ins> |
Mendefinisikan teks telah disisipkan pada dokumen |
|
<kbd> |
Mendefinisikan masukan keyboard |
|
<mark> |
Mendifinisikan teks yang telah di markup( stabilo) |
|
<meter> |
Mendefinisikan pengukuran pada dokumen dengan jarak yang dijangkau |
|
<pre> |
Mendefinisikan pra-format teks |
|
<progress> |
Menampilkan progress dari suatu tugas |
|
<q> |
Mendefinisikan kuota pendek |
|
<rp> |
Mendefinisikan apa yang terlihat di browser tapi tidak didukung ruby |
|
<rt> |
Mendefinisikan atau penjelasan pengejaan (untuk tipografi asia timur) |
|
<ruby> |
Mendefinisikan Ruby (untuk tipografi asia timur) |
|
<s> |
Mendefinisikan bahwa teks tidak lagi benar |
|
<samp> |
Mendifinisikan keluaran sampel dari program komputer |
|
<small> |
Mendefinisikan teks yang paling kecil |
|
<strike> |
Mendefinisikan teks yang mempunyai garis di tengahnya |
|
<strong> |
Mendefinisikan teks penting |
|
<sub> |
Mendefinisikan teks diatas teks |
|
<sup> |
Mendefinisikan teks di bawah teks |
|
<template> |
Mendefinisikan template |
|
<time> |
Mendefinisikan hari/tanggal |
|
<tt> |
Tidak didukung di html 5 Mendefinisikan typetele teks |
|
<u> |
Medifinisikan bahwa teks harus statis berebda dari teks normal |
|
<var> |
Mendefinisikan variabel |
|
<wbr> |
Mendefinisikan kemungkinan garis baru |
Posting Komentar untuk "MACAM-MACAM TAG HTML DASAR SERTA FUNGSINYA DALAM WEBSITE"