Rindi Putra
- HTML Tutorial 1
- HTML Tutorial 2
Well,, pada bahasan sebelumnya kita telah membuat dokumen sederhana dari HTML. Beberapa tags yang ada di dokumen tersebut juga sering dipakai pada dokumen itu. Mari kita beranjak ke gambar selanjutnya. Berikut adalah beberapa tag yang sering muncul pada dokumen HTML.
Struktur Tag
Struktur utama pada sebuah dokumen HTML adalah <html>, <head>, dan <body>. Setiap dokumen HTML pasti terdapat tag-tag itu. Title tag <title> juga sangat penting pada sebuah dokumen HTML. Selain dari pada tag ini ada beberapa tag juga yang sangat umum bagi setiap dokumen HTML. Berikut penjelasannya:
Anchors<a href><a/a>
Tag ini dipakai untuk membuat sebuah tautan(link) pada kata atau kalimat di dalam sebuah halaman. Contohnya seperti ini: <a href=https://www.rinditech.com/> Teknologi Internet<a/>. Pada browser hanya akan muncuk kata Teknologi Internet dengan menyembunyikan link yang kita maksudkan. Ketika ada yang melakukan klik pada kata Teknologi Internet maka akan langsung membuka halaman rinditech.com dari halaman tersebut.
Fungsi tag ini sangat berpengaruh terhadap tampilan halaman kita atau bila kita sedang memebuat beberapa paragraph akan lebih rapi bila kita menggunakan fungsi anchor ini. Karena bila kita ingin memberikan sebuah link tidak harus menampilkan link yang sebenarnya apalagi bila link tersebut sangat panjang, tetapi bila menggunakan fungsi anchor ini kita hanya perlu menggunakan kata seperti “klik disini” atau “ini” dengan mengisi tautan yang kita maksud pada kata2 tersebut.
Paragraf <p>
Tag ini digunakan untuk membuat sebuah paragraph baru. Tag ini tidak mempunyai tag penutup </>! Kita hanya perlu menempatkan tag <p> saja ketika ingin membuat paragraf baru.
Line Break <br>
Tag ini digunakan untuk membuat baris baru. Fungsi ini sama seperti melakukan Enter pada Ms. Word atau notepad. Tag ini juga TIDAK mempunyai tag penutup ya!. Kita hanya perlun menuliskan <br> sebelum baris baru yang kita inginkan.
Bold <b> </b>
Untuk membuat tulisan tebal. Contoh <b>tebal</b>. hasilnya tebal.
Italic<i> </i>
Untuk membuat tulisan miring. Contoh<i>miring</i>. Hasilnya miring.
Underline<u> </u>
Untuk membuat garis bawah pada tulisan. Contoh<u> garis bawah</u>. Hasilnya garis bawah.
Heading
Tag dimulai dengan salah satu dari ini: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Diakhiri dengan </h1>, </h2>, </h3>, </h4>, </h5>, </h6>. Tag ini biasanya digunakan untuk mempertegas judul pada sebuah dokumen.contohnya <h1> digunakan untuk judul pada header dengan tulisan yang besar - besar
Contohnya: <h1>Rindi Tech</h1> akan muncul kata2 Rindi Tech dengan tulisan yang cukup besar lalu setelahnya kita masukan <h2>Kumpulan Tutorial dan Informasi Seputar Teknologi</h2> akan muncul kata2 Kumpulan Tutorial dan Informasi Seputar Teknologi dengan ukuran huruf yang besar pula tetapi tidak lebih besar dari tag <h1>.
Dengan kata lain semakin besar nilai h1,2,3,4,5 maka semakin kecil ukuran huruf yang akan ditampilkan.
Image <img>
Tag <img> digunakan untuk menyisipkan gambar ke dalam dokumen HTML. Tag ini adalah tag kosong, yang berarti bahwa tidak perlu menggunakan tag penutup. Sebaliknya, tag ini memiliki atribut yang memberikan informasi tentang gambar yang disisipkan, seperti sumber file, teks alternatif, lebar, dan tinggi.
Berikut adalah contoh penggunaan tag <img>:
<img src="contoh.jpg" alt="Contoh gambar" width="500" height="300">
Pada contoh di atas, kita menyisipkan sebuah gambar dengan nama file "contoh.jpg". Atribut src digunakan untuk menentukan jalur file atau URL gambar. Atribut alt digunakan untuk memberikan teks alternatif yang akan ditampilkan jika gambar tidak dapat dimuat atau tidak dapat diakses. Atribut width dan height bersifat opsional dan digunakan untuk menentukan ukuran gambar dalam piksel.
Penting untuk menyertakan atribut alt ketika menggunakan tag <img>, karena ini memberikan informasi penting bagi pengguna yang mungkin tidak dapat melihat gambar. Misalnya, pengguna yang memiliki kebutuhan khusus seperti kebutaan atau gangguan penglihatan dapat menggunakan pembaca layar untuk membacakan teks alternatif, sehingga mereka dapat memahami konten gambar.
Belajar sedikit demi sedikit!
Kalem aja, Banyaknya variasi tag itu disediakan agar kita dapat mengembangkan ide kita pada sebuah halaman website dengan sebaik mungkin dan sesuai dengan keinginan kita. Kadang kan kita mempunyai bayangan yang sangat keren bila ingin membuat sebuah halaman website, tetapi pada penjabarannya di pengkodean (HTML) kita sering tidak tahu harus menggunakan tag yang seperti apa.
Nah untuk itu mungkin di blog ini kita bisa saling sharing tentang HTML walaupun hanya dasarnya saja, setidaknya kita memahami standarnya dan kita sama-sama belajar untuk menambah pengatahuan kita, syukur2 kita bisa memanfaatkannya bila ada masalah mendesak.
Standar HTML akan selalu berubah mengikuti perkembangan teknologi yang ada. Kadang beberapa browser dapat memunculkan dokumen dengan rapi meskipun ada beberapa data yang error pada HTML tersebut tapi, bukan menjadi alasan bagi kita untuk membuat dokumen asal-asalan ya, apapun yang kita buat pastikan itu sudah mengikuti aturan yang ada ya. Semoga bermanfaat.
