|
HTML > HTML Tutorial
แนะนำ HTML
อะไรคือไฟล์ HTML?
- HTML ย่อมาจาก Hyper Text Markup Language
- ไฟล์ HTML เป็นไฟล์ข้อความที่เก็บแท็ก markup (markup tag) ขนาดเล็ก
- แท็ก markup บอก browser ถึงการแสดงผลเพจ
- ไฟล์ HTML ต้องมีนามสกุล htm หรือ html
- ไฟล์ HTML สามารถสร้างโดยการใช้ text editor อย่างง่าย
ทดลองสร้างไฟล์ HTML
ถ้ากำลังใช้ Window ให้เปิดโปรแกรม Notepad
ถ้าอยู่บน Mac ให้เปิดโปรแกรม SimpleText
ใน OSX เปิดโปรแกรม TextEdit และเปลี่ยน preferences ตามนี้ เปิดเมนู Format และเลือก Plain text แทนที่ Rich text จากนั้นเปิด window ของ Preferences ภายใต้เมนู Text Edit และเลือก Ignore rich text commands in HTML files คำสั่ง HTML อาจจะไม่ทำงาน ถ้าไม่มีการเปลี่ยน preferences ข้างต้น
พิมพ์ข้อความตามนี้
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage. <b>This text is bold</b>
</body>
</html> |
บันทึกไฟล์เป็น "mypage.htm"
เปิด Internet browser เลือก Open (หรือ Open Page) ในเมนู File ของ browser จะปรากฎกล่องไดอะล๊อก เลือก Browse (หรือ Choose File) และค้นหาไฟล์ HTML ที่สร้างขึ้น (ในที่นี้คือ mypage.htm) เลือกไฟล์และคลิก Open ขณะนี้ จะเห็นที่อยู่ในกล่องไดอะล๊อก ตัวอย่างเช่น "C:\MyDocuments\mypage.htm" คลิก OK และ browser จะแสดงเพจนี้
อธิบายตัวอย่าง
แท็กแรกในเอกสาร HTML คือ <html> แท็กนี้บอก browser ว่านี่เป็นการเริ่มต้นเอกสาร HTML แท๊กสุดท้ายในเอกสารคือ </html> แท็กนี้บอก browser ว่านี่เป็นการสิ้นสุดเอกสาร HTML
ข้อความระหว่างแท๊ก <head> และแท็ก </head> เป็นสารสนเทศส่วนหัว สารสนเทศนี้ไม่ได้แสดงผลบน browser
ข้อความระหว่างแท็ก <title> เป็นไตเติลของเอกสาร ไตเติลได้รับการแสดงในหัวข้อ (caption) ของ browser
ข้อความระหว่างแท็ก <body> เป็นข้อความที่จะแสดงใน browser
ข้อความระหว่างแท็ก <b> กับ </b> จะได้รับการแสดงเป็นฟอนต์ตัวหนา
นามสกุล HTM หรือ HTML?
เมื่อบันทึกไฟล์ HTML สามารถใช้ได้ทั้ง .htm หรือ .html ตัวอย่างนี้ใช้เป็น htm นี่อาจจะเป็นนิสัยที่ไม่ดีจากอดีตที่การใช้ซอฟแวร์ยอมให้เฉพาะนามสกุล 3 ตัวอักษร ด้วยซอฟแวร์ใหม่กว่าจะปลอดภัยอย่างสมบูรณ์ในการใช้ .html
หมายเหตุกับ HTML Editor
การแก้ไขไฟล์ HTML ด้วยการใช้ editor แบบ WYSIWYG (what you see is what you get) เช่น FrontPage หรือ Dreamweaver แทนที่การเขียนด้วยแท็ก markup ในไฟล์ข้อความอย่างง่าย
อย่างไรก็ตาม ถ้าต้องการเป็นนักพัฒนาเว็บชำนาญการ ขอแนะนำให้ใช้ plain text editor เพื่อเรียนรู้ HTML
|
