Hai temen-temen, pada artikel sebelumnya kita sudah mempersiapkan web browser dan text editor, bagi yang belum mempersiapkannya silahkan bacar artikelnya yaitu mempersiapkan web browser dan text editor.
Selanjutnya buka text editor temen-temen, saya sendiri menggunakan text editor Atom. setelah temen-temen buka, klik file lalu pilih new untuk membuat sebuah file baru. Lalu temen tulis kode dibawah ini.
Setelah sudah temen-temen tulis. simpan file tersebut dengan cara klik file lalu pilih save atau temen-temen bisa tekan ctrl+s stelah itu tentukan di folder mana temen-temen ingin menympan lalu buat nama filenya terserah temen-temen namun diakhirnya ditambah dengan .html ini adalah format dokumen pada dokumen html.
Setelah itu coba buka file yang temen simpan tadi di folder tempat temen-temen menyimpan. Buka di web browser yang ada pada komputer temen-temen. dan lihat hasilnya di web browser tersebut.
kode-kode yang telah temen-temen tulis diatas adalah struktur dasa dari sebuah dokumen HTML. dimana terdiri dari <!DOCTYPE html>, <html></html>, <head></head>, <title></title>, <body></body>, <h1></h1> dan <p></p>. Sekarang kita mau bahas sedikit tentang tag-tag tersebut.
1. <!DOCTYPE html>
Sering disebut sebagai DTD (Document Type Declaration). Fungsi dari DTD ini adalah untuk menginformasikan web browser tentang aturan penulisan dari suatu dokument. Selain itu DTD juga bisa menginformasikan versi html berapa yang kita gunakan, disini kita meggunakan versi HTML5.
2. <html>
Struktur kedua adalah tag <html>, tag ini berfungsi sebagai pembungkus dari seluruh kode-kode html lainnya. tag pembuka html (<html>) berada di paling atas setelah DTD dan tag penutup html (</html) berada dipaling bawah document html.
3. <head>
Selanjutnya adalah tag <head>, tag ini adalah sebagi tempat untuk menampung tag-tag html yang umumnya tidak terlihat di web browser. Tag-tag yang ada didalam <head> berfungsi untuk memberikan informasi tentang document html yang sedang dijalankan, atau memberi referensi ke file lain seperti file css dan javascript. contohnya untuk memanggil file css kita menggunakan tag <link> didalam taga <head>.
4. <meta>
Tag <meta> merupakan singkatan dari metadata. Dimana metadata adalah suatu data yang berisi informasi tentang suatu document. Salah satu tag <meta> adalah <meta charset="UTF-8"> . Tag ini akan mengintruksikan web browser untuk menggunakan karakter UTF-8 saat menjalankan halaman HTML tersebut.
5. <title>
Tag title adalah salah satu dari sedikit tag yang ada dalam tag <head> yang akan terlihat di web browser. Tag ini berfungsi untuk membuat title dari sebuah halaman website. title ini akan tampil di bagian atas jendel web browser.
6. <body>
Tag body ini berfungsi sebagai penampung dari semua kode-kode html yang akan tampil di web browser. Jadi di dalam body ini lah kita menuliskan konten-konten website kita.
7. <h1> dan <p>
Kedua tag ini adalah tag yang sering digunkan. fungsi dari tag <h1> adalah untuk membuat judul. dan tag <p> berfungsi untuk membuat suatu paragraf.
Sampai sini dulu pembahasan kita tentang struktur dasar html, artikel selanjutnya tentang Mengenal tag, attribut, dan elemen HTML
Tidak ada komentar