HTML LEARNING

01. HTML

HTML adalah singkatan dari Hypertext Markup Language, yaitu bahasa markup standar yang digunakan untuk membuat dan menyusun halaman web. HTML menggunakan elemen-elemen yang ditandai dengan tag untuk menentukan struktur dan konten halaman web, termasuk teks, gambar, tautan, tabel, dan elemen multimedia lainnya. Dengan HTML, pengembang web dapat membuat halaman web yang dapat diakses melalui browser.

head and body

HTML terdiri dari dua bagian utama, yaitu head dan body. Bagian head berisi informasi tentang halaman web, seperti judul, meta data, dan link ke file CSS atau JavaScript. Bagian body berisi konten utama halaman web yang akan ditampilkan kepada pengguna, termasuk teks, gambar, video, dan elemen interaktif lainnya.

heading

Heading adalah elemen HTML yang digunakan untuk memberikan judul atau subjudul pada halaman web. Heading memiliki enam tingkat, dari h1 hingga h6, dengan h1 sebagai heading terbesar dan paling penting, sedangkan h6 adalah heading terkecil dan paling tidak penting. Heading membantu mengatur struktur konten halaman web dan meningkatkan keterbacaan bagi pengguna.

paragraph

Paragraph adalah elemen HTML yang digunakan untuk menampilkan teks dalam bentuk paragraf. Paragraf ditandai dengan tag

dan biasanya digunakan untuk menyusun konten teks agar lebih mudah dibaca dan dipahami oleh pengguna. Setiap paragraf biasanya memiliki jarak vertikal antara satu sama lain, sehingga menciptakan pemisahan visual yang jelas di halaman web.

sample paragraph: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

list

List adalah elemen HTML yang digunakan untuk menampilkan daftar item dalam bentuk terstruktur. Ada dua jenis list utama dalam HTML, yaitu ordered list (daftar berurutan) yang ditandai dengan tag ol dan unordered list (daftar tidak berurutan) yang ditandai dengan tag ul. Setiap item dalam daftar ditandai dengan tag li. List membantu menyusun informasi secara rapi dan mudah dibaca oleh pengguna.

sample ordered list:

  1. Item 1
  2. Item 2
  3. Item 3

sample unordered list:

Sample of nested list:

link

Link adalah elemen HTML yang digunakan untuk membuat tautan ke halaman web lain, file, atau sumber daya lainnya. Link ditandai dengan tag dan biasanya memiliki atribut href yang menentukan URL tujuan. Ketika pengguna mengklik link, mereka akan diarahkan ke halaman atau sumber daya yang ditentukan. Link merupakan salah satu fitur penting dalam HTML yang memungkinkan navigasi antar halaman web.

sample link: naruto ultimate ninja storm


image

Image adalah elemen HTML yang digunakan untuk menampilkan gambar pada halaman web. Gambar ditandai dengan tag dan biasanya memiliki atribut src yang menentukan lokasi file gambar, serta atribut alt yang memberikan deskripsi alternatif jika gambar tidak dapat ditampilkan. Gambar dapat meningkatkan tampilan visual halaman web dan membantu menyampaikan informasi secara lebih efektif kepada pengguna.

sample image:

Sample Image

script

Script adalah elemen HTML yang digunakan untuk menambahkan fungsionalitas interaktif pada halaman web. Script ditandai dengan tag script dan biasanya berisi kode JavaScript. Script dapat digunakan untuk mengubah konten halaman web secara dinamis, menangani event pengguna, dan melakukan operasi kompleks yang tidak dapat dilakukan hanya dengan HTML dan CSS.

sample script:

canvas

canvas adalah elemen HTML yang digunakan untuk menggambar grafik pada halaman web menggunakan JavaScript.

Your browser does not support the HTML canvas tag.

anchor

anchor adalah elemen HTML yang digunakan untuk membuat tautan ke bagian dalam halaman web atau ke halaman web lain. Anchor ditandai dengan tag dan biasanya memiliki atribut href yang menentukan tujuan tautan.

sample anchor: Go to Canvas

form

form adalah elemen HTML yang digunakan untuk mengumpulkan input dari pengguna. Form ditandai dengan tag

dan biasanya berisi berbagai elemen input seperti teks, tombol, checkbox, radio button, dan lainnya. Form memungkinkan pengguna untuk mengirim data ke server untuk diproses.

sample form:





elements

elements adalah komponen dasar dalam HTML yang digunakan untuk membangun halaman web. Elemen-elemen ini ditandai dengan tag dan dapat memiliki atribut yang memberikan informasi tambahan atau mengubah perilaku elemen tersebut. Contoh elemen HTML termasuk heading, paragraph, list, link, image, form, dan banyak lagi.

sample elements:

Heading 1

This is a paragraph.

table

table adalah elemen HTML yang digunakan untuk menampilkan data dalam bentuk tabel. Table ditandai dengan tag table dan biasanya berisi baris (tr:table row) dan sel (td:table data cell atau th:table header).

sample table:

Name Age
John 25
Jane 30

audio

audio adalah elemen HTML yang digunakan untuk memutar file audio pada halaman web. Audio ditandai dengan tag audio dan biasanya memiliki atribut src yang menentukan lokasi file audio, serta atribut controls yang menampilkan kontrol pemutar audio.

sample audio:

video

video adalah elemen HTML yang digunakan untuk memutar file video pada halaman web. Video ditandai dengan tag video dan biasanya memiliki atribut src yang menentukan lokasi file video, serta atribut controls yang menampilkan kontrol pemutar video.

sample video:

doctype

doctype adalah deklarasi yang digunakan di awal dokumen HTML untuk memberi tahu browser tentang versi HTML yang digunakan. Deklarasi doctype membantu browser merender halaman web dengan benar sesuai dengan standar HTML yang ditentukan.

sample doctype: !DOCTYPE html

inline type

inline type adalah elemen HTML yang digunakan untuk menampilkan teks dalam bentuk inline, artinya elemen ini tidak membuat baris baru dan hanya memakan ruang sebanyak kontennya.

sample inline type: This is an inline element.

block type

block type adalah elemen HTML yang digunakan untuk menampilkan teks dalam bentuk block, artinya elemen ini membuat baris baru dan memakan ruang penuh secara horizontal.

sample block type:

This is a block element.

path defining

path defining adalah elemen HTML yang digunakan untuk mendefinisikan jalur atau lintasan dalam grafik vektor, biasanya digunakan dalam elemen SVG (Scalable Vector Graphics). Path defining memungkinkan pembuatan bentuk kompleks dengan menggunakan perintah dan koordinat.

sample path defining: