Cara Kerja HTML: Panduan Lengkap Bagi Pemula

Cara Kerja HTML: Panduan Lengkap Bagi Pemula

HTML merupakan salah satu bahasa markup yang digunakan untuk membangun halaman web. Untuk bisa memahami cara kerja HTML, sangat penting bagi kita untuk memulainya dari dasar. Hal ini sangat berguna, terutama bagi pemula yang ingin belajar membuat website menggunakan bahasa HTML. Pada artikel ini, kita akan membahas cara kerja HTML secara lengkap bagi pemula.

Apa itu HTML?

HTML atau singkatan dari Hypertext Markup Language adalah bahasa markup yang digunakan untuk membuat halaman web. HTML sendiri sudah dikenal sejak tahun 1989 dan terus berkembang hingga saat ini. Kode HTML terdiri dari tag-tag yang memberitahu browser bagaimana cara menampilkan halaman web tersebut.

1. Text editor

Dalam pembuatan halaman web menggunakan HTML, kita memerlukan text editor. Beberapa text editor populer yang biasanya digunakan adalah Notepad, Sublime Text, dan Visual Studio Code. Setelah kita memilih text editor, kita bisa mulai mengetik atau menyalin kode HTML ke dalam text editor tersebut.

2. Struktur dasar HTML

Struktur dasar HTML terdiri dari dua bagian, yaitu head dan body.

Head adalah bagian yang berisi metadata tentang dokumen HTML, seperti judul halaman, deskripsi, meta tag, dan file CSS yang digunakan. Body adalah bagian yang berisi konten atau isi dari halaman web.

3. Struktur tag HTML

Berikut adalah struktur tag HTML yang terdiri dari tag pembuka dan tag penutup:

– Pembuka tag:
– Penutup tag:

Contohnya, tag untuk membuat paragraf adalah

. Jadi, untuk membuka paragraf, kita menggunakan

dan untuk menutupnya, kita menggunakan

.

4. Komentar HTML

Komentar dalam HTML digunakan untuk memberikan penjelasan kepada developer atau designer mengenai kode HTML yang dibuat. Komentar dibuat dengan menggunakan tanda sebelum dan setelah kalimat yang ingin dikomentari.

Contoh:

5. Membuat tautan HTML

Tautan atau hyperlink dalam HTML digunakan untuk menghubungkan halaman web satu dengan yang lainnya. Tag untuk membuat tautan adalah .

Contoh:

Klik disini untuk membuka halaman Contoh

Di sini, href digunakan untuk menunjukkan alamat URL dan teks yang berada di antara tag dan adalah teks yang akan ditampilkan dengan tampilan tautan.

6. Menambahkan gambar dalam HTML

Gambar adalah elemen penting pada sebuah halaman web. Tag yang digunakan untuk menambahkan gambar adalah .

Contoh:

contoh gambar

Di sini, src digunakan untuk menunjukkan alamat URL gambar dan alt digunakan untuk memberikan deskripsi singkat mengenai gambar.

7. Membuat daftar HTML

Ada dua jenis dasar daftar HTML, yaitu ordered list dan unordered list. Ordered list menggunakan angka atau huruf untuk memberikan nomor urut, sedangkan unordered list menggunakan simbol seperti bola atau tanda hubung sebagai penanda.

Contoh ordered list:

  1. Daftar item 1
  2. Daftar item 2
  3. Daftar item 3

Contoh unordered list:

8. Menggunakan CSS dalam HTML

CSS atau Cascading Style Sheets digunakan untuk mengatur tampilan atau styling pada halaman web. CSS dapat digunakan melalui file eksternal atau digunakan secara langsung pada halaman HTML dengan menuliskannya dalam tag .

Contoh penggunaan CSS internal:

body {
background-color: lightgrey;
}
h1 {
color: blue;
}
p {
font-size: 18px;
font-weight: bold;
}

Di sini, kita mengatur background, warna, ukuran font, dan ketebalan font pada tag yang digunakan.

Kesimpulan

Dalam artikel ini, kita telah membahas cara kerja HTML secara lengkap bagi pemula. Kita memulainya dengan membahas apa itu HTML, kemudian kita membahas struktur dasar HTML, struktur tag HTML, komentar HTML, membuat tautan HTML, menambahkan gambar dalam HTML, membuat daftar HTML, dan terakhir kita juga membahas CSS dalam HTML.

Sekarang Anda sudah memiliki pemahaman dasar mengenai HTML untuk membuat halaman web. Jangan takut untuk mencoba dan berlatih membuat halaman web menggunakan bahasa markup HTML. Semakin sering anda berlatih, semakin anda menguasai HTML. Terakhir, kami ucapkan sampai jumpa kembali di artikel menarik lainnya.