Belajar HTML Part 1 – Pengenalan [Lengkap]

CoretanKode – Pada kesempatan kali ini admin ingin membuat sebuah sesi belajar HTML berbahasa indonesia nih, secara singkat HTML ini merupakan Bahasa dasar apabila kalian ingin membangun sebuah program yang bersifat webpage.

Artikel Menarik Lainnya :

Nah bila kalian ingin menjadi web developer kalian sangat wajib mengetahui dan khatam dalam bidang HTML terlebih dahulu. HTML juga mempunyai beberapa versi dan yang paling enak dan sederhana sih yakni HTML5 karena banyak fitur yang menarik di dalamnya.

Isi tampilkan

Pengertian HTML

HTML merupakan kepanjangan dari Hypertext Markup Language dan merupakan Bahasa standar untuk membuat sebuah halaman berbasis web. HTML ini merupakan penjelas struktur dari halaman web, HTML juga mempunyai beberapa banyak elemen yang digunakan untuk membangun User Interface.

HTML dapat dikatakan sebagai media atau cara seorang web developer menunjukkan konten yang dibangun melalui web browser, Mempunyai struktur yang rapi mulai dari tag paragraf, header, break line, table dan masih banyak lagi.

Contoh Sederhana dari Dokumen HTML

Di bawah ini merupakan sebuah contoh sederhana isi dari sebuah dokumen dengan format .HTML :

<!DOCTYPE html>

<html>

<head>

<title>CoretanKode – We Code We Good</title>

</head>

<body>

<h1>Header 1 – Bisa Judul</h1>

<p>Paragraf dalam HTML di mulai dengan tag P.</p>

</body>

</html>

Penjelasan dari source code di atas dapat dilihat dibawah ini:

DOCTYPE html : Pendeklarasian bahwa dokumen ini dibuat dengan HTML5
<Html> : Elemen root dari dokumen HTML ini
<head> : Merupakan elemen pembuka yang berisikan meta tag lainnya
<title> : Tag yang mengspesifikasi-kan judul dari halaman HTML yang dibuat dan akan muncul di title bar browser pengguna
<body> : Tag yang mendefiniskan bagian badan dari sebuah halaman HTML yang diisikan konten dari halaman tersebut
<h1> : Merupakan TAG header yang biasa digunakan sebagai meta pengenalan judul atau sub-bab pada konten yang terdapat pada halaman HTML
<p> : Merupakan TAG untuk membuat paragraf baru dimana tag ini akan otomatis mengatur jarak dari konten diatas-nya.

READ : 7 Toko Buku Online Terbaik di Indonesia

Mengenal Elemen HTML

Bila kalian melihat contoh dokumen HTML yang admin buat diatas maka kalian seharusnya sudah melihat sedikit dari elemen yang terdapat pada Bahasa HTML.

Setiap bagian dari HTML di definisikan menggunakan sebuah TAG contohnya :

<namatag> Konten Disini.. </namatag>

Dapat kalian lihat diatas terdapat tag pembuka dan penutup dimana tag pembuka dibuat seperti : <namatag> sementara tag penutup menggunakan tanda garing sehingga seperti : </namatag>

Tetapi tidak semua TAG pada html menggunakan tag pembuka dan penutup yah contohnya saja tag <BR> dimana TAG ini tidak membutuhkan tag penutup. TAG ini disebut dengan istilah Elemen Kosong dimana tidak membutuhkan tag penutup pada saat di deklarasikan.

Melihat Hasil di Web Browser

Pada saat kalian telah selesai membuat sebuah halaman dengan format .HTML maka untuk membuka dan melihat hasilnya kalian hanya memerlukan Web Browser sebagai media untuk melihat hasil yang kalian kodingkan.

Cukup save dokumen html kalian dengan ekstensi .HTML lalu buka file tersebut menggunakan Web Browser seperti Google Chrome atau Mozilla maka hasil ketikan kode kalian akan muncul.

Setiap Web Browser mempunyai kelebihan dan kekurangan masing-masing apalagi pada bidang cloud computing atau rendering online.

Gunakan lah minimal 2 web browser apabila kalian ingin membuat sebuah halaman website yang telah mempunyai styling yang rumit. Tapi apabila kalian baru memulai alias styling masih menggunakan CSS atau in-line styling yang sederhana saja cukup menggunakan Google Chrome untuk meliha hasil sudahlah cukup.

Struktur Halaman HTML

Selanjutnya kita akan belajar HTML tentang strukturnya. Sedikit menjelaskan lagi bahwa HTML itu mempunyai struktur yang rapi, dapat kalian lihat dari contoh diatas seperti ini:

<html>

<head>

<title>Judul</title>

</head>

<body>

<h1>CoretanKode</h1>

<p>Paragraf nomor 1</p>

<p>Paragraf nomor 2</p>

</body>

</html>

Terlihat jelas bahwa setiap meta pengenalan website seperti judul, deskripsi halaman, opengraph dan lain-lain itu berada di dalam tag <head> sampai di tutup, sementara untuk isi konten diletakkan di dalam tag <body> lalu di tutup tag body-nya setelah konten selesai di isi.

READ : Belajar HTML Part 4 - Elemen-Elemen di HTML [Lengkap]

Jadi di HTML tag paling minimal adalah tag <HTML>, <HEAD> dan tag <BODY> dan jangan lupa untuk menyimpan dokumen kalian dalam format .html agar dapat terakses sebagai halaman web.

Sejarah Versi HTML

HTML sangat berkembang dari tahun ke tahun, dan kalian dapat melihat perubahan versi-nya di bawah ini :

Tahun	Versi
1989	Tim Berners-Lee invented www
1991	Tim Berners-Lee invented HTML
1993	Dave Raggett drafted HTML+
1995	HTML Working Group defined HTML 2.0
1997	W3C Recommendation: HTML 3.2
1999	W3C Recommendation: HTML 4.01
2000	W3C Recommendation: XHTML 1.0
2008	WHATWG HTML5 First Public Draft
2012	WHATWG HTML5 Living Standard
2014	W3C Recommendation: HTML5
2016	W3C Candidate Recommendation: HTML 5.1
2017	W3C Recommendation: HTML5.1 2nd Edition
2017	W3C Recommendation: HTML5.2

Pada saat ingin belajar HTML jangan hanya membuat tetapi sejarahnya juga yah. Nah jadi kalian bisa lihat sendiri deh HTML atau Halaman Website yang ada sekarang ini itu dimulai dan berkembang pada tahun 1989 hingga saat ini.

Update terakhir dikabarkan pada tahun 2017 tetapi belakangan ini sudah dapat dikatakan HTML5 merupakan struktur dasar yang sempurna pada hal pengembangan website.

Nah jadi itulah yang dapat admin sampaikan pada artikel Belajar HTML part 1: Pengenalan ini, jangan lupa baca lanjutan-nya di bawah ini :

Sekian dan terima kasih telah berkunjung, Assalamualaikum Warahmatullahi Wabarakatu.

Originally posted 2021-11-10 15:57:57.