Tutorial Lengkap Belajar Html # Apa Itu Html?

Html adalah bahasa markup yang digunakan untuk membangun kerangka website.

Jika diibaratkan sebuah rumah, html adalah pondasi, tiang dan atap.

Jika kamu baru mulai mempelajari pengembangan sebuah web, maka mempelajari html adalah hal yang wajib dilakukan.

Semua situs web yang kamu kunjungi diinternet termasuk deretcode.com dibangun dengan html, baik di tulis secara langsung menggunakan html ataupun menggunakan bahasa lain untuk menggenerate kode htmlnya.

Pada tutorial kali ini kita akan belajar cara menulis kode html sesuai aturan w3.org.

Daftar Isi

Apa Itu HTML?
Persiapan Belajar Html
Membuat Dokumen Html Sederhana
- Struktur dan format dasar html
- Menyimpan file dengan ektensi tipe html

Yuk Kita mulai !

Apa Itu HTML?

Html adalah singkatan dari hypertext markup language, yaitu sebuah bahasa yang digunakan untuk membangun sebuah halaman web menggunakan markup atau tag-tag tertentu. Html bukan termasuk bahasa pemrogramman melainkan sebuah bahasa markup yang karena tidak ada algoritma didalamnya.

Html berperan dalam menyusun kerangka dari sebuah halam web.

Dengan html kita dapat mengatur mana header,navbar, content, footer dan lain-lain dari sebuah halaman web.

Jika kita ibaratkan halaman web adalah sebuah rumah maka html adalah kerangkanya dan tag-tag html adalah material penyusunya.

Tutorial Lengkap Belajar Html # Apa Itu Html?

Dalam membangun sebuah halaman web, ada bahasa lain yang juga perlu kita pelajari agar halaman web terlihat lebih menarik dan interaktif.

Yaitu CSS dan JavaScript.

Css memiliki peran dalam mendesain halam web sedangkan javascript bertugas agar halaman web menjadi lebih interaktif dengan menyisipkan fungsi-fungsi tertentu.

Sampai disini saya harap kalian sudah paham kenapa kita perlu mempelajari html.

Persiapan Belajar Html

Untuk belajar html, tools yang diperlukan hanyalah web browser dan text editor.

Cukup itu saja. Kita tidak perlu IDE khusus untuk membuatnya. Karena pada dasarnya kita hanya menulis teks dokumen biasa dengan format html dan kita buka menggunakan web browser.

Text Editor

Kamu bebas menggunakan text editor apapun yang penting bisa kamu gunakan untuk menulis teks. Namun ada beberapa text editor yang akan sangat membantumu dalam menulis kode html.

Seperti notepad++, sublime, visual code, atom dan lain-lain. Saya sendiri lebih sering menggunakan visual code.

Tutorial Lengkap Belajar Html # Apa Itu Html?

Web Browser

Kamu bebas menggunakan web browser manapun.

Pastikan versi yang terbaru, karena pada tutorial kali ini kita akan belajar html5 (versi terbaru saat artikel di tulis).

Seperti Chrome, Firefox, Internet Explorer, Opera, Safari dan yang lainnya

Tutorial Lengkap Belajar Html # Apa Itu Html?

Membuat Dokumen Html Sederhana

Setelah kamu memilih text editor dan web browset favoritemu, sekarang kita praktik membuat dokumen html sederhana.

Buka text editor dan silahkan ketikan kode dibawah ini.

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Belajar Html Dasar</title>
    </head>
    <body>
        <p>Ini Adalah Html Pertamanku!</p>
    </body>
</html>

Kemudian kalian simpan dengan nama bebas dan extensinya .html
Format : [nama file].html
Kemudian kita buka file html tadi menggunakan web browser, maka hasilnya akan seperti berikut

Yups. Kita sudah berhasil membuat halaman web dengan menggunakan html.

Bingung?

Baik saya akan coba jelaskan satu persatu..

Struktur dan format dasar html

Untuk menulis kode html, maka kita perlu mempelajari kerangka dasar dari html yang wajib di tulis,

Tutorial Lengkap Belajar Html # Apa Itu Html?

Jika kita perhatikan gambar diatas, setiap tag selalu di ikuti dengan tag penutup. Ini bertujuan untuk membatasi area dari tag tersebut. Misalnya tag "<p>...</p>", maka tag "<p>" cakupan hanya pada tulisan "Ini Adalah Html Pertamanku!" .

Format html yang di tunjukan pada gambar diatas adalah format baku yang tidak bisa kita rubah strukturnya. Kita bisa saja menulisnya seperti ini,

<html lang="en">
    <body>
        <p>Ini Adalah Html Pertamanku!</p>
    </body>
</html>

Tanpa tag <head> dan browser tetap bisa menampilkannya. Namun ketika kita memeriksanya di validator.w3.org akan muncul error karena tidak sesuai format penulisan html standar.

Jadi ketika ingin menulis kode html, kita harus memulainya dengan struktur html dasarnya. Seperti kode berikut,

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Belajar Html Dasar</title>
        ..Informasi halaman web ketik disini
    </head>
    <body>
        ..Konten halaman web ketikan disini
    </body>
</html>

Menyimpan file dengan ektensi tipe html

Setelah kita membuat dokumen html, wajib hukumnya menyimpannya dalam format .html. Karena jika kita menyimpannya dalam bentuk selain .html, misalnya htmlku.txt , Web browser tidak akan merendernnya dan akan menampilkan isi dari file tersebut, contohnya seperti gambar berikut,

Tutorial Lengkap Belajar Html # Apa Itu Html?

Jadi selalu pastikan kalian menyimpannya dengan extensi type .html.

Kecuali jika kita membuat sebuah halaman dinamis misalanya menggunakan bahasa pemrogramman php, maka extensinya menjadi .php

Setelah kita belajar membuat halaman web html pertaman kita.
Tahap selanjutnya kita akan belajar mengenal tag-tag yang ada di html beserta fungsinya.

Jika kalian merasa artikel ini bermanfaat silahkan klik tombol share dan jika ada hal yang ingin ditanyakan atau disampaikan silahkan tulis di kolom komentar dibawah