Sebagai sebuah bahasa markup, HTML membutuhkan cara untuk memberitahu browser untuk apa fungsi sebuah text. Apakah text atau kode kode itu ditulis sebagai sebuah paragraf, list, atau sebagai link? Dalam dunia HTML, tanda atau kode kode ini dikenal dengan istilah tag. Sekilas mirip kan dengan kode kode cewe? Bedanya kode atau tag tag html ini bisa di artikan dan di cari, sedangkan yang sebelah enggak.
Hampir semua kode tag di dalam HTML itu punya pasangan loh, ada tag pembuka dan tag penutup. Dimana objek yang dikenai perintah tag berada di antara tag pembuka dan tag penutup ini. Objek disini dapat berupa text, gambar, maupun video. Penulisan tag berada di antara dua kurung siku ( < ) dan ( > ).
Sampai sini gimana bro sudah cukup jelaskan apa itu kode atau tag html?
Sekarang kita jabarkan lagi biar lebih simple lagi, biar semakin paham, ane lampirkan bagaimana cara melakukan penulisan tag HTML yang baik dan benar :
Dan sebagai contoh implementasinya, perhatikan kode HTML berikut :
Perhatikan :
Hasil dari tag html diatas akan terlihat di browser seperti :
tulisan ini akan tercetak tebal atau bold
Ane rasa sudah sangat jelas yah bro bagaimana cara menggunakan kode kode html atau tag html. Jika belum jelas, silahkan baca dengan perlahan.
Setelah mengerti bagaimana cara menggunakan tag, dan mengenal tag pembuka dan tag penutup pada html, kita akan membahas bagaimana cara menggunakan dua tag html dalam satu paragraf atau dalam satu bagian atau umum dikatakan sebagai Element dalam HTML
Cara Penulisan nya :
Diatas dijabarkan bahwa <tag pembuka 1> adalah element yang didalamnya terkandung tag tag html lainnya, dalam kasus diatas adalah <tag pembuka 2>
Jika masih bingung, langsung saja kita implementasikan penulisan element dalam html
Tag Tag HTML yang akan di gunakan
<p>....</p> = Tag membuat Paragraf
<b>....</b> = Tag membuat huruf menjadi bold
<i>.... </i> = Tag membuat huruf menjadi miring atau italic
Kita akan membuat suatu text dalam sebuah paragraf yang di dalam tersebut terdapat tulisan tebal atau miring, di dalam bahasa HTML dapat ditulis sebagai berikut:
Tag <p>..</p> adalah paragraf dan merupakan element, oleh karena itu terdapat di awal bagian dan akhir bagian paragraf, sedangkan tag <b>..</b> dan tag <i>..</i> hanya di tulis pada bagian bagian tertentu yang ingin terlihat dalam tulisan tebal atau miring atau terlihat tebal dan miring karena itu merupakan isi dari bagian element
Berikut hasil dari tag HTML diatas, tag diatas akan terlihat seperti :
Pada suatu hari ada nenek nenek yang menikahi seorang pria muda, dikarenakan si nenek nenek tersebut kasihan dengan seorang pemuda yang di bully karena belum menikah
Diatas adalah sebagian contoh tag tag yang memiliki pasangan, ada juga sebagian tag tag html yang jomblo atau sendiri dan tidak memiliki pasangan artinya tidak membutuhkan tag penutup. Seperti :
tag <br /> untuk break (pindah baris atau enter dalam ms. word),
tag <hr /> untuk horizontal line (garis horizontal).
Dan masih banyak ada sebagain tag lainnya.
Karena memang Tag ini jomblo atau dikenal dalam dunia it sebagai self closing tag atau void tag, untuk penulisannya adalah <br />. Perhatikan pada bagian akhir tag ada forward slash atau garis miring ( / ) sebelum tanda ( > ). Jadi penulisan pada tag tag jomblo seperti hr adalah <hr /> dan berlaku untuk tag tag jomblo atau tag self closing
Contoh implementasinya dalam bahasa html :
Mau lihat hasilnya? Silahkan coba dan praktekan sendiri lalu lihat hasilnya, kalo di coba akan semakin terasa mudah dan semakin mudah.
Untuk melakukan testnya kode tersebut di tulis pada bagian body, jika memang masih bingung, bisa dicoba untuk membaca artikel Bagaikan Malam Pertama, Ini dia latihan paling dasar dalam HTML
Sebagai catatan :
HTML tidak termasuk case-sensitif, artinya, penulisan tag <p> dianggap sama dengan tag <P>. Pada awal kemunculan HTML, programmer web umumnya menggunakan huruf besar untuk seluruh tag agar membedakan dengan text yang berupa isi dari web. Namun varian HTML, xHTML mewajibkan huruf kecil untuk semua tag.
Dalam HTML5, aturan ini kembali tidak diharuskan. Akan tetapi kebiasaan web programmer saat ini adalah menggunakan huruf kecil untuk seluruh tag.
Untuk kamus, bisa di download nih kumpulan kumpulan tag tag html, versi ini masih jauh dari kata lengkap tapi lumayan lah buat belajar, untuk yang full masih ane buat. Jadi sabar yah mbloo.....
Download kumpulan Tag Tag HTML ( google drive )
Hampir semua kode tag di dalam HTML itu punya pasangan loh, ada tag pembuka dan tag penutup. Dimana objek yang dikenai perintah tag berada di antara tag pembuka dan tag penutup ini. Objek disini dapat berupa text, gambar, maupun video. Penulisan tag berada di antara dua kurung siku ( < ) dan ( > ).
Sampai sini gimana bro sudah cukup jelaskan apa itu kode atau tag html?
Sekarang kita jabarkan lagi biar lebih simple lagi, biar semakin paham, ane lampirkan bagaimana cara melakukan penulisan tag HTML yang baik dan benar :
<tag_pembuka>objek yang akan atau dikenai perintah tag</tag_penutup>
Dan sebagai contoh implementasinya, perhatikan kode HTML berikut :
<b> tulisan ini akan tercetak tebal atau bold </b>
- <b> ini adalah tag pembuka, dalam contoh ini <b> adalah tag untuk membuat tulisan menjadi tebal atau bold.
- </b> adalah tag penutup bold. Perhatikan tanda tag penutup </b> dengan tanda tag pembuka <b>, mereka terlihat sama namun memiliki perbedaan. Perhatikan perbedaan pada tag tersebut, perbedaannya terletak pada tanda forward slash atau garis miring ( / )
Hasil dari tag html diatas akan terlihat di browser seperti :
tulisan ini akan tercetak tebal atau bold
Ane rasa sudah sangat jelas yah bro bagaimana cara menggunakan kode kode html atau tag html. Jika belum jelas, silahkan baca dengan perlahan.
Setelah mengerti bagaimana cara menggunakan tag, dan mengenal tag pembuka dan tag penutup pada html, kita akan membahas bagaimana cara menggunakan dua tag html dalam satu paragraf atau dalam satu bagian atau umum dikatakan sebagai Element dalam HTML
Cara Penulisan nya :
<tag pembuka 1> objek 1 <tag pembuka 2> objek 2 </tag penutup 2> </tag penutup 1>
Diatas dijabarkan bahwa <tag pembuka 1> adalah element yang didalamnya terkandung tag tag html lainnya, dalam kasus diatas adalah <tag pembuka 2>
Jika masih bingung, langsung saja kita implementasikan penulisan element dalam html
Tag Tag HTML yang akan di gunakan
<p>....</p> = Tag membuat Paragraf
<b>....</b> = Tag membuat huruf menjadi bold
<i>.... </i> = Tag membuat huruf menjadi miring atau italic
Kita akan membuat suatu text dalam sebuah paragraf yang di dalam tersebut terdapat tulisan tebal atau miring, di dalam bahasa HTML dapat ditulis sebagai berikut:
<p>Pada suatu hari ada <b>nenek nenek</b> yang menikahi seorang <i>pria muda</i>, dikarenakan si nenek nenek tersebut kasihan dengan seorang pemuda yang di bully <b><i>karena belum menikah</i></b></p>
Tag <p>..</p> adalah paragraf dan merupakan element, oleh karena itu terdapat di awal bagian dan akhir bagian paragraf, sedangkan tag <b>..</b> dan tag <i>..</i> hanya di tulis pada bagian bagian tertentu yang ingin terlihat dalam tulisan tebal atau miring atau terlihat tebal dan miring karena itu merupakan isi dari bagian element
Berikut hasil dari tag HTML diatas, tag diatas akan terlihat seperti :
Pada suatu hari ada nenek nenek yang menikahi seorang pria muda, dikarenakan si nenek nenek tersebut kasihan dengan seorang pemuda yang di bully karena belum menikah
Diatas adalah sebagian contoh tag tag yang memiliki pasangan, ada juga sebagian tag tag html yang jomblo atau sendiri dan tidak memiliki pasangan artinya tidak membutuhkan tag penutup. Seperti :
tag <br /> untuk break (pindah baris atau enter dalam ms. word),
tag <hr /> untuk horizontal line (garis horizontal).
Dan masih banyak ada sebagain tag lainnya.
Karena memang Tag ini jomblo atau dikenal dalam dunia it sebagai self closing tag atau void tag, untuk penulisannya adalah <br />. Perhatikan pada bagian akhir tag ada forward slash atau garis miring ( / ) sebelum tanda ( > ). Jadi penulisan pada tag tag jomblo seperti hr adalah <hr /> dan berlaku untuk tag tag jomblo atau tag self closing
Contoh implementasinya dalam bahasa html :
<p>aku kangen kamu <br />
Tapi kamu enggak.<br />
Cukup tau aja!!<br/>
<hr />
</p>
Mau lihat hasilnya? Silahkan coba dan praktekan sendiri lalu lihat hasilnya, kalo di coba akan semakin terasa mudah dan semakin mudah.
Untuk melakukan testnya kode tersebut di tulis pada bagian body, jika memang masih bingung, bisa dicoba untuk membaca artikel Bagaikan Malam Pertama, Ini dia latihan paling dasar dalam HTML
Sebagai catatan :
HTML tidak termasuk case-sensitif, artinya, penulisan tag <p> dianggap sama dengan tag <P>. Pada awal kemunculan HTML, programmer web umumnya menggunakan huruf besar untuk seluruh tag agar membedakan dengan text yang berupa isi dari web. Namun varian HTML, xHTML mewajibkan huruf kecil untuk semua tag.
Dalam HTML5, aturan ini kembali tidak diharuskan. Akan tetapi kebiasaan web programmer saat ini adalah menggunakan huruf kecil untuk seluruh tag.
Untuk kamus, bisa di download nih kumpulan kumpulan tag tag html, versi ini masih jauh dari kata lengkap tapi lumayan lah buat belajar, untuk yang full masih ane buat. Jadi sabar yah mbloo.....
Download kumpulan Tag Tag HTML ( google drive )
Tidak ada komentar:
Posting Komentar