Belajar HTML: Pengertian, Fungsi dan Cara Kerja HTML

Belajar HTML: Pengertian, Fungsi dan Cara Kerja HTML campaign-unlimited

Belajar HTML merupakan hal yang penting jika kamu bercita-cita menjadi web developer handal. 

Dengan belajar HTML dengan baik, kamu bisa membuat websitemu agar dapat berinteraksi secara aktif dengan pengunjung website seperti plugin live chat yang bisa menjadi kamu coba.

Untuk mempelajari lebih lengkapnya, simak pada pembahasan berikut ini.

Apa itu HTML?

apa-itu-html

Hypertext Markup Language atau HTML adalah bahasa markup yang berfungsi dalam membuat struktur halaman yang ada pada website. 

HTML terdiri dari serangkaian gabungan teks dan simbol yang disimpan pada sebuah file. Untuk membuat file HTML, kamu perlu mengikuti format khusus atau standar. Format tersebut telah terlampir sebagaimana pada standar kode internasional atau ASCII (American Standard Code for Information Interchange). 

Dengan adanya HTML, maka pengguna bisa membuat atau menyusun heading, paragraf, gambar, link, dan lainnya agar dapat dilihat banyak orang dari halaman website. 

Untuk bisa diakses secara umum, maka pengguna dapat membukanya melalui aplikasi browser, seperti Internet Explorer, Chrome, atau Mozilla Firefox. 

Setelah mengetahui pengertian HTML di atas, mari kita belajar bagaimana sejarah lahirnya HTML hingga saat ini yang terlampir sebagai berikut ini.

Sejarah HTML

sejarah-html

Tim Berners-Lee merupakan sosok ilmuwan yang menjadi pencetus lahirnya HTML. Di tahun 1991, ia awalnya menciptakan HTML yang digunakan sebagai solusi untuk memberikan kemudahan bagi para ilmuwan saat mengakses dokumen satu sama lain. 

Selang setahun kemudian, HTML dapat digunakan untuk khalayak umum. Sejarah penggunaan HTML secara umum ini pun tidak bisa lepas dari peran dari World Wide Web atau yang sudah biasa dikenal dengan WWW. Keduanya saling bekerja sama agar informasi yang ingin disebarkan dapat diakses oleh banyak orang. 

Tak disangka, kini HTML telah berubah menjadi bahasa markup yang sudah digunakan oleh lebih dari 92,3% persen website yang ada di dunia.

Selama perjalanannya, HTML telah mengalami perkembangan yang cukup pesat. 

Pada tahun 1991 merupakan versi HTML1 yang dimana menerangkan perkembangannya dalam mempermudah ilmuwan dalam mengakses dokumen yang terdapat pada komputer.

Pada tahun 1995 merupakan versi HTML2 yang menerangkan perkembangan HTML yang mampu menampilkan data dan form yang bisa diedit secara langsung. Versi ini merupakan cikal bakal lahirnya website yang interaktif.

Pada tahun 1997 merupakan versi HTML3 yang menerangkan perkembangan HTML yang menambahkan fitur figure dalam penggunaannya sebagai pendukung tampilan gambar.

Pada tahun 1998 sampai 1999 merupakan versi HTML4.0 yang menerangkan perkembangannya dalam menyediakan perintah dasar HTML, yaitu image, tabel, text, link, dan form.

Pada tahun 1999 sampai 2000 merupakan versi HTML4.1. Yang menerangkan telah dipublikasi secara internasional dan bisa diakses melalui browser apapun.

Pada tahun 2014 merupakan versi HTML5 yang menerangkan perkembangannnya dalam membuat prosedur tampilan dengan mensinergikan antara CSS, HTML, dan Javascript. Versi ini menjadi versi terbaik HTML karena dinilai telah lengkap dengan fitur canggih, seperti embed video dan audio.

Sampai artikel ini ditulis, HTML5 ini menjadi versi yang terupdate dengan sistem yang tercanggih. Popularitas HTML versi terbaru ini pun sangat pesat. Bahkan, saat ini sudah ada sekitar 87,4 persen website yang sudah menggunakan HTML5. 

Belajar HTML pada Tag HTML, Elemen, dan Atribut

belajar-html-pada-tag-html-elemen-dan-atribut

Setelah mengetahui bagaimana sejarah dari HTML, sekarang kamu dapat belajar HTML pada komponen-komponen yang terdapat pada HTML. 

Secara umumnya, HTML terdiri dari Tag, Elemen, dan Atribut dengan detail penjelasan sebagai berikut :

1. Tag

Tag adalah tanda awalan dan akhiran yang digunakan sebagai perintah HTML yang akan dibaca oleh web browser. Tag diciptakan dengan menggunakan tanda kurung siku yaitu <…>, di mana di dalamnya mengandung isi nama tag.  

Setiap tag mempunyai fungsi perintah yang berbeda-beda. Kamu dapat mulai belajar HTML pada tag ini dimulai dari membuat judul, paragraf, kata bercetak miring, heading, kata huruf cetak tebal, italic, dan lainnya.  

Misalnya: <bold>. Tag tersebut bisa meminta browser agar dapat menampilkan teks dengan format tebal. 

Di samping itu, tag dapat ditulis dengan cara berpasangan, yaitu tag pembuka dan tag penutup.  Pada tag penutup ditambahkan dengan garis miring (/) di depan nama tag. 

Tag HTML sendiri pada awalnya hanya memiliki jumlah 18. Hingga saat artikel ini dibuat, sudah ada lebih dari 250 tag. 

Sebagai pembelajaran, kamu dapat mempelajari tag HTML dasar yang biasa digunakan sebagai berikut :

  • Tag <html> : berfungsi untuk memulai membuat halaman HTML yang melingkupi semua konten dan elemen.
  • Tag <head> : berfungsi untuk membuat halaman HTML yang melingkupi tampilan deskripsi pada hasil pencarian Google, style konten (CSS), dsb.
  • Tag <title> : berfungsi untuk membuat judul pada website.
  • Tag <body> : berfungsi untuk membuat bagian pada isi website.
  • Tag <h1> sampai <h6> : berfungsi untuk membuat pada bagian heading di artikel.
  • Tag <p> : berfungsi untuk membuat paragraf
  • Tag <!—> : berfungsi untuk membuat komentar

2. Elemen 

Elemen adalah komponen HTML yang memiliki keseluruhan kode dari tag pembuka sampai tag penutup. Elemen ini terdiri dari teks dan simbol yang dalam format tag pembuka, isi tag atau konten, dan juga tag penutup. 

Contohnya: <bold>Belajar HTML</bold>. 

Pada sebuah elemen juga dapat berisi elemen lainnya. Jadi elemen tersebut tidak hanya mengandung isi pada satu tag saja, tapi juga banyak tag. Elemen itu disebut juga dengan nested elements. Sebagai contoh, simak penjelasan pada kode berikut: 

<html>

<body> 

<h2>Judul Heading</h2>

<p>Paragraf pertama artikel.</p> 

</body> 

</html>

Jika diperhatikan pada elemen HTML tersebut, dari tag pembuka <html> lalu pada tag <body> yang mengandung isi elemen tag heading dan juga elemen tag paragraf. 

3. Atribut 

Atribut merupakan informasi atau perintah tambahan yang terdapat pada dalam elemen. Atribut ini memiliki tujuan sebagai penjelas perintah tag yang terdapat pada elemen. 

Contohnya, <img src=”gambar.jpg” alt “Bunga Sakura.”>

Tag <img> mempunyai atribut khusus yaitu (scr) dan (alt) yang maksudnya adalah browser perlu menampilkan gambar.jpg dengan alt text “Bunga Sakura”. 

Dari contoh di atas, kita dapat mengetahui juga jika jumlah atribut pada sebuah tag dapat lebih dari satu. Meski demikian, tidak semua atribut dapat digunakan pada sebuah tag. Berikut ini jenis atribut khusus beberapa tag: 

Atribut src, dapat digunakan pada tag <img>, <embed>, <audio>, dan <iframe>.

Atribut href, dapat digunakan pada tag <a> dan <link>.

Atribut action, dapat digunakan pada tag <form>

Atribut autoplay, dapat digunakan pada tag <audio> dan <video>.

Selain atribut khusus, ada beberapa atribut yang bisa digunakan dalam menentukan aksi yang dilakukan jika terjadi sesuatu pada elemen. Misalnya , (onload) ketika loading selesai, (onoffline) saat tiba-tiba offline, (onresize) pada ukuran jendela. Atribut tersebut juga dapat disebut juga dengan atribut event. 

Cara Kerja HTML 

Pertama, dokumen HTML bisa kamu buat pada aplikasi editor HTML kemudian menyimpannya dengan format .html atau .htm. 

Dokumen HTML yang dibuat tersebut bisa saja lebih dari satu. Karena dalam sebuah website, biasanya dapat terdiri dari banyak halaman. Contohnya saja, halaman utama, blog, kontak, dan lainnya. 

Nah, masing-masing dokumen, juga dapat berisi komponen HTML yang bisa menyusun bagian heading, isi konten, paragraf, dan lainnya. 

Ekstensi file ini juga dapat dibuka melalui web browser contohnya Google Chrome, Safari, atau Mozilla Firefox.

Kemudian, agar dapat diakses oleh banyak orang, kamu dapat mengonlinekannya terlebih dulu. Kamu juga perlu menyewa layanan web hosting dan mengupload file website.

Jika sudah, selanjutnya browser dapat membaca dan me-render file HTML menjadi tampilan halaman website. Sehingga ketika orang dalam mengakses website, mereka bisa mudah membaca informasi yang dapat ditampilkan.

Kesimpulan

HTML merupakan bahasa markup yang berguna untuk membuat struktur website sehingga dapat diakses secara baik melalui aplikasi browser.  

Berkat perkembangannya, HTML juga sudah memiliki banyak fungsi yang canggih. Contohnya,kita bisa membuat website dengan multimedia, diterapkan dengan bahasa pemrograman lain, dan mampu memberikan navigasi halaman website dengan hyperlink. 

Semoga bermanfaat

IDwebhost merupakan penyedia layanan Jasa Pembuatan Website ternama di Indonesia yang menawarkan berbagai pilihan paket Jasa Pembuatan Website yang sesuai dengan kebutuhanmu. IDwebhost memiliki tim profesional yang berpengalaman dalam membuat website profesional.

Taufiq Prasetya Pradana

Member since 6 Sep 2019