ตรวจสอบโค้ด HTML ว่าได้มาตรฐานหรือไม่ [Article ID : 51]

เรื่อง : ตรวจสอบมาตรฐานของ HTML Code ด้วย Dreamweaver

โค้ด HTML ที่ใช้ในการพัฒนาเว็บมีมาตรฐานที่กำหนดโดย W3C ซึ่งเป็นมาตรฐานที่นักพัฒนาเว็บควรนำมาใช้และปฏิบัติตาม ทั้งนี้เพื่อให้เว็บไซต์ที่เราพัฒนา มีความเป็นมาตรฐาน ซึ่งเว็บเพจใดที่ต้องการตรวจสอบมาตรฐานของโค้ด HTML เราอาจจะนำ URL ของเว็บเพจนั้นไปตรวจสอบได้ที่ URL ดังนี้

https://validator.w3.org

แต่ถ้าเราใช้ Dreamweaver ในการพัฒนาเว็บไซต์อยู่แล้ว เราอาจจะใช้โปรแกรม Dreamweaver ในการตรวจสอบมาตรฐานของโค้ด HTML เราได้เช่นเดียวกัน ดังนี้

วิธีการตรวจสอบโค้ด HTML ด้วยโปรแกรม Dreamweaver

ทำการเปิดไฟล์เว็บเพจที่ต้องการตรวจสอบขึ้นมากับโปรแกรม Dreamweaver จากนั้นให้ปฏิบัติตาม ดังนี้

1. ที่เมนูเลือกไปที่ Validate แล้วเลือกที่ Validate Current Document (W3C)
*Menu -> Validate -> Validate Current Document ดังรูป 2. เมื่อคลิปที่เมนูดังข้อ 1 แล้ว อาจจะมีหน่าต่างเล็ก ๆ แจ้งเตือน ดังรูป ให้เรากด OK 3. โปรแกรมจะทำการตรวจสอบโค้ด HTML และรายงานผลที่หน้าต่าง Validation ซึ่งแสดงอยู่ด้านล่างของโปรแกรม ดังรูป

จากรูปจะพบว่ามี Error หรือมีข้อผิดพลาดของโค้ด HTML ในเว็บเพจ 1 จุด คือ บรรทัดที่ 14 ของโค้ด ซึ่งมีการใช้งานแท๊ก <font> กับเว็บเพจ โดยที่แท๊ก <font> ในมาตรฐาน HTML5 ได้มีการประกาศยกเลิกใช้งานไปแล้ว (Obsolete) ดังนั้น หากเราต้องการแก้ไข เราต้องปรับเปลี่ยน หรือนำโค้ดดังกล่าวออกไปจากโค้ดของเรา
เมื่อนำโค้ด <font> ออกไปจากโค้ดแล้ว ตรวจสอบอีกครั้ง จะพบว่าข้อความที่แจ้ง Error ได้หายไปแล้ว ดังรูป

เรื่องมาตรฐานของโค้ด HTML นี้ เราในฐานะนักพัฒนาเว็บไซต์ ควรให้ความใส่ใจกันนะครับ อย่าละเลย ซึ่งตรงนี้จะส่งผลต่อความรู้ความเข้าใจในการพัฒนาเว็บเราอย่างมากมาย ตัวอย่างเช่น Error ในโค้ดที่ผ่านมา หากใครทำเว็บมานานแล้ว หรือเรียนรู้การพัฒนาเว็บจากตำราเก่า ๆ อาจจะไม่ทราบว่า ปัจจุบันได้มีการประกาศยกเลิกการใช้งานแท๊กใดไปบ้าง... อย่างไรก็ลองใช้งานและศึกษากันด้วยครับ...สวัสดี.

About the Author

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com

บทความอื่นที่คุณอาจสนใจ

สร้างโปรแกรมอ่าน RSS ด้วย Dreamweaver ตอนที่ 1

เรื่อง : วิธีการสร้างโปรแกรมอ่าน RSS/XML ด้วย Dreamweaver ตอนที่ 1 RSS (Really Simple Syndication/Rich...  

สารพัดปัญหา Dreamweaver ติดต่อกับ Database (MySQL) ไม่ได้

เรื่อง: ปัญหาการใช้โปรแกรม Dreamweaver สร้าง Connection กับฐานข้อมูลไม่ได้ "Dreamweaver ติดต่อกั...  

การแก้ไขปัญหาการใช้งาน Layer กับ Flash File

เรื่อง : การแก้ไขปัญหาการใช้งาน Layer กับ Flash File หลายท่านอาจจะมีปัญหาเรื่องของ Layer หรือ PopUp-MENU ที่เมื่อนำเอาไปว...  

สร้างปุ่มกดให้กลายเป็น Link (Button Link with Dreamweaver)

เรื่อง : การทำปุ่มกดให้เป็นลิงค์เพื่อกดไปหน้าอื่นด้วย Dreamweaver โดยปรกติถ้าต้องการสร้าง Link บนหน้าเว็บเพจ เราต้อ...