Apa Itu HTML? Pemahaman Dasar Tentang HyperText Markup Language

Himang
March 15, 2022
0 Comments
Home
HTML
Apa Itu HTML? Pemahaman Dasar Tentang HyperText Markup Language
himang.my.id - Berbicara soal HTML tidak hanya terbatas pada pengertiannya saja. Anda harus tahu seluk-beluknya jika ingin mahir bahasa markup yang satu ini. 

Apa Itu HTML? Pemahaman Dasar Tentang  HyperText Markup Language
HTML adalah singkatan dari Hypertext Markup Language. HTML memungkinkan seorang user untuk membuat dan menyusun bagian paragraf, heading, link atau tautan, dan blockquote untuk halaman web dan aplikasi.

HTML bukanlah bahasa pemrograman kenapa saya bilang langsung bukan bahasa pemograman karena banyak teman-teman yang beranggapan bahwa Html adalah Bahasa Pemograman, melainkan HTML tidak punya kemampuan untuk membuat fungsionalitas yang dinamis. 

Sebagai gantinya, HTML memungkinkan user untuk mengorganisir dan memformat dokumen, sama seperti Microsoft Word.

Ketika bekerja dengan HTML, kami menggunakan struktur kode yang sederhana (tag dan attribute) untuk mark up halaman website. 

Misalnya, kami membuat sebuah paragraf dengan menempatkan enclosed text di antara tag pembuka <p>  dan tag penutup </p>.

<p> Ini adalah bagaimana Anda menambahkan paragraf dalam HTML. </p>
<p> Anda dapat memiliki lebih dari satu! </p>

Kesimpulannya, pengertian HTML sebagai bahasa mark up sangatlah mudah untuk dipahami bahkan bagi webmaster pemula di bidang web development sekalipun.

Sejarah HTML

HTML dibuat oleh Tim Berners-Lee, seorang ahli fisika di lembaga penelitian CERN yang berlokasi di Swiss. Dia memiliki ide tentang sistem hypertext yang berbasis internet.

Hypertext merujuk pada teks yang memuat referensi (link) ke teks lain yang bisa diakses langsung oleh viewer. Tim merilis versi pertama HTML pada tahun 1991, dan di dalamnya terdiri atas 18 HTML tag.

Sejak saat itu, setiap kali bahasa HTML merilis versi teranyarnya, selalu ada tag dan attribute (tag modifier) terbaru.

Berdasarkan HTML Element Reference milik Mozilla Developer Network, untuk saat ini, ada 140 HTL tag meskipun sebagiannya sudah usang (tidak lagi didukung oleh versi terbaru browser).

Berkat popularitasnya yang terus meningkat, HTML kini dianggap sebagai web standard yang resmi. Spesifikasi HTML di-maintain dan dikembangkan oleh World Wide Web Consortiumm (W3C). Cek versi terbaru dari bahasa ini di website W3C.

Upgrade HTML besar-besaran terjadi pada tahun 2014, dan hasilnya adalah pengenalan HTML5. Pada upgrade tersebut, terdapat semantic baru yang memberitahukan arti dari kontennya sendiri, seperti <artcile>, <header>, dan <footer>.


Bagaimana Cara Kerja HTML?

Dokumen HTML adalah file yang diakhiri dengan ekstensi .html atau .htm. Ekstensi file ini bisa dilihat dengan mengunakan web browser apa pun (seperti Google Chrome, Safari, atau Mozila Firefox).

Browser tersebut membaca file HTML dan me-render kontennya sehingga user internet bisa melihat dan membacanya.

Biasanya, rata-rata situs web menyertakan sejumlah halaman HTML yang berbeda-beda. Contohnya, beranda utama, halaman ‘tentang kami’, halaman kontak yang semuanya memiliki dokumen HTML terpisah.

Masing-masing halaman HTML terdiri atas seperangkat tags (bisa disebut juga elements), yang mengacu pada building block halaman website. 

Tag tersebut membuat hirarki yang menyusun konten hingga menjadi bagian, paragraf, heading, dan block konten lainnya.

Sebagian besar element HTML memiliki tag pembuka dan penutup yang menggunakan syntax <tag></tag>.

Berikut contoh kode dari susunan atau struktur HTML:

<div>
   <h1> Tajuk Utama </h1>
   <h2> Subjudul yang menarik </h2>
   <p> Paragraf satu </p>
   <img src = "/" alt = "Gambar">
   <p> Paragraf dua dengan <a href="https://example.com"> hyperlink </a> </p>
</div>

  • Elemen teratas dan terbawah adalah division sederhana (<div></div>) yang bisa Anda gunakan untuk mark up bagian konten yang lebih besar.
  • Susunan HTML di atas terdiri atas heading (<h1></h1>), subheading (<h2></h2), dua paragraf (<p></p>), dan satu gambar (<img>).
  • Paragraf kedua meliputi sebuah link (<a></a>) dengan attribute href yang terdiri atas URL tujuan.
  • Tag gambar memiliki dua attribute, src untuk path gambar dan alt untuk deskripsi gambar.

Struktur atau Format yang Digunakan HTML/HTML 5 

<!DOCTYPE html>
<html>
<head>
 <title></title>
</head>
<body>

</body>
</html>

Perbedaan HTML dan HTML5?

Sejak hari pertama diperkenalkan, HTML telah melewati perkembangan yang cukup signifikan. W3C terus merilis versi dan update terbaru sembari mencetak sejarah dan mengukuhkan keberadaannya.

HTML4 (belakangan ini sering disebut sebagai “HTML”) dirilis pada tahun 1999 dan versi terbarunya diperkenalkan pada publik pada tahun 2014.  

Dikenal sebagai HTML5, versi terbaru ini menambahkan lebih banyak fitur baru ke bahasa mark up ini.

Salah satu fitur canggih di HTML5 adalah support untuk embed audio dan video. Jadi, alih-alih menggunakan Flash player, kita bisa melakukan file video dan audio yang di-embed ke halaman website dengan eanfaatkan tag <audio></audio> dan <video></video>

Fitur tersebut juga memiliki support bawaan untuk grafis vektor (SVG) yang dapat diskalakan dan MathML untuk formula matematika dan ilmiah.

HTML5 juga memperkenalkan beberapa perbaikan pada semantic. Tag semantic baru mengirimkan informasi pada browser tentang arti konten, yang  bermanfaat tak hanya bagi pembaca, tapi juga mesin pencari.

Tag semantic yang paling banyak digunakan adalah <article></article>, <section></section>, <aside></aside>, <header></header>, dan <footer></footer>


Kelebihan dan Kekurangan HTML

Sama seperti hal teknis lainnya dalam dunia web, HTML juga punya kelebihan dan kekurangannya.

Kelebihan:

  • Bahasa yang digunakan secara luas dan memiliki banyak sumber serta komunitas yang besar.
  • Dijalankan secara alami di setiap web browser.
  • Memiliki learning curve yang mudah.
  • Open-source dan sepenuhnya gratis.
  • Bahasa markup yang rapi dan konsisten.
  • Standard web yang resmi di-maintain oleh World Wide Web Consortium (W3C).
  • Mudah diintegrasikan dengan bahasa backend, seperti PHP dan Node.js.

Kekurangan:

  • Paling sering digunakan untuk halaman web statis. Untuk fitur dinamis, Anda bisa menggunakan JavaScript atau bahasa backend, seperti PHP.
  • HTML tidak memungkinkan user untuk menjalankan logic. Alhasil, semua halaman web harus dibuat terpisah meskipun menggunakan elemen yang sama, seperti header dan footer.
  • Fitur-fitur baru tidak bisa digunakan secara cepat di sebagian browser.
  • Terkadang perilaku browser susah untuk diprediksi (misalnya, browser lama tidak selalu bisa render tag yang lebih baru).


Bagaimana Hubungan Antara HTML, CSS, dan JavaScript?

Meskipun dinyatakan sebagai bahasa mark up yang powerful, HTML tidak sepenuhnya bisa membuat website yang profesional dan responsif. 

HTML hanya bisa digunakan untuk menambah elemen dan membuat struktur konten.

Namun di satu sisi, HTML bisa bekerja secara maksimal dengan dua bahasa frontend: CSS "Cascading Style Sheets" dan JS "JavaScript". Jika digabungkan, kedua bahasa frontend ini bisa meningkatkan pengalaman user dan mengaktifkan fungsi yang lebih canggih.

  • CSS erat kaitannya dengan styling, seperti background, warna, layout, spacing, dan animiasi.
  • JavaScript memungkinkan Anda menambahkan fungsionalitas yang dinamis, seperti slider, pop-up, dan galeri foto.

Misalkan HTML adalah orang yang tidak memakai satu helai benang pun, CSS adalah bajunya, dan JavaScript adalah aktivitas dan sikapnya.

Jadi… Apa Itu HTML?

HTML adalah bahasa mark up web yang utama dan dijalankan secara alami di setiap browser serta di-maintain oleh World Wide Web Consortium.

Berdasarkan cara kerja HTML, Anda bisa menggunakannya untuk membuat struktur konten pada website dan aplikasi web.

HTML merupakan level terbawah dari teknologi frontend dan berfungsi sebagai dasar styling yang bisa Anda tambahkan dengan CSS dan fungsionalitas yang dapat dijalakan menggunakan JavaScript.

Sumber : https://www.hostinger.co.id

Blog authors

Himang
Himang
Hanya Penulis Biasa! Blogger

No comments

Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan tampil lama karena akan dihapus sesegera mungkin. Oleh Admin Kami.