ภาษา HTML และ เท็กซ์อิดิเตอร์

1. ภาษา HTML และ เท็กซ์อิดิเตอร์

ความหมายของ HTML

HTML หรือ HyperText Markup Language เป็นภาษาคอมพิวเตอร์รูปแบบหนึ่ง ที่มีลักษณะเป็นภาษาในเชิง การบรรยายเอกสารไฮเปอร์มีเดีย (Hypermedia Document Description Language) เพื่อนำเสนอเอกสารนั้น เผยแพร่ในระบบเครือข่ายอินเตอร์เน็ต มีโครงสร้างการเขียน ที่อาศัยตัวกำกับ เรียกว่า แท็ก (Tag) ควบคุมการแสดงผลของข้อความ, รูปภาพ หรือวัตถุอื่นๆ ผ่านโปรแกรมเว็บเบราเซอร์ (Web Browser)

Tag

Tag เป็นลักษณะเฉพาะของภาษา HTML ใช้ในการระบุรูปแบบคำสั่ง หรือการลงรหัสคำสั่ง HTML ภายในเครื่องหมาย less-than bracket ( < ) และ greater-than bracket ( > ) โดยที่ Tag HTML แบ่งได้ 2 ลักษณะ คือ

· Tag เดี่ยว

เป็น Tag ที่ไม่ต้องมีการปิดรหัส เช่น <P>, <BR> เป็นต้น

· Tag คู่

เป็น Tag ที่ประกอบด้วย Tag เปิด และ Tag ปิด โดย Tag ปิด จะมีเครื่องหมาย slash ( / ) นำหน้าคำสั่งใน Tag นั้นๆ เช่น <B>…</B>, <BLINK>…</BLINK> เป็นต้น

โครงสร้างเอกสาร HTML

ไฟล์เอกสาร HTML ประกอบด้วยส่วนประกอบสองส่วนคือ Head กับ Body โดยสามารถเปรียบเทียบได้ง่ายๆ ก็คือ ส่วน Head จะคล้ายกับส่วนที่เป็น Header ของหน้าเอกสารทั่วไป หรือบรรทัด Title ของหน้าต่างการทำงานในระบบ Windows สำหรับส่วน Body จะเป็นส่วนเนื้อหาของเอกสารนั้นๆ โดยทั้งสองส่วนจะอยู่ภายใน Tag <HTML>…</HTML>

การเขียนโปรแกรมด้วยภาษา HTML จะมีโครงสร้างหลักและการจัดวางคำสั่งหลักที่เป็นมาตรฐานเหมือนกันทั่วโลก โดยจะประกอบด้วยคำสั่งหลัก ๆ อยู่ 4 คำสั่งด้วยกันดังนี้

1. <HTML>……….</HTML> เป็นคำสั่งหลักที่ทำหน้าที่บอกจุดเริ่มต้นและจุดสิ้นสุดของเอกสาร HTML

2. <HEAD>……….</HEAD> เป็นคำสั่งที่ทำหน้าที่กำหนดส่วนหัวเรื่อง

3. <TITLE>……….</TITLE>เป็นคำสั่งที่ใช้กำหนดข้อความที่ต้องการนำมาแสดงผลบนแถบ Title bar คำสั่งนี้จะอยู่ภายในคำสั่งส่วน <HEAD>……….</HEAD> โดยกำหนดความยาวของตัวอักษรไม่เกิน 64 ตัวอักษร

4. <BODY>……….</BODY>เป็นคำสั่งที่กำหนดข้อความและรูปแบบของคำสั่งต่าง ๆ ที่ใช้สำหรับปรับแต่งเอกสารที่จะนำเสนอออกทางจอภาพ

เท็กซ์อิดิเตอร์ (Text Editor)

Text Editor (เท็กซ์อิดิเตอร์) คือ โปรแกรมที่ใช้สำหรับสร้างและแก้ไขข้อความในการสร้างเว็บเพจด้วยภาษา HTML นั้นต้องมีเครื่องมือที่ใช้ในการเขียน และแก้ไขตัวอักษรซึ่งเป็นคำสั่งต่าง ๆปัจจุบันมี โปรแกรม Text Editor หลายโปรแกรม เช่น NotePad, EditPlus หรือโปรแกรม Dreamweaver ซึ่งมีคุณสมบัติเป็นทั้งโปรแกรมสำเร็จรูปในการสร้างเว็บเพจด้วย ในบทเรียนชุดนี้ จะใช้โปรแกรม Notepad ในการสร้างเว็บเพจด้วยภาษา HTML

เริ่มสร้างเว็บเพจด้วย NotePad

การสร้างเอกสาร HTML หรือเว็บเพจ เป็นเรื่องที่ง่ายและสะดวก เพียงแต่เปิดโปรแกรม NotePad <Start, Progra, Accessories, NotePad> แล้วพิมพ์คำสั่ง HTML ลงไป จากนั้นก็ทำการจัดเก็บไฟล์โดยตั้งชื่อเป็นภาษาอังกฤษ ตัวพิมพ์เล็ก และกำหนดนามสกุลเป็น .html (ในตอนพิมพ์ชื่อไฟล์ แนะนำให้พิมพ์ชื่อและนามสกุลของไฟล์ไว้ในเครื่องหมายคำพูด เพื่อป้องกันมิให้โปรแกรม NotePad เติมนามสกุล .txt ต่อท้าย) จากนั้นก็เปิดโปรแกรมเบราเซอร์ เช่น IE หรือ Firefox แล้วเปิดไฟล์เอกสารเว็บที่สร้าง เพื่อดูผล

<HTML>

<HEAD>

</HEAD>

<BODY>

...............

</BODY>

</HTML>

คำสั่งในการเริ่มต้นในการสร้างเว็บเพจ

คำสั่งเริ่มต้น

คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรมและคำสั่ง </HTML> เป็นการสิ้นสุดโปรแกรม HTML คำสั่งนี้จะไม่แสดงผลในโปรแกรมเว็บเบราเซอร์ แต่ต้องเขียนเพื่อให้เกิดความเป็นระบบของงาน และเพื่อจะให้รู้ว่าเอกสารนี้เป็นเอกสารของภาษา HTML

ส่วนหัวของโปรแกรม

คำสั่ง <HEAD> เป็นคำสั่งที่ใช้กำหนดข้อความในส่วนที่เป็นชื่อเรื่องของไฟล์ HTML และภายในคำสั่ง <HEAD>...</HEAD> จะมีคำสั่งย่อยอีกคำสั่งหนึ่งคือ <TITLE>........</TITLE>

กำหนดข้อความในส่วนหัวของโปรแกรมหรือไตเติลบาร์

คำสั่ง <TITLE> เป็นคำสั่งที่แสดงชื่อของเอกสาร หรือชื่อเรื่องของไฟล์ HTML ซึ่งข้อความภายในคำสั่งจะปรากฎหรือแสดงผลในส่วนของไตเติลบาร์(Title Bar) ของโปรแกรมเว็บเบราเซอร์ แต่จะไม่แสดงในส่วนของการแสดงผลในโปรแกรมเว็บเบราเซอร์

ส่วนเนื้อหาของเว็บเพจ

คำสั่งนี้เป็นส่วนที่สำคัญในการแสดงผลในเว็บเบราเซอร์ ซึ่งจะประกอบไปด้วยตัวอักษร รูปภาพกราฟิกต่างๆ

Google Sites

Report abuse