Setelah kita mengetahui cara membuat dan menjalankan file yang berkstensi html, pada artikel yang akan saya bahas adalah mencakup dasar kita yang harus kita ketahui dalam mempelajari html. Bahasa HTML adalah bahasa yang struktur sehingga dalam penulisannya kode kode yang kita buat harus tau apa yang kita tulis apa yang dimaksud dalam tulisan tersebut. Terdapat bagian bagian penting yang kalian ketahui sebelumnya, yaitu dasar penulisan dan struktur html. Pada artikel ini saya akan mengenalkan komponen yang terdapat pada html seperti Tag, Attribut, dan Elemen. Setelah memahaminya akan langsung di lanjut dengan mengenalkan struktur dasar html. Berikut penjelasan materi :
Dasar HTML
Perlu kita ketahui bahwa HTML juga memiliki bagian bagian yang tak dapat terpisah, banyak kode kode yang kita tulis di HTML berupa Tag, Attribut dan Elemen. Mengapa kita membahas mereka bertiga dulu baru masukke struktur ?? Siapa sebenarnya mereka bertiga ??
AE-Ducation menjawabnya mengapasih kok belajar dasar dari tag, attribut dan elemen baru ke struktur, jawabannya adalah karena dalam menuliskan struktur hatml nanti AE-Ducation akan langsung masuk juga dalam penulisan paragraf dan symbol lainnya yang dapat ditulis berupa tag, attribut, dan elemen. Sekarang sudah mengertikah??
Tag, Attribut dan Elemen mengambil peran penting dalam penulisan html. Ketiga memiliki fungsi dan tujuan yang berbeda di struktur html.
Teruss Siapa mereka itu?? AE-Ducation akan menjelaskan dengan menggunakan subjudul di bawah ini satu persatu dengan jelas, OKE.
Berkenalan dengan Tag
Dalam menjalankan sebuah kode dibutuhkan web browser, dan web browser tersebut mengartikan bahasa yang sudah tertulis dengan rapih di mana dalam penulisannya html memiliki tanda yang dapat diartikan atau diterjemahkan oleh web browser dengan rapih tanpa ada kesalahan sesuai kestandarisasi HTML. Biasanya Tag ini bertujuan untuk membuat paragraf, judul, list, tabel, dan lainnya.
Dalam penulisannya Tag di dalam HTML memiliki beberapa aturan yang berbeda dalam setiap tanda :
- •Penulisan Tag ditulis dengan memasukkan kode tertentu diantara tan “<” dan “>”.
- Dalam penulisannya, hampir semua Tag memiliki pasangan yaitu pembuka dan penutup, biasanya pada tag penutup terdapat perbedaan yaitu penambahan tanda forward slash (/). Penulisan Tag <tag pembuka> Objek atau Tujuan <tag penutup>
Sebagai contoh disini saya akan menggunakan sebuah tanda tag yang berarti sebuah paragraf “<p>” dan ditutup dengan “</p>”. Misal :
<p>Saya Belajar HTML di AE-Ducation.</p>
Pada contoh di atas memiliki penulisan yang sederhana, pada contoh selanjutnya saya akan menggabungkan beberapa tag dalam satu penulisannya.
<p>Saya Belajar HTML di AE-Ducation.<i>Dalam mempelajarinya AE-Ducation memberikan secara jelas.</i></p>
Pada contoh di atas tag “<i>” memiliki arti bahwa ojek yang berada di tengah tag ini ditulis dengan huruf italic atau miring. Meskipun masih banyak tag pada HTML yang akan dijelaskan secara terpisah dan jelas di lain artikel. Silahkan download terlebih dahulu tag tag yang terdapat pada HTML yang sudah saya rangkum pada satu file.
Berkenalan dengan Elemen
Setelah belajar tentang tag, ternyata hal yang sangat berkaitan dengan tag adalah sebuah elemen. Pasti belum tau kan bahwa objek yang kita tulis pada sebuah tag yang terletak diantara tanda tag ternyata adalah sebuah elemen. Yeaa, bener sekali buat kalian yang menjawab bahwa Elemen adalah isi dari dari sebuah tag. Misal ni ada sebuah tag seperti ini :
<p>Saya Belajar HTML di AE-Ducation.</p>
Maka Elemen atau Isi dari sebuah tag adalah Saya Belajar HTML di AE-Ducation. Mengerti kan??
Berkenalan dengan Attibut
Attribut merupakan sebuah tanda yang diartikan sebagai tanda informasi tambahan yang dapat terletak di tag atau elemen pada HTML. Dalam penulisannya di dalam HTML, attribut memiliki format penulisan setelah “<tap pembuka” sehingga penulisannya akan menjadi :
<tag name=”value”>
Pada format diatas dituliskan name=”value”, apakah artinya?
Pada attribut terdapat name, ini berarti nama informasi tambahan yang akan kalian masukan dalam sebuah tag di HTML. Sedangkan untuk “value” sendiri memiliki arti nilai yang terdapat dalam sebuah nama tersebut. Untuk cara penggunaannya sendiri attribut sebagai berikut :
<a href="https://www.ae-ducation.blogspot.com">AE-Ducation | Situs Belajar Online</a>
Pada contoh di atas memiliki makna bahwa bahwa tag yang saya gunakan (<a>) adalah sebuah hyperlink di mana AE-Ducation | Situs Belajar jika anda tekan nanti akan beralih ke https://www.ae-ducation.blogspot.com. Sementara untuk arti attributnya adalah href= sebagai name dan https://www.ae-ducation.blogspot.com sebagai nilainya. Sampai disini mengerti??
Jika telah mengerti sampai disini kalian dapat melanjutkan ke bawah, Lanjut ke Dasar Struktur HTML.
Struktur Dasar HTML
<html>
<head>
<title>AE-Ducation</title>
</head>
<body>
<h1>Situs Belajar Online</h1>
<p>Saya Belajar HTML di AE-Ducation</p>
</body>
</html>
Keterangan Tag pada Struktur HTML sederhana di atas adalah sebagai berikut :
- <! DOCTYPE html> bertujuan untuk mendefinisikan dokumen menjadi HTML
- Tag <html> adalah tag yang mengambil peran penting dari halaman HTML sebagai tag pembuaka dan penutup dari file HTML
- Tag <head> berisi informasi meta tentang dokumen
- Tag <title> bertujuan memberikan sebuah judul untuk dokumen
- Tag <body> berisi konten halaman yang terlihat
- Tag <h1> mendefinisikan heading besar
- Tag <p> mendefinisikan sebuah paragraf yang akan dijabarkan
Pada contoh struktur HTML di atas, struktur dasar yang digunakan pada HTML. Dengan menambah tag tag lainnya maka akan tercipta sebuah HTML yang ada saat ini. Jika ada yang belom jelas silahkan ulangi membaca artikel mulai dari atas dan apabila belom jelas juga silahkan tanya melalui kolom komentar.
Download Materi
AE-Ducation selain menyampaikan informasi secara online, kami juga memasang pengaman anti copas dan mematikan fitur lain sehingga kami menyediakan link download yang telah dibahas diatas dengan gratis👇
Nice artikel :)
BalasHapus