รูปเเบบของคำสั่ง HTML
ภาษา HTML นั้นไม่ได้มีรูปแบบเป็นภาษาคอมพิวเตอร์ ที่ยากจะเข้าใจ เช่น ภาษา C, Pascal, Java เป็นต้น เพราะภาษา HTML มีรูปแบบคำสั่งง่ายๆ คล้ายกับภาษาที่ใช้กันอยู่ทั่วๆไป เป็นรูปแบบตายตัว และเข้าใจง่าย โดยภาษา HTML นั้น จะมีการใช้คำสั่งอยู่ภายใต้ เครื่องหมาย < > และจะใช้ เครื่องหมาย / เพื่อจบคำสั่งนั้นๆ โดยหลักในการเขียนเว็บเพจนั้นผมขอเสนอแนะขั้นตอน ซึ่งเป็นทางเลือกหนึ่งในการสร้างเว็บเพจ ดังต่อไปนี้
1. สิ่งที่ต้องการนำเสนอ ผู้พัฒนาจะต้องเตรียมข้อมูลต่างๆ ที่ต้องการนำมาเสนอลงบน Webpage โดยผู้พัฒนาอาจสร้างทีมงานขึ้นมาและแบ่งหน้าที่ในการทำงาน เช่น การหาข้อมูลข่าวสาร, การแบ่งหน้าที่ในการเขียน HTML รวมไปถึงการ Update ข้อมูลบนเว็บ เป็นต้น
2. สร้างโครงร่างคร่าวๆ ลงในกระดาษ ผู้พัฒนาควรวาดโครงร่างรูปแบบของ Webpage คร่าวๆลงในกระดาษก่อนเพื่อดูรูปแบบโดยรวมแบบกว้างๆ ของหน้าจอเรา ว่าควรจะมีโครงสร้างแบบไหน ใช้รูปภาพและข้อความอะไร วางไว้ตำแหน่งไหนบนหน้าจอบ้าง
3. เริ่มเขียน Webpage เริ่มต้นเขียน Webpage โดยภาษาที่ถนัด โดยทั่วไปเราจะใช้ภาษา HTML ในการเขียน ส่วนในการกำหนดลูกเล่น หรือใช้ระบบฐานข้อมูลบนเว็บเราอาจจะใช้ภาษา Scriptเข้ามาช่วย เช่น Java, CGI, Perl, PHP, ASP ฯลฯ เพราะ มาตรฐานของภาษา HTML นั้นไม่สามารถจัดการฐานข้อมูลได้
4. นำ Webpage ขึ้นไปวางบน Server ในส่วนนี้เจ้าของ Server จะเป็นผู้จัดการวางไฟล์ต่างๆ ที่ได้สร้างเรียบร้อยแล้วไว้บน Server เพื่อเปิดให้ผู้บริการให้ผู้สนใจเข้าชม
คําสั่งพื้นฐาน
< !-- ขอความ --> คําสั่ง หมายเหตุ ใชอธิบายความหมาย ขื่อผูเขียนโปรแกรม และอื่นๆ
<br> คําสั่งขึ้นบรรทดใหม ั
<p> ขอความ </p> คําสั่งยอหนาใหม
<hr width = "50%" size = "3"> คําสั่ง ตีเสน, กําหนดขนาดเสน
คําสั่ง เพิ่มชองวาง
<IMG SRC = "PHOTO.GIF"> คําสั่งแสดงรูปภาพชื่อ Photo.gif
<CENTER> ขอความ </CENTER> คําสั่งจัดใหขอความอยูกึ่งกลาง
<HTML> </HTML> คําสั่ง <HTML> คือคําสั่งเรมติ่ นในการเขียนโปรแกรม HTML และมคี ําสั่ง </HTML> เพื่อ
บอกจุดสิ้นสุดโปรแกรม
<HEAD> </HEAD> คําสั่ง <HEAD> คือคําสั่งบอกสวนที่เปนชื่อเรื่อง โดยมีคาสํ ั่งยอย <TITLE> อยูภายใน
<TITLE> </TITLE> คําสั่ง <TITLE> คือคําสั่งบอกชื่อเรื่อง จะไปปรากฏที่ Title Bar
<BODY> </BODY> คําสั่ง <BODY> คือคําสั่งบอกสวนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอรประกอบดวย
รูปภาพ ตัวอักษร ตาราง เปนตน
รูปแบบตัวอักษร
<font size = "3"> ขอความ </font> ขนาดตัวอักษร
<font color = "red"> ขอความ </font> สีตัวอักษร
<font face = "Arial"> ขอความ </font> รูปแบบตวอั ักษร
<besefont size = "2"> ขอความ </font> กําหนดคาเร ิ่มตนของขนาดต ัวอักษร
<b> ขอความ </b> ตัวอักษรหนา
<i> ขอความ </i> ตัวอักษรเอน
<u> ขอความ </u> ขีดเสนใตตัวอักษร
<tt> ขอความ </tt> ตัวอักษรแบบพมพิ ดีด
หมายเหตุ เราสามารถใชค ําสั่งกําหนดรูปแบบตัวอักษร หลายๆรูปแบบไดเชน
<font face = "Arial" size = "3" color = "red"> ขอความ </font> เปนตน
จุดเชื่อมโยงขอมูล
<a href ="#news"> Hot News </a> ,
<a name ="news">
กําหนดจดเช ุ ื่อมชื่อ news สวน "a name" คอตื ําแหนงที่
ลิงคไป (เอกสารเดียวกัน)
<a href ="news.html"> Hot News </a> สรางลิงคไปยังเอกสารชื่อ "news.html"
<a href ="http://www.thai.com"> Thai </a> สรางลิงคไปยังเวปไซทอื่น
<a href ="http://www.thai.com" target = "_blank" > Thai </a> สรางลิงคไปยังเวปไซทอื่น และเปดหนาตางใหม
<a href ="http://www.thai.com"> <img src = "photo.gif"> </a> สรางลิงคโดยใชรูปภาพชื่อ photo.gif เปนตัวเชื่อม
<a href ="mailto:yo@mail.com"> Email </a> สรางลิงคมายังอีเมล
การแสดงผลแบบรายการแบบมีหมายเลขกํากับ
<OL value = "1" >
<LI> รายการที่ 1
<LI> รายการที่ 2
</OL>
การแสดงผลแบบรายการ ใชค ําสั่ง <OL> เปนเริ่มและปดท ายดวย
</OL> สวนคาสํ ั่ง <LI> เปนตําแหนงของรายการที่ตองการ
นําเสนอ เราสามารถกําหนดใหแสดงผลรายการไดหลายแบบเชน
เรียงลําดับ 1,2,3... หรือ I,II,III... หรือ A,B,C,... ไดทั้งนี้จะตอง
เพิ่มคําสั่งเขาไปท <OL value = "A"> ี่ เปนตน
1. สิ่งที่ต้องการนำเสนอ ผู้พัฒนาจะต้องเตรียมข้อมูลต่างๆ ที่ต้องการนำมาเสนอลงบน Webpage โดยผู้พัฒนาอาจสร้างทีมงานขึ้นมาและแบ่งหน้าที่ในการทำงาน เช่น การหาข้อมูลข่าวสาร, การแบ่งหน้าที่ในการเขียน HTML รวมไปถึงการ Update ข้อมูลบนเว็บ เป็นต้น
2. สร้างโครงร่างคร่าวๆ ลงในกระดาษ ผู้พัฒนาควรวาดโครงร่างรูปแบบของ Webpage คร่าวๆลงในกระดาษก่อนเพื่อดูรูปแบบโดยรวมแบบกว้างๆ ของหน้าจอเรา ว่าควรจะมีโครงสร้างแบบไหน ใช้รูปภาพและข้อความอะไร วางไว้ตำแหน่งไหนบนหน้าจอบ้าง
3. เริ่มเขียน Webpage เริ่มต้นเขียน Webpage โดยภาษาที่ถนัด โดยทั่วไปเราจะใช้ภาษา HTML ในการเขียน ส่วนในการกำหนดลูกเล่น หรือใช้ระบบฐานข้อมูลบนเว็บเราอาจจะใช้ภาษา Scriptเข้ามาช่วย เช่น Java, CGI, Perl, PHP, ASP ฯลฯ เพราะ มาตรฐานของภาษา HTML นั้นไม่สามารถจัดการฐานข้อมูลได้
4. นำ Webpage ขึ้นไปวางบน Server ในส่วนนี้เจ้าของ Server จะเป็นผู้จัดการวางไฟล์ต่างๆ ที่ได้สร้างเรียบร้อยแล้วไว้บน Server เพื่อเปิดให้ผู้บริการให้ผู้สนใจเข้าชม
คําสั่งพื้นฐาน
< !-- ขอความ --> คําสั่ง หมายเหตุ ใชอธิบายความหมาย ขื่อผูเขียนโปรแกรม และอื่นๆ
<br> คําสั่งขึ้นบรรทดใหม ั
<p> ขอความ </p> คําสั่งยอหนาใหม
<hr width = "50%" size = "3"> คําสั่ง ตีเสน, กําหนดขนาดเสน
คําสั่ง เพิ่มชองวาง
<IMG SRC = "PHOTO.GIF"> คําสั่งแสดงรูปภาพชื่อ Photo.gif
<CENTER> ขอความ </CENTER> คําสั่งจัดใหขอความอยูกึ่งกลาง
<HTML> </HTML> คําสั่ง <HTML> คือคําสั่งเรมติ่ นในการเขียนโปรแกรม HTML และมคี ําสั่ง </HTML> เพื่อ
บอกจุดสิ้นสุดโปรแกรม
<HEAD> </HEAD> คําสั่ง <HEAD> คือคําสั่งบอกสวนที่เปนชื่อเรื่อง โดยมีคาสํ ั่งยอย <TITLE> อยูภายใน
<TITLE> </TITLE> คําสั่ง <TITLE> คือคําสั่งบอกชื่อเรื่อง จะไปปรากฏที่ Title Bar
<BODY> </BODY> คําสั่ง <BODY> คือคําสั่งบอกสวนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอรประกอบดวย
รูปภาพ ตัวอักษร ตาราง เปนตน
รูปแบบตัวอักษร
<font size = "3"> ขอความ </font> ขนาดตัวอักษร
<font color = "red"> ขอความ </font> สีตัวอักษร
<font face = "Arial"> ขอความ </font> รูปแบบตวอั ักษร
<besefont size = "2"> ขอความ </font> กําหนดคาเร ิ่มตนของขนาดต ัวอักษร
<b> ขอความ </b> ตัวอักษรหนา
<i> ขอความ </i> ตัวอักษรเอน
<u> ขอความ </u> ขีดเสนใตตัวอักษร
<tt> ขอความ </tt> ตัวอักษรแบบพมพิ ดีด
หมายเหตุ เราสามารถใชค ําสั่งกําหนดรูปแบบตัวอักษร หลายๆรูปแบบไดเชน
<font face = "Arial" size = "3" color = "red"> ขอความ </font> เปนตน
จุดเชื่อมโยงขอมูล
<a href ="#news"> Hot News </a> ,
<a name ="news">
กําหนดจดเช ุ ื่อมชื่อ news สวน "a name" คอตื ําแหนงที่
ลิงคไป (เอกสารเดียวกัน)
<a href ="news.html"> Hot News </a> สรางลิงคไปยังเอกสารชื่อ "news.html"
<a href ="http://www.thai.com"> Thai </a> สรางลิงคไปยังเวปไซทอื่น
<a href ="http://www.thai.com" target = "_blank" > Thai </a> สรางลิงคไปยังเวปไซทอื่น และเปดหนาตางใหม
<a href ="http://www.thai.com"> <img src = "photo.gif"> </a> สรางลิงคโดยใชรูปภาพชื่อ photo.gif เปนตัวเชื่อม
<a href ="mailto:yo@mail.com"> Email </a> สรางลิงคมายังอีเมล
การแสดงผลแบบรายการแบบมีหมายเลขกํากับ
<OL value = "1" >
<LI> รายการที่ 1
<LI> รายการที่ 2
</OL>
การแสดงผลแบบรายการ ใชค ําสั่ง <OL> เปนเริ่มและปดท ายดวย
</OL> สวนคาสํ ั่ง <LI> เปนตําแหนงของรายการที่ตองการ
นําเสนอ เราสามารถกําหนดใหแสดงผลรายการไดหลายแบบเชน
เรียงลําดับ 1,2,3... หรือ I,II,III... หรือ A,B,C,... ไดทั้งนี้จะตอง
เพิ่มคําสั่งเขาไปท <OL value = "A"> ี่ เปนตน