Tutorial Sederhana Belajar Html Dengan Notepad

Artikel kali ini akan memberikan contoh sederhana untuk mendukung belajar html dengan notepad.

Ada editor kode profesional lainnya yang dapat Anda gunakan untuk mengedit kode seperti html

  • NotePad ++ (Windows) – GRATIS
  • Adobe Brackets (Windows / Mac) – GRATIS
  • Sublime Text (Windows / Mac) – DIBAYAR

Jika Anda menggunakan Mac dan menginginkan sesuatu yang lebih baik daripada TextEdit, Anda dapat mengunduh Adobe Brackets yang berfungsi di Mac & Windows. Kita akan bekerja pada Windows dan karenanya menggunakan versi dasar Notepad. Kode dalam tutorial ini berfungsi di editor mana pun jadi cukup pilih editor yang Anda sukai dan mari kita mulai.

Membuat halaman pertama Anda di Notepad

Windows
Untuk membuka Notepad di Windows 7 atau lebih awal, klik Mulai -> Semua Program -> Aksesori -> Notepad. Anda juga dapat mengklik Mulai dan mencari “Notepad”.

Mac
Buka TextEdit dan pastikan editor teks diatur ke teks biasa dengan pergi ke Preferensi> Dokumen Baru> pilih teks biasa. Selanjutnya pastikan untuk memeriksa “Tampilkan file html sebagai kode html” dan “Tampilkan file RTF sebagai kode RTF” di bawah “Buka dan Simpan”.

Selanjutnya salin dan tempel kode berikut ke dalam editor:

<! DOCTYPE html>
<html>
<body>

<h1> Judul Pertama Saya </ h1>

<p> Paragraf pertamaku. </ p>

</ body>
</ html>

Menyimpan File HTML

Langkah belajar HTML selanjutnya adalah : simpan file sebagai “index.html” dengan ekstensi HTML. Ini sangat penting jika Anda tidak menambahkan .html ke bagian akhir nama, itu tidak akan berhasil. Catatan: Meskipun .html lebih disukai Anda juga dapat menggunakan .htm tanpa “L”.

Atur Encoding ke UTF-8, yang lebih disukai untuk file html. ANSI encoding hanya untuk karakter AS dan Eropa Barat.

Membuka File HTML di Browser

Selanjutnya, masuk ke folder tempat Anda menyimpan file dan buka di browser Anda. Dalam contoh ini kita akan menggunakan Chrome, tetapi browser modern apa pun harus berfungsi.
CATATAN: Jika Anda mengalami kesulitan membuka file, pastikan Anda telah menyimpannya sebagai .html.

Setelah file dibuka di browser Anda, tampilannya akan seperti ini:

Perhatikan jalur file di Bilah URL
file: /// C: /Users/WebsitesDIY/Desktop/HTML/index.html

Itu adalah path lengkap ke file di komputer Anda.