Cara membuat dokumen file html sederhana
Dokumen html adalah sebuah format extensi file .html atau .htm dan mempunyai struktur dokumen html. B
Persiapan
Untuk membuat dokumen file HTML sebenarnya sangat mudah. Pertama-tama kita harus mempersiapkan sebuah peralatan yang akan kita pakai seperti Browoser. Berikut listnya:
- Google Chrome
- Internet Explored
- Mozilla Firefox
- Safari
- Opera
- dan yang lainnya.
Persiapkan juga teks editor seperti:
- Notepad
- Notepad++
- Sublime Text
- Atom
- Visual Studio Code
Sangat disarankan jika Anda baru belajar HTML jangan menggunakan teks editor profesional seperti Sublime text, Visual Studio Code, Atom, Notepad++ dan yang lainnya.
Membuat dokumen file HTML
Selanjutnya, untuk membuat sebuah dokumen file HTML cukup dengan empat langkah sederhana saja, Berikut langkah-langkah yang harus Anda ikuti:
Langkah 1: buka notepad
Untuk pengguna Windows 8 atau ke atas:
Buka Layar Start (gambar jendela di bagian kiri bawah pada layar Anda). Ketik Notepad .
Untuk pengguna Windows 7 atau sebelumnya:
Buka Start > Programs> Accessories> Notepad
Langkah 2: menulis tag HTML
<!DOCTYPE html>
<html>
<head>
<title>Judul post</title>
</head>
<body>
<h1>Hello Word</h1>
<p>Paragraf pertama.</p>
</body>
</html>Berikut penjelasan disetiap baris code:
<!DOCTYPE html>
mendefinisikan jenis dokumen HTML.<html>
mendefinisikan elemen akar pertama pada halaman HTML.<head>
mendefinisikan berisi informasi header pada dokumen HTML.<title>
mendefinisikan judul halaman untuk dokumen HTML.</title>
penutup tag title.</head>
penutup tag head.<body>
mendefinisikan berisi konten halaman yang akan terlihat.</body>
penutup tag body.</html>
penutup tag html.
Silakan Anda salin script di atas ke di file kosong dikomputer Anda.
Langkah3: Simpan file HTML
Simpan file yang tadi Anda buat: Pilih File> Save as.
Nama filenya bebas asal menggunakan extensi .html atau .htm sebagai contoh: “index.html” tanpa tanda kutip
Langkah 4: buka file HTML dengan browser
Buka file HTML yang tadi Anda buat dengan browser seperti: Google, Mozilla, Opera dll.
Hasilnya akan terlihat seperti ini:
Daftar ringkasan
| Elemen | Kegunaanya |
|---|---|
| <!DOCTYPE html> | mendefinisikan jenis dokumen HTML |
| <html> | mendefinisikan elemen akar pertama pada halaman HTML |
| <head> | mendefinisikan berisi informasi header pada dokumen HTML |
| <title> | mendefinisikan judul halaman untuk dokumen HTML |
| </title> | penutup tag title |
| </head> | penutup tag head |
| <body> | mendefinisikan berisi konten halaman yang akan terlihat |
| </body> | penutup tag body |
| </html> | penutup tag html |