Tahukah kamu bahwa HTML sering digunakan oleh sebagian besar website yang ada saat ini? Oleh karena itu, penting buat kamu untuk belajar HTML. Apalagi jika kamu tertarik untuk membuat pemrograman website, HTML menjadi hal pertama yang wajib kamu kenal loh!
HTML atau Hypertext Markup Language mempunyai peran untuk menentukan struktur tampilan dan konten dalam sebuah website. Tentunya HTML tidak bekerja sendiri untuk membangun sebuah website. Diperlukan juga CSS dan JavaScript untuk membuat tampilannya menjadi bagus dan interaktif.
Perlu diketahui bahwa syntax pada HTML selalu dimulai dengan tag di dalam <> dan diakhiri dengan tag </>.
Untuk mempelajari HTML, kamu perlu menyiapkan 2 tools, yaitu aplikasi text editor dan browser. Text editor berfungsi untuk menuliskan syntax dalam proses coding. Sementara browser berguna untuk melihat hasil kode yang sudah dibuat.
Text editor yang disarankan untuk belajar HTML antara lain Sublime, Notepad++, atau Visual Studio Code. Tapi jika kamu belum mempunyai semua aplikasi tersebut, kamu bisa mulai menggunakan Notepad saja. Sementara browser yang disarankan antara lain Firefox, Chrome, atau Edge.
Setelah menyiapkan tools diatas, maka mari kita mulai untuk membuat file HTML pertama kamu. Caranya gampang banget loh! Pertama, buka aplikasi text editor yang tadi sudah disiapkan. Kemudian ketik kode seperti contoh di bawah ini.
<DOCTYPE html>
<html lang="en">
<head>
<title>Belajar Bikin HTML<title>
</head>
<body>
<p>Hallo Dunia!</p>
</body>
</html>
Jika sudah selesai mengetik, simpan file tersebut dengan nama index.html.
Untuk melihat hasilnya, klik dua kali pada file yang sudah kamu buat tadi. Jika muncul pilihan aplikasi, pilihlah browser untuk membukanya. Maka di browser akan tampak “Halo Dunia!”.
Coba perhatikan lagi kode yang sudah kamu ketik di text editor tadi. Di dalamnya terdapat tiga tag penting, yaitu <html>, <head>, dan <body>. Ketiga tag inilah yang menjadi struktur utama atau struktur dasar penyusun HTML.
Deklarasi
Bagian yang pertama adalah deklarasi. Fungsinya untuk menyatakan jenis dokumen beserta dengan tipenya. Contoh di atas menggunakan deklarasi <!DOCTYPE html> yang menandakan bahwa HTML yang digunakan adalah versi 5.
Di bawah tag tersebut ada <html lang=”en”>. Tag <html> wajib ada dalam setiap dokumen HTML. Tanpa tag tersebut, file HTML tidak bisa di compile dan output nya tidak akan tampil di browser. Sementara atribut lang=”en” menyatakan bahwa dokumen yang kamu buat berbahasa Inggris.
Tag <html> ditutup dengan </html>. Namun sebelum itu masih ada dua tag penting yang akan dibahas di bawah ini.
Head adalah kepada dari file HTML. Pembentukan bagian head dimulai ketika kamu mengetik <head> dan diakhiri dengan tag </head>. Bagian head ini dipakai untuk menulis tag yang akan dibaca oleh mesin. Contoh tag tersebut antara lain:
Di bawah head terdapat struktur body yang menjadi inti dari dokumen HTML. Semua konten yang kamu lihat di layar browser berasal dari bagian ini. Tak heran kalau biasanya bagian body ini lebih banyak dibandingkan bagian lainnya.
Penulisan bagian body dimulai dengan tag <body> dan di bagian akhir ditutup dengan </body>. Umumnya, setelah tag </body>, file HTML akan berakhir dan ditutup dengan </html>.
Materi berikutnya yang perlu kamu pahami dalam belajar HTML adalah tag, elemen, serta atribut.
Tag merupakan penanda untuk awalan dan akhiran dari elemen HTML. Tag dibuat menggunakan kurung siku <>. Di dalam kurung tersebut berisi nama tag. Beberapa tag juga memiliki atribut. Contoh tag yang sering dipakai antara lain <head>, <body>, <p>, dan masih banyak lagi.
Setiap tag memiliki penutup yang dibuat menggunakan kurung siku dan garis miring. Contohnya </head>, </body>, dan <p>. Fungsinya adalah untuk mengakhiri elemen.
Pada HTML, elemen merupakan komponen penyusun. Elemen tersusun atas tag pembuka, isi dan penutup. Dalam beberapa kasus juga sering ditambahkan atribut. Contoh elemen bisa kamu lihat di bawah ini.
<p align=”center”>Halo Dunia!<p>
Contoh di atas adalah satu elemen <p> yang memiliki atribut align=”center”. Sementara isinya berupa teks, yaitu Halo Dunia!
Atribut merupakan kata khusus yang ditempatkan di dalam tag pembuka. Istilah lain untuk menyebut atribut adalah modifier karena fungsi mengubah perilaku elemen.
Pada contoh di atas, atribut yang digunakan adalah align=”center”. Fungsinya yaitu mengubah agar tulisan Halo Dunia! ada di bagian tengah layar.
Artikel tentang belajar HTML di atas baru membahas sedikit materi untuk menguasai HTML secara penuh.
Dalam era digital saat ini, Teknologi In...
...........................................
Terdapat beragam bentuk in...
Apa Itu Programmer? Hal-Hal Yang Wajib D...
HTML diciptakan oleh Sir Tim Berners-lee...
informatika merupakan disiplin ilmu yang...
IT adalah singkatan dari "Informati...
Halo teman-teman!Perkembangan teknologi ...
PENGERTIAN DAN FUNGSI HARDWAREHardware a...
IT adalah singkatan dari "Informati...
Perkembangan Komputer dari Masa ke MasaK...
penullis, Azhari JuliansyahPutrajurusan,...
Dalam era digital yang terus berkembang ...
Dalam dunia yang semakin terhubung, meng...
Tahukah kamu bahwa HTML sering digunakan...
Komputer adalah alat yang digunakan untu...
Komputer adalah alat yang digunakan untu...
Ilmu adalah salah satu hal yang paling p...
Teknologi Informasi (IT) telah menjadi b...