Pengenalan HTML: Membangun Dasar-Dasar Website Anda
Pengembangan web adalah seni mengubah ide menjadi kenyataan digital. Sebagai langkah pertama dalam perjalanan ini, pemahaman dasar HTML sangat penting. HTML, singkatan dari Hypertext Markup Language, adalah bahasa markah yang digunakan untuk membuat struktur dasar halaman web.
Apa Itu HTML?
HTML adalah fondasi dari hampir setiap halaman web di internet. Ini adalah bahasa markah yang digunakan untuk mengorganisir dan menyusun konten di dalam browser. Setiap elemen dalam HTML memiliki makna dan fungsi tertentu, dan dengan menggabungkannya, Anda dapat membuat halaman web yang kaya dan informatif.
Struktur Dasar HTML
Sebelum kita memulai, mari kita lihat struktur dasar dari setiap halaman HTML:
<html> <head> <title>Judul Halaman Anda</title> </head> <body> <!-- Konten Halaman Web Anda Akan Ditempatkan Di Sini --> </body> </html>
Mari kita bahas setiap bagian dengan lebih detail:
<!DOCTYPE html>: Mendefinisikan jenis dokumen dan versi HTML yang digunakan (HTML5 pada contoh di atas).<html>: Mengawali elemen HTML utama yang menyeliputi seluruh halaman.<head>: Berisi informasi meta, tautan ke stylesheet (CSS), dan elemen lain yang tidak terlihat oleh pengguna.<title>: Menentukan judul halaman yang akan ditampilkan di tab browser.<body>: Menyertakan semua konten yang akan ditampilkan di halaman web.
Menggunakan Elemen HTML Dasar
Mari kita tambahkan beberapa elemen HTML dasar ke dalam <body> untuk membuat halaman yang sederhana namun lengkap:
<html> <head> <title>Halaman Web Sederhana</title> </head> <body> <header> <h1>Selamat Datang di Halaman Saya</h1> </header> <section> <h2>Tentang Saya</h2> <p>Saya adalah pengembang web yang passionate tentang menciptakan pengalaman digital yang luar biasa.</p> </section> <footer> <p>© 2023 Nama Anda. Hak Cipta Dilindungi.</p> </footer> </body> </html>
Dalam contoh ini, kita menggunakan elemen seperti <header>, <h1>, <section>, <p>, dan <footer>. Masing-masing memiliki peran tertentu dalam membangun struktur halaman web dan memberikan makna kepada kontennya.
Menyematkan Gambar dan Tautan
HTML juga memungkinkan kita menyematkan gambar dan membuat tautan. Berikut adalah contohnya:
<html> <head> <title>Halaman Web dengan Gambar dan Tautan</title> </head> <body> <header> <h1>Selamat Datang di Halaman Saya</h1> </header> <section> <h2>Tentang Saya</h2> <p>Saya adalah pengembang web yang passionate tentang menciptakan pengalaman digital yang luar biasa.</p> <img src="profil.jpg" alt="Foto Profil Saya"> </section> <footer> <p>© 2023 Nama Anda. Hak Cipta Dilindungi.</p> <a href="https://www.situsanda.com">Kunjungi Situs Saya</a> </footer> </body> </html>
Dengan menambahkan elemen <img> untuk gambar dan <a> untuk tautan, halaman web Anda menjadi lebih interaktif.
Kesimpulan
Ini adalah pengantar singkat tentang HTML, bahasa yang mendasari pembuatan halaman web. Dengan memahami dasar-dasarnya, Anda dapat membangun struktur yang kuat untuk website Anda. Berikutnya, Anda dapat memperdalam pengetahuan Anda dengan mempelajari CSS untuk tata letak dan gaya, serta JavaScript untuk interaktivitas dinamis. Selamat belajar, dan selamat membangun web!
source : https://www.w3tutor.online/
