Teknologi

Penjelasan Pengertian HTML: Apa itu Hypertext Markup Language? Sejarah, Dasar, Cara Kerja, Jenis dan Macam, Standar, Contoh serta Cara Menggunakannya!

Tahukah Anda, Pengertian HTML, Apa itu Hypertext Markup Language? Sejarah, Dasar, Cara Kerja, Jenis dan Macam Versinya, Standar, Contoh, serta Cara Menggunakan dan Mengimplementasikannya! Benar sekali, jika Anda ingin menjadi pengembang web, hal pertama yang perlu Anda ketahui adalah HTML. Tidak sulit untuk belajar dan memahami HTML. Ini terdiri dari serangkaian kode pendek yang diketik ke dalam file teks oleh penulis situs yaitu adalah tag. Teks itu kemudian disimpan sebagai file dengan ekstensi .html, dan dilihat melalui browser, seperti Internet Explorer.

Browser tersebut membaca file dan menerjemahkan teks ke dalam bentuk yang terlihat dan me-render halaman seperti yang dimaksudkan penulis. Untuk menggunakannya, mereka terbilang sangat mudah. HTML membentuk struktur dasar halaman web dengan CSS dan Javascript. Ini adalah teknologi inti dari World Wide Web (WWW). Ya, ini semua tentang tag, Anda hanya perlu memahami cara kerja dan cara menggunakannya dengan benar. Terkait hal tersebut, dalam postingan kali ini, Kami akan membahas secara lebih detail dan lengkap tentang apa itu pengertian HTML. Baiklah, berikut ini ulasannya!

Pengertian HTML

Merupakan singkatan dari Hyper Text Markup Language, HTML adalah bahasa markup standar untuk halaman Web berdasarkan simpulan Kami yang bersumber langsung dari Situs W3Schools.

Elemen yang terdapat di dalamnya desebut dengan blok bangunan halaman HTML, mereka diwakili oleh tag <>.

Markup ini memberi tahu peramban web cara menampilkan teks, gambar, dan bentuk multimedia lainnya pada laman website.

Apa itu Hypertext Markup Language?

Ilustrasi Gambar Apa Itu Hypertext Markup Language Dan Well Formed HTML

Jadi, apa itu yang dimaksud dengan Hypertext Markup Language ini sebenarnya? Seperti yang sudah Kami jelaskan di atas, ini lebih dikenal dengan HTML (saja) secara global.

Hypertext Markup Language adalah bahasa yang digunakan untuk membuat dokumen elektronik (disebut halaman) yang ditampilkan di World Wide Web atau WWW (baca pengertian WWW di sini).

Setiap halaman berisi serangkaian koneksi ke halaman lain yang disebut hyperlink. Setiap halaman web yang Anda lihat di internet ditulis menggunakan satu versi kode HTML atau lain sebagainya.

Kode HTML memastikan pemformatan teks dan gambar yang tepat untuk browser internet Anda. Tanpa HTML, peramban tidak akan tahu cara menampilkan teks sebagai elemen atau memuat gambar atau elemen lainnya.

Ini juga menyediakan struktur dasar halaman dan tempat Cascading Style Sheets (CSS) untuk mengubah tampilannya.

Orang bisa menganggap HTML sebagai bone atau skull (struktur) dari halaman web, dan CSS (baca pengertian CSS di sini) sebagai skin atau kulit (penampilan).

Apa itu Well-Formed HTML?

Kemudian, ada juga istilah yang disebut dengan well-formed HTML. Ini merupakan cara penulisan agar browser web menampilkan halaman HTML tanpa kesalahan.

Agar terbentuk dengan baik, setiap elemen HTML harus terkandung dalam tag terbuka <p> dan tag penutup </p>.

Selanjutnya, setiap tag baru yang dibuka dalam tag lain harus ditutup sebelum tag yang mengandung tersebut ditutup.

Sejarah HTML (Hypertext Markup Language)

Agar lebih memahami tentang apa itu pengertian dan arti HTML, maka kita juga harus mengetahui tentang sejarah awal mereka.

Oke, perlu kalian ketahui bahwa HTML pertama kali disebutkan di internet oleh orang yang bernama Tim Berners-Lee yang merupakan seorang ahli atau pakar fisika di lembaga penelitian yang bernama CERN di negara Swiss.

Dia hadir dengan ide sistem hiperteks berbasis internet pada tahun 1991.

Setelah itu, HTML kemudian dipopulerkan oleh browser Mosaik yang dikembangkan oleh NCSA. Itu terdiri dari 18 (delapan belas) elemen.

CERN mengembangkan situs web pertama, yang dibuat online pada 6 agustus tahun 1991. Kemudian, pada tahun 1995, HTML 2.0 dikembangkan yang merupakan dasar untuk masa depan.

HTML 3.2 keluar pada tahun 1997. Tapi itu tidak terlalu menjanjikan. Seiring kemajuan teknologi, pengerjaan HTML juga mengalami kemajuan.

Lalu HTML 4.0 keluar pada akhir tahun 1997 yang memperluas mekanisme untuk style sheet, scripting, frame, embedding untuk objek, dan lain sebagainya.

Itu adalah versi HTML yang dapat dikatakan sudahdiproduksi dengan baik, di mana HTML 4.01 merupakan versi upgrade (peningkatannya).

Itu adalah versi utama selama bertahun-tahun sampai HTML5 keluar pada 2014. HTML5 keluar dengan beberapa aturan dan opsi baru hingga saat ini (di tahun 2020).

Dasar-Dasar Tag HTML

Ilustrasi Gambar Dasar Dasar Tag HTML Dalam Penjelasan Pengertian Dan Artinya

Setelah kita mengetahui apa arti HTML atau Hypertext Markup Language dan sejarahnya di atas, pastinya kita juga harus mengetahui apa saja dasar-dasar tag yang ada dalam bahasa markup tersebut.

Benar, ada banyak sekali tag dalam HTML. Karena Kami tidak dapat menjelaskan setiap tag yang ada dalam HTML, maka Kami hanya akan menjelaskan tag dasar yang merupakan dasar dalam pembelajaran HTML.

Berikut ini adalah beberapa dasar-dasar tag HTML (Hypertext Markup Language) yang harus kalian ketahui.

a. Tag HTML

Tag paling dasar adalah tag HTML. Tag ini memberi tahu browser bahwa kita sedang membuat dokumen HTML. Tag ini adalah akar dari dokumen yang berekstensi .html, di mana ini mengandung dan berisi semua tag lainnya.

b. Tag Head

Tag dasar yang penting lainnya adalah tag head. Secara umum, para pengembang menggunakan tag ini segera setelah tag HTML ditulis.

Tag kepala dapat berisi judul, skrip, gaya, dan lainnya. Kita dapat meletakkan elemen-elemen berikut di dalam tag kepala:

  • <title>
  • <script>
  • <style>
  • <link>

c. Tag Body

Selanjutnya adalah tag body. Tag ini mendefinisikan bagian isi (tubuh) dokumen. Ini merupakan tag utama halaman web HTML.

Kita menambahkan semua konten untuk halaman web di dalam tag body. Itu bisa berisi apa saja seperti paragraf, gambar, judul, formulir, tabel, dan lain sebagainya.

Jadi ketika kita berbicara tentang apa itu HTML, tag body adalah elemen utama halaman web.

d. Tag Img

Tag img digunakan untuk menyisipkan gambar di dalam tubuh dokumen HTML. Gambar selalu menjadi hal yang penting dan bermanfaat di halaman web.

Oleh karena itulah, kita bisa menggunakan tag img. Ini memiliki atribut src di mana kita harus menambahkan jalur sumber atau URL gambar.

Kita juga dapat mengatur lebar dan tinggi gambar dengan menggunakan atribut width dan height.

Selain dari apa yang sudah Kami sebutkan di atas, berikut ini adalah beberapa tag HTML yang pada umumnya sering digunakan.

  • <h1>; Tag ini menjelaskan judul tingkat atas.
  • <h2>; Menjelaskan judul tingkat dua.
  • <p>; Ini digunakan untuk menggambarkan paragraf.
  • <table>; Tag ini menjelaskan data tabular.
  • <ol>; Menjelaskan daftar informasi yang diurutkan.

Cara Kerja HTML atau Hypertext Markup Language

Dalam membahas mengenai apa itu pengertian HTML, adalah merupakan hal yang penting bagi Kami untuk menjelaskan bagaimana prinsip dan cara kerja mereka sendiri.

Benar, HTML terdiri dari serangkaian kode pendek yang diketik ke dalam file teks oleh penulis web yang dikenal dengan sebutan “tag”.

Teks tersebut kemudian disimpan sebagai file HTML, dan dilihat melalui browser, seperti Google Chrome, Mozilla atau Netscape Navigator.

Software perangkat lunak browser tersebut membaca file dan menerjemahkan teks ke dalam bentuk yang terlihat dan melakukan rendering untuk ditampilkan kepada pengguna.

Biasanya, dokumen HTML adalah file yang diakhiri dengan ekstensi .html atau .htm. Situs web rata-rata mencakup beberapa halaman yang berbeda.

Sebagai contoh misalnya, halaman beranda, halaman tentang, halaman kontak semua (masing-masing) akan memiliki dokumen HTML yang terpisah.

Setiap halaman HTML terdiri dari serangkaian tag (juga disebut elemen), yang dapat Anda rujuk sebagai blok pembangun halaman website (baca pengertian website di sini).

Mereka membuat hierarki yang menyusun konten menjadi bagian, paragraf, judul, dan blok konten lain sebagainyanya.

Sebagian besar elemen HTML memiliki pembukaan dan penutup yang menggunakan sintaks sebagai berikut:

<tag> </tag>

Di bawah, Anda dapat melihat contoh kode tentang bagaimana elemen dari HTML disusun:

<div>
<h1>Ini adalah judul utama</h1>
<h2>Ini subjudul yang menarik</h2>
<p>Paragraf pertama</p>
<img src="/" alt="gambar">
<p>Ini adalah paragraf kedua dengan <a href="https://example.com">hyperlink</a></p>
</div>

Standar HTML

Selain membahas tentang arti HTML, di sini kita juga akan membahas sedikit mengenai standar HTML.

Ya, ini HTML standard adalah rekomendasi resmi oleh World Wide Web Consortium (W3C) dan umumnya ditaati oleh semua browser web utama, termasuk browser web desktop dan mobile di mana HTML5 adalah versi terbaru dari spesifikasinya.

Aturan sintaks lainnya adalah bahwa atribut HTML harus diapit dalam tanda kutip tunggal (‘) atau ganda (“).

Sering ada perdebatan tentang format mana yang secara teknis benar, tetapi World Wide Web Consortium menyatakan bahwa kedua pendekatan tersebut dapat diterima dengan benar.

Secara default, Standard Generalized Markup Language (SGML) mengharuskan semua nilai atribut dibatasi menggunakan tanda kutip ganda (ASCII desimal 34) atau tanda kutip tunggal (ASCII desimal 39).

Saran terbaik Kami dalam memilih antara kutipan tunggal dan ganda adalah untuk tetap menjaga penggunaan yang konsisten di semua dokumen.

Alat validator atau pemeriksa HTML dari W3C dapat digunakan untuk menetapkan penggunaan yang konsisten di seluruh halaman.

Perlu dicatat bahwa kadang-kadang menggunakan kutipan tunggal mermang diperlukan, seperti dalam contoh di mana nilai atribut sebenarnya mengandung karakter kutipan ganda. Kebalikannya juga benar.

“Tanda kutip tunggal dapat dimasukkan dalam nilai atribut ketika nilainya dibatasi oleh tanda kutip ganda, dan sebaliknya.”

Jenis dan Macam-Macam Versi HTML

Kemudian, di sini kita juga akan membahas tentang jenis dan macam-macam versi dari HTML atau Hypertext Markup Language.

Ya, pada hari-hari awal web di seluruh dunia, menandai dokumen berbasis teks menggunakan sintaks HTML sudah lebih dari cukup untuk memfasilitasi berbagi dokumen akademik dan memo teknis.

Namun, ketika internet (baca pengertian internet di sini) meluas hingga melampaui dinding-dinding akademis dan ke rumah-rumah masyarakat umum, maka permintaan yang lebih besar pun ditempatkan pada halaman web dalam hal format dan interaktivitas.

Terkait jenisnya, perlu kalian ketahui bahwa HTML 4.01 dirilis pada tahun 1999, pada saat internet belum menjadi nama yang menjadi bagian dari rumah tangga, dan HTML5 tidak distandarisasi hingga 2014.

Berikut ini adalah daftar macam-macam versi HTML dan tahun pembuatannya di mana beberapa iterasi dari setiap versinya telah dirilis seiring waktu:

  • HTML 1.0; Dirilis pada tahun 1992 dan memiliki kemampuan yang sangat terbatas dan sekitar 20 elemen.
  • HTML 2.0; Dirilis pada 1995, ini mulai memasukkan unsur-unsur yang berkaitan dengan fungsi matematika.
  • HTML 3.2; Dirilis pada tahun 1996 yang membatalkan prakarsa fungsi matematika secara bersamaan, dan memperbaiki tumpang tindih antara berbagai ekstensi proprietary (kepemilikan).
  • HTML 4.0; Ini dirilis pada tahun 1997, versi ini menawarkan tiga variasi yang berbeda dalam jumlah elemen deprecated (usang) yang diizinkan.
  • HTML 4.01; Ini dirilis pada tahun 1999, di mana sebagian besarnya sama dengan versi 4.0.
  • HTML 5; Ini dirilis pada tahun 2014 yang muncul setelah banyak pembaruan karena organisasi yang mengembangkannya, yaitu W3C lebih berfokus pada bahasa paralel lain yang disebut XHTML.
  • HTML 5.1; Dirilis pada tahun 2016, versi ini bertujuan untuk lebih mudah mengakomodasi berbagai jenis embedding (penyematan) media dengan tag baru.
  • HTML 5.2; Ini dirilis pada tahun 2017, jenis versi ini bertujuan agar dapat dipahami oleh manusia dan komputer.
  • HTML 5.3; Masih belum dirilis, W3C berkolaborasi dengan WHATWG pada versi baru ini, diman proses kolaborasi dimulai pada 2019-2020.

Contoh HTML (Hypertext Markup Language)

Mengacu pada penjelasan pengertian HTML di atas, dokumen Hypertext Markup Language adalah dokumen yang mengandung tulisan bahasa markup. Perlu kalian garis bawahi, ini bukanlah bahasa pemrograman!

Untuk contohnya sendiri, berikut ini adalah isi dari sebuah dokumen yang memiliki format Hypertext Markup Language (HTML).

<!DOCTYPE html>
<html lang="en">

<meta charset="utf-8">
<title>Judul Halaman</title>

<body>
   <h1>Judul tingkat 1</h1>
   <p>Paragraf</p>
   <p>Paragraf lainnya</p>
</body>

</html>

Sebelumnya, kalian harus sudah paham betul terlebih dahulu jika elemen dalam HTML adalah blok yang membangun sebuah halaman web yang berekstensi .html.

Di bawah ini adalah penjelasan masing-masing tag (elemen) dari contoh di atas agar kalian dapat lebih memahaminya:

  • <!DOCTYPE html> di atas, adalah deklarasi yang mendefinisikan bahwa dokumen ini adalah dokumen HTML5.
  • Elemen <html> adalah elemen akar dari halaman HTML.
  • Atribut lang mendefinisikan bahasa dari dokumen tersebut.
  • Elemen <meta> di atas, mengandung informasi tentang dokumen tersebut.
  • Atribut charset mendefinisikan set karakter yang digunakan dalam dokumen.
  • Elemen <title> mendefinisikan judul dari dokumen.
  • Elemen <body> mengandung konten laman yang dapat dilihat.
  • Elemen <h1> mendefinisikan judul atas, ini dituliskan dengan angka (sebagai tingkatannya).
  • Sedangkan elemen <p> adalah yang mendefinisikan sebuah paragraf.

Cara Menggunakan dan Mengimplementasikan HTML

Lalu, bagaimana cara menggunakan HTML (Hypertext Markup Language) serta bagaimana cara implementasinya?

Begini, karena HTML sepenuhnya berbasis teks, file HTML dapat diedit hanya dengan membukanya melalui program seperti Notepad++, Vi, Sublime Text atau Emacs.

Editor teks apa pun dapat digunakan untuk membuat atau mengedit file HTML.

Selama file tersebut dibuat dengan ekstensi .html, browser web apa pun, seperti Chrome atau Firefox dan Microsoft Edge, akan dapat menampilkan file (baca pengertian file di sini) sebagai sebuah halaman web.

Untuk pengembang perangkat lunak profesional, ada berbagai editor WYSIWYG untuk mengembangkan halaman web.

Editor WYSIWYG adalah singkatan dari What You See Is What You Get yang berarti apa yang Anda lihat adalah apa yang Anda dapatkan.

NetBeans, IntelliJ, Eclipse dan Microsoft Visual Studio menyediakan editor WYSIWYG baik sebagai plug-in atau sebagai komponen standar, di mana itu membuatnya menjadi sangat mudah dalam menggunakan dan mengimplementasikan HTML.

Selain itu, editor WYSIWYG ini juga menyediakan fasilitas pemecahan masalah HTML, meskipun browser web modern sering berisi plug-in pengembang web yang akan menyoroti masalah yang terdapat pada halaman HTML, seperti tag akhir yang hilang atau sintaksis yang tidak membuat HTML terbentuk dengan baik.

Chrome dan Firefox keduanya termasuk alat pengembang HTML yang memungkinkan untuk melihat langsung file HTML lengkap halaman web, bersama dengan kemampuan untuk mengedit HTML dengan cepat dan segera memasukkan perubahan dalam browser.

Kesimpulan

Baiklah, jadi berdasarkan pembahasan dan penjelasan Pengertian HTML, Apa itu Hypertext Markup Language? Sejarah, Dasar, Cara Kerja, Jenis dan Macam Versinya, Standar, Contoh, serta Cara Menggunakan dan Mengimplementasikannya di atas, dapat kita simpulkan bahwa HTML adalah singkatan dari kata Hypertext Markup Language. Ini memungkinkan pengguna untuk membuat dan menyusun bagian, paragraf, pos, tautan, dan pemblokiran untuk halaman web dan aplikasi. HTML bukan bahasa pemrograman, artinya dia tidak memiliki kemampuan untuk membuat fungsionalitas dinamis.

Selebihnya, ini memungkinkan untuk diterbitkan dan memformat dokumen yang mirip seperti dengan Microsoft Word. Saat bekerja dengan HTML, kita menggunakan struktur kode sederhana (tag dan atribut) untuk menandai halaman situs web. Sebagai contoh misalnya, kita dapat membuat paragraf dengan menempatkan teks terlampir di dalam tag awal <p> dan penutup </p>.

Penutup

Demikianlah ulasan yang dapat Kami bagikan dalam postingan yang membahas tentang Pengertian HTML, Apa itu Hypertext Markup Language? Sejarah, Dasar, Cara Kerja, Jenis dan Macam Versinya, Standar, Contoh, serta Cara Menggunakan dan Mengimplementasikannya kali ini. Semoga apa yang Kami sampaikan di sini dapat bermanfaat serta dapat manambah wawasan Kita semua terutama dalam mengetahui istilah-istilah teknologi.

Silahkan bagikan artikel atau tulisan Kami di sini jika kalian rasa ini bermanfaat untuk teman-teman kerabat serta rekan kerja kalian semua. Sekian dari Saya, Terima Kasih.

Postingan ini juga tersedia dalam versi:


Lihat Juga

rifqimulyawan.com menggunakan cookies untuk meningkatkan kebergunaan pengguna.