โปรแกรมเขียน HTML (Editors)

รู้จักกับโปรแกรมเขียนโค้ด

โปรแกรมสำหรับเขียนโค้ด ทั่วไปเราจะเรียกว่าโปรแกรมประเภท Text Editor คือ โปรแกรมที่ใช้ในการแก้ตัวอักษร เพราะโค้ดโปรแกรมก็คือตัวอักษรธรรมดา
มีหลากหลายระดับตั้งแต่ระดับ Basic ไปถึงระดับ Professional หรือที่เรียกว่า IDE (Integrated Development Environment)
ระดับ Basic ได้แก่ Notepad, Dreamwaver EditPlus เป็นต้น
ระดับ IDE ได้แก่ Sublime Text, NetBeans, Eclipse, Visual Studio Code เป็นต้น ประเภทนี้จะมีฟังก์ชั่นต่างๆ ที่ทำให้เขียนโปรแกรมได้ง่ายขึ้น

อย่างไรก็ตาม การเริ่มต้นเรียนรู้ HTML เราแนะนำให้ใช้ Notepad (PC) หรือ TextEdit (Mac) ไปก่อน

สำหรับ Window 8 หรือหลังจากนั้น

กดที่ปุ่ม Start (สัญลักษณ์ Window ที่ล่างซ้ายของจอ) จากนั้นพิมพ์ Notepad

สำหรับ Window 7 หลังก่อนหน้านั้น

กดที่ปุ่ม Start > Programs > Accessories > Notepad

เปิด Finder > Applications > TextEdit

เปลี่ยนค่าใน Preferences เพื่อให้บันทึกไฟล์ได้ถูกต้อง เข้าไปใน Preferences > Format > เลือก "Plain Text"

ใต้ปุ่ม "Open and Save" เช็คกล่องที่มีคำว่า "Ignore rich text commands in HTML files"

จากนั้นเปิดไฟล์ใหม่ เพื่อเริ่มเขียนโค้ด

เขียนหรือคัดลอกโค้ด HTML ลงไปใน Notepad


<!DOCTYPE html>
<html>
<body>
<h1>This is header</h1>
<p>This is paragraph</p>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

บันทึกไฟล์ลงบนคอมพิวเตอร์ของคุณ โดยการกดไปที่ File > Save As ในเมนูบาร์ของ Notepad

ตั้งชื่อไฟล์ "index.htm" และตั้งค่า Encoding เป็น UTF-8

ไฟล์นามสกุลจะเป็น .htm หรือ .html ก็ได้ไม่ต่างกัน

เปิดไฟล์ HTML ที่บันทึกไว้ด้วยเบราว์เซอร์ที่คุณคุ้นเคย (ดับเบิ้ลคลิกที่ไฟล์ หรือ คลิกขวา แล้วเลือก "Open with")

ผลลัพธ์จะออกมาแบบนี้