Table of Contents
HTML (Hypertext Markup Language) adalah bahasa pemrograman yang digunakan untuk membuat dan mengatur konten pada halaman web. Dalam artikel ini, kami akan memberikan panduan lengkap dan komprehensif mengenai pengertian HTML, serta bagaimana HTML berfungsi dalam membangun sebuah website.
HTML merupakan fondasi dari setiap halaman web yang ada di internet. Dengan menggunakan HTML, Anda dapat membuat tata letak, menambahkan teks, gambar, video, dan elemen-elemen lainnya ke dalam halaman web Anda. HTML menggunakan tag-tags khusus untuk memberikan instruksi kepada browser web tentang bagaimana halaman web harus ditampilkan.
Pengenalan HTML
Pada sesi ini, kami akan memberikan penjelasan mendalam mengenai apa itu HTML, sejarahnya, serta mengapa HTML penting dalam pengembangan web. Anda juga akan mempelajari bagaimana struktur dasar HTML terlihat dan bagaimana cara menulis kode HTML yang benar.
HTML (Hypertext Markup Language) adalah bahasa pemrograman yang digunakan untuk membuat halaman web. Dengan menggunakan kode HTML, Anda dapat mengatur tata letak, menambahkan teks, gambar, video, dan elemen-elemen lainnya ke dalam halaman web Anda. HTML pertama kali diperkenalkan pada tahun 1990 oleh Tim Berners-Lee, pencipta World Wide Web, dan sejak itu menjadi standar dalam pengembangan web.
HTML memiliki struktur dasar yang terdiri dari elemen-elemen seperti ,
, dan . Elemen digunakan untuk mengawali halaman web, sementara elemen berisi informasi-informasi penting seperti judul halaman dan tautan ke file CSS. Elemen adalah tempat di mana konten sebenarnya dari halaman web ditampilkan.Untuk menulis kode HTML yang benar, Anda perlu memahami struktur dasar HTML dan bagaimana cara menggunakan tag-tags yang tepat. Setiap tag HTML dimulai dengan tanda “<" dan diakhiri dengan tanda ">“. Beberapa tag HTML memiliki atribut yang dapat digunakan untuk memberikan instruksi tambahan kepada browser web. Sebagai contoh, tag digunakan untuk menampilkan gambar dan memiliki atribut seperti src untuk menentukan lokasi gambar, dan alt untuk memberikan teks alternatif jika gambar tidak dapat ditampilkan.
Tag-Tags Dasar HTML
Pada sesi ini, kami akan membahas tag-tags dasar HTML yang digunakan untuk membuat struktur dan konten pada halaman web. Anda akan mempelajari tag-tags seperti ,
, ,–
,
, , , dan banyak lagi. Kami juga akan memberikan contoh penggunaan tag-tags tersebut.
Tag-tags dasar HTML adalah elemen-elemen yang digunakan untuk mengatur struktur dan konten pada halaman web. Beberapa tag-tags dasar yang umum digunakan antara lain:
Tag
Tag digunakan untuk mengawali halaman web dan memberitahu browser web bahwa dokumen tersebut adalah dokumen HTML. Setiap halaman web harus dimulai dengan tag .
Tag
Tag
berisi informasi-informasi penting tentang halaman web, seperti judul halaman, tautan ke file CSS, dan meta tag yang memberikan informasi tentang halaman web kepada mesin pencari. Tag tidak ditampilkan di halaman web secara langsung, tetapi berfungsi sebagai pengaturan latar belakang.Tag
Tag
adalah tempat di mana konten sebenarnya dari halaman web ditampilkan. Segala sesuatu yang ingin Anda tampilkan di halaman web, seperti teks, gambar, video, dan elemen-elemen lainnya, harus ditempatkan di dalam tag .Tag
–
Tag
–
digunakan untuk memberikan judul atau heading pada halaman web. Tag
adalah heading dengan tingkat prioritas tertinggi, sedangkan tag
adalah heading dengan tingkat prioritas terendah. Anda dapat menggunakan tag-tags ini untuk mengatur hierarki informasi pada halaman web.
Tag
adalah heading dengan tingkat prioritas tertinggi, sedangkan tag
adalah heading dengan tingkat prioritas terendah. Anda dapat menggunakan tag-tags ini untuk mengatur hierarki informasi pada halaman web.
Tag
Tag
Tag
digunakan untuk menampilkan teks paragraf pada halaman web. Setiap paragraf yang ingin Anda tampilkan di halaman web harus ditempatkan di dalam tag
.
Tag
Tag digunakan untuk menampilkan gambar di halaman web. Tag ini memiliki atribut src yang digunakan untuk menentukan lokasi gambar, serta atribut alt yang memberikan teks alternatif jika gambar tidak dapat ditampilkan.
Tag
Tag digunakan untuk membuat hyperlink di halaman web. Anda dapat menggunakan tag ini untuk membuat tautan ke halaman web lain, dokumen, atau bagian tertentu di dalam halaman web Anda. Tag memiliki atribut href yang digunakan untuk menentukan lokasi tautan.
Contoh penggunaan tag-tags dasar HTML:
<html><head><title>Judul Halaman</title></head><body><h1>Heading Utama</h1><p>Ini adalah paragraf pertama.</p><img src="gambar.jpg" alt="Teks Alternatif Gambar"><a href="https://www.contoh.com">Tautan ke Contoh.com</a></body></html>
Membuat Hyperlink
Pada sesi ini, kami akan membahas cara membuat hyperlink di dalam halaman web menggunakan tag . Kami akan menjelaskan cara membuat hyperlink internal dan eksternal, serta cara menambahkan atribut pada tag seperti target dan title.
Hyperlink adalah tautan yang menghubungkan halaman web satu dengan yang lain atau bagian-bagian di dalam halaman web yang sama. Dalam HTML, hyperlink dapat dibuat menggunakan tag . Untuk membuat hyperlink, Anda perlu menentukan lokasi tautan menggunakan atribut href pada tag .
Hyperlink dapat menghubungkan halaman web internal atau eksternal. Hyperlink internal digunakan untuk menghubungkan bagian-bagian di dalam halaman web yang sama. Anda dapat menggunakan tanda pagar “#” diikuti dengan nama id elemen yang ingin Anda tuju sebagai nilai href pada tag . Misalnya, jika Anda memiliki elemen dengan id “bagian1”, Anda dapat membuat hyperlink ke bagian tersebut dengan menggunakan kode Tautan ke Bagian 1.
Sedangkan hyperlink eksternal digunakan untuk menghubungkan halaman web dengan halaman web lain di internet. Anda dapat menggunakan alamat URL lengkap sebagai nilai href pada tag . Misalnya, Tautan ke Contoh.com.
Anda juga dapat menambahkan atribut lain pada tag untuk memberikan instruksi tambahan kepada browser web. Misalnya, atribut target dapat digunakan untuk menentukan di mana halaman baru akan dibuka ketika pengguna mengklik tautan. Nilai “_blank” digunakan untuk membuka halaman baru di tab atau jendela browser baru.
Contoh penggunaan hyperlink di dalam halaman web:
<a href="#bagian1">Tautan ke Bagian 1</a><a href="https://www.contoh.com" target="_blank">Tautan ke Contoh.com</a>
Menyisipkan Gambar dan Video
Pada sesi ini, kami akan membahas cara menyisipkan gambar dan video ke dalam halaman web menggunakan tag dan
Menyisipkan gambar dan video ke dalam halaman web adalah cara yang efektif untuk menampilkan konten visual kepada pengunjung. Dalam HTML, Anda dapat menyisipkan gambar menggunakan tag dan video menggunakan tag
Selain atribut src, tag
Anda juga dapat mengatur ukuran gambar menggunakan atribut width dan height pada tag . Atribut ini dapat diisi dengan nilai dalam piksel (misalnya width=”500″ height=”300″) atau dalam persen dari lebar dan tinggi asli gambar (misalnya width=”50%” height=”50%”).
Untuk menyisipkan video, Anda perlu menggunakan tag
Anda juga dapat menambahkan kontrol pemutaran video menggunakan atribut controls pada tag
Contoh penggunaan tag dan
<img src="gambar.jpg" alt="Teks Alternatif Gambar"><video src="video.mp4" width="640" height="360" controls></video>
Membuat Tabel
Pada sesi ini, kami akan membahas cara membuat tabel di dalam halaman web menggunakan tag
, dan | . Anda akan mempelajari cara mengatur baris dan kolom, menambahkan judul, dan menggabungkan sel pada tabel.
Tabel adalah cara yang efektif untuk menyusun data dalam bentuk baris dan kolom di halaman web. Dalam HTML, tabel dapat dibuat menggunakan tag
|
---|