HTML: Pengertian, Fungsi, Komponen, Jenis dan Sejarahnya

HTML adalah bahasa yang bahasa yang harus ditamatkan oleh seorang web developer, apalagi bagi Anda yang seorang front-end developer.

Bahasa pemrograman ini juga merupakan komponen yang sangat penting dalam website. Contohnya saat Anda akan mengembangkan website, Anda akan mempunyai website yang unik karena Anda membuatnya sendiri menyesuaikan keinginan Anda dengan menggunakan elemen-elemen dan sistem drag-and-drop yang tersedia.

Oleh sebab itu, tidak ada ruginya untuk belajar HTML yang dapat memberikan Anda wawasan baru tentang bahasa pemrograman. Sehingga, Anda bisa memiliki pemahaman baru yang bisa memudahkan pekerjaan Anda.

Jadi, mari kita simak artikel di bawah ini tentang HTML hingga seluk-beluknya!

Apa Itu HTML

HTML merupakan singkatan dari HyperText Markup Language dan didefinisikan sebagai bahasa markup untuk pembuatan web. Bahasa ini terdiri dari sekumpulan simbol-simbol dan kode-kode yang nantinya di-insert ke dalam sebuah file yang mau ditampilkan di internet. 

Simbol-simbol yang digunakan pada bahasa ini menggunakan tags berupa simbol bracket “<” dan “>” serta sering kali menggunakan “<p>” untuk menjelaskan sebuah informasi tentang teks dalam dokumen dan bisa juga terdiri dari tags lain sebagai sub element.

Untuk membuat sebuah file HTML, ada standar khusus yang harus diikuti. Standar yang diikuti tersebut mengacu pada ASCII (American Standard Code for Information Interchange).

Keberadaan bahasa pemrograman ini dapat membantu Anda dalam menyusun heading dan paragraf atau membuat link, gambar, dan lainnya yang bisa terlihat di web page yang kemudian akan memberi tahu web browser bagaimana untuk menampilkan gambar dan tulisan web page. Web browser yang mendukung bahasa pemrograman ini, seperti Google Chrome, Mozilla Firefox, dan Microsoft Edge.

Selain itu, bahasa pemrograman ini juga memiliki sejarah yang berkembang hingga kini. Selanjutnya, kita akan membahas tentang sejarahnya dari tahun ke tahun dan bagaimana perkembangannya.

Sejarah HTML

Perkembangan HTML adalah bahasa pemrograman pertama di World Wide Web (WWW). Pengembang pertamanya adalah orang yang sama dengan penemu WWW, yaitu Tim Berners-Lee. 

Awalnya pada akhir tahun 1991, Tim Berners-Lee mempublikasikan dokumen yang disebut “HTML Tags” yang menggambarkan 18 elemen. Awalnya ini dikembangkan untuk membantu ilmuwan mengakses dokumen yang terdapat di dalam komputer.

Kemudian pada versi 2.0 digunakan standar untuk fitur utama yang berbasis pada penerapan pada tahun 1994 yang selanjutnya pada tahun 1995 HTML 2.0 dipublikasikan sebagai RFC 1866. Versi ini mampu menampilkan data dan form yang bisa langsung diedit. Dan juga versi ini adalah cikal bakal dari website interaktif.

Lalu pada tahun 1997, kembali dipublikasikan pada versi 3.2 sebagai W3C Recommendation. Versi ini memberikan fitur baru, yaitu fitur figure, yang berfungsi untuk mendukung tampilan image.

Selanjutnya pada kurun waktu akhir tahun 1997 dan pertengahan tahun 1998, dipublikasikan lagi HTML 4.0 sebagai W3C Recommendation. Pada versi ini ditambahkan command dasar berupa image, text, table, form, dan link.

Setelah itu pada akhir tahun 1999 hingga pertengahan 2000, muncul kembali dengan versi 4.01. Kali ini juga dipublikasikan dengan standar internasional untuk HTML, yaitu ISO/IEC 15445:2000. Versi ini adalah versi yang digunakan pada web browser mana pun.

Dan terakhir pada tahun 2104, versi terbaru muncul bernama HTML 5. Versi ini sudah melalui tahap perkembangan hingga dapat membuat tampilan dengan menggabungkan HTML, CSS, dan JavaScript. Karena versi ini adalah versi paling mutakhir, jadi versi ini menjadi yang paling canggih karena dilengkapi fitur embed video dan audio.

Komponen HTML

Sebelum melanjutkan ke cara kerjanya, Anda juga perlu mengetahui komponen-komponennya. Secara umum, komponen tersebut terdiri atas tag, elemen, dan atribut.

1. Tag

Pertama adalah tag, komponen ini yang menandakan awalan dan akhiran yang akan dibaca oleh web browser. Tag menggunakan bracket “<” dan “>” dan apabila dituliskan menjadi <…>.

Tag untuk HTML saat ini mencapai 250 tags dan Anda cukup perlu menghafal tags dasarnya berikut ini:

a. <html>

Tag ini digunakan untuk memulai halaman HTML yang akan menampilkan elemen-elemen dan konten.

b. <head>

Tag <head> digunakan untuk membuat halaman HTML yang meliputi tampilan deskripsi di hasil pencarian search engine, style dari konten (CSS), dan lainnya.

c. <title>

Tag ini digunakan untuk membuat judul website.

d. <body>

Tag ini digunakan untuk membuat isi website.

e. <h1> hingga <h6>

Digunakan untuk membuat heading pada bagian isi.

f. <p>

Tag ini untuk memulai sebuah paragraf.

g. <!–>

Dan yang terakhir ini digunakan untuk membuat sebuah komentar.

2. Element

Element adalah kumpulan dari keseluruhan kode dari tag pembuka sampai dengan tag penutup. Komponen kedua ini terdiri dari tag pembuka, isi konten, dan tag penutup. Selain itu, element juga disebut nested element. Contohnya seperti berikut:

<html>

<body>

<h2>Ayam Geprek<h2>

<p>Ayam geprek adalah makanan yang lezat.</p>

<body>

<html>

3. Attribute

Komponen ketiga ini adalah attribute. Pada bagian ini berisi informasi atau perintah tambahan yang ada di dalam element. Attribute berfungsi sebagai yang menjelaskan command dari tag pada element.

Berikut ini adalah attribute khusus yang digunakan beberapa tag, yaitu:

a. src

Attribute ini bisa digunakan pada tag <img>, <embed>, <iframe>, dan <audio>.

b. action

Attribute kedua ini dapat digunakan pada tag <form>.

c. href

Attribute ketiga ini dapat digunakan pada tag <a> dan <link>.

d. autoplay

Dan yang terakhir, attribute ini dapat digunakan untuk tag <audio> dan <video>.

Attribute juga diimplementasikan dengan bahasa pemrograman JavaScript yang bisa membuat halaman website Anda dapat melakukan aksi-aksi tertentu.

Cara Kerja HTML

Dokumen HTML adalah file yang memiliki format ekstensi .htm atau .html. Biasanya, sebuah web browser membaca file tersebut dan kemudian melakukan render kontennya sehingga Anda bisa melihatnya melalui web page.

Setiap pages memiliki elemen-elemen yang terdiri dari sekumpulan tags dan atribut. Element adalah building blocks dari web pages. Sebuah tag yang akan memberi tahu web browser awal dan akhir dari sebuah elemen, sedangkan sebuah atribut akan mendeskripsikan karakteristik dari elemen tersebut.

Terdapat 3 bagian utama dari sebuah elemen adalah:

• Opening tag, bagian ini untuk menjelaskan awalan dari sebuah elemen. Tag ini biasanya menggunakan bracket pembuka dan penutup. Contohnya, saat kita akan membuat paragraf harus dimulai dengan tag <p>.
• Content, pada bagian ini adalah bagian bisa Anda lihat di web page.
• Dan terakhir pada bagian closing tag ini adalah yang menjelaskan penutupan dari sebuah elemen. Tag yang tertulis di sini mirip seperti pada opening tag namun ditambahkan forward slash, seperti </p>.

Kombinasi dari 3 bagian ini akan membentuk element seperti berikut:

<p> Crepes adalah jajanan yang lezat dan bergizi. </p>

Fungsi HTML

Setelah mengetahui cara kerjanya, jadi sebenarnya seperti apa fungsi HTML itu? Langsung saja kita bahas di bawah ini tentang fungsi-fungsinya.

1. Foundation

Bahasa pemrograman ini berfungsi sebagai pondasi dari sebuah website. Selain itu, apabila dikombinasikan dengan bahasa pemrograman lain akan membuat tampilan website Anda lebih menarik.

2. Creation

Fungsi keduanya adalah dapat membantu dalam membuat halaman website Anda yang dapat membantu Anda untuk menyalurkan berbagai informasi-informasi melalui internet.

3. Tagging

Kemudian fungsi ketiganya adalah bisa menandai teks dan bagian-bagian dari web page. Dengan bantuan HTML, maka halaman website Anda akan mudah dibaca oleh orang lain karena tersusun dengan rapi dan menarik.

4. Showing

Selanjutnya adalah dapat menampilkan halaman yang tidak membosankan karena Anda bisa menambahkan gambar, video, maupun audio dengan memanfaatkan bahasa pemrograman ini.

5. Directing

Dan yang terakhir, kini HTML bisa membantu Anda membuat halaman yang bisa mengarahkan pembaca website Anda ke halaman lainnya yang dikenal sebagai hyperlink.

Apa Hubungan antara HTML, CSS, dan JavaScript?

Karena untuk membuat tampilan website Anda semakin menarik, HTML memerlukan bantuan dari CSS (Cascading Style Sheets) dan JavaScript untuk membuat konten website yang lebih menarik dan responsif.

Dalam hal ini CSS berperan untuk memberikan styling, seperti background, color, layout, spacing, dan animasi. Sedangkan, JavaScript berperan untuk menambahkan fungsionalitas dinamis, seperti sliders, pop-up, dan galeri foto. Ketiga bahasa pemrograman ini adalah bahasa dasar yang penting bagi seorang front-end developer.

Nah, demikian penjelasan tentang bahasa pemrograman HTML. Apakah Anda tertarik untuk mempelajarinya? Dan akan lebih lengkap lagi apabila Anda juga belajar tentang CSS dan JavaScript. Semoga artikel ini dapat bermanfaat untuk Anda dan nantikan artikel-artikel lainnya, ya!

Sekawan Studio menyediakan jasa pembuatan website terbaik dengan desain profesional, modern, dan responsif.