About DwThai.Com 00

DwThai.Com

Tip and Trick Dreamweaver

ก่อตั้งเมื่อปีพุทธศักราช ๒๕๔๖

Go to Post-iT Sign Guestbook

ค้นหาข้อมูลใน DwThai.Com

การลบ Tag/Code ของ HTML ที่ไม่จำเป็นออก (Clean up HTML) [Article ID : 8]

เรื่อง: ลบ Tag/Code ของ HTML ที่ไม่จำเป็นออกจาก Source Code

บางครั้งการสร้าง Web Page โดยใช้โปรแกรม Dreamweaver ตัวโปรแกรมจะมีการสร้าง Tag หรือ Code ของภาษา HTML เข้ามาให้โดยไม่จำเป็น หรือบางครั้งก็เกิดจากตัวเราเอง ที่มีการสร้างโค้ดที่ไม่จำเป็นลงไปใน Source Code
ซึ่งโค้ดแท็ก HTML เหล่านี้เราสามารถลบทิ้งไปได้โดยไม่มีผลกระทบอะไรต่อหน้าเว็บของเรา และยังมีประโยชน์ช่วยให้ขนาดไฟล์ Web Page มีขนาดไฟล์ที่เล็กลงด้วย นั้นหมายความว่า Web Page จะโหลดได้เร็วขึ้น

แต่ !!! คงไม่สะดวกแน่ถ้าเราต้องมานั่งไล่หาบรรทัดโค้ดต่างๆ ของ HTML ด้วยตนเอง

ดังนั้น โปรแกรม Dreamweaver จึงมีคำสั่งช่วยลบแท็กที่ไม่จำเป็นเหล่านั้นออกไปจาก Source Code ซึ่งมีวิธีการเรียกใช้งานคำสั่งนั้น ดังนี้

วิธีการลบ Tag/Code ที่ไม่จำเป็นด้วย Dreamweaver

ก่อนอื่นให้เราพิจารณารูปโค้ดด้านล่างนี้ เราจะพบว่ามี Code หรือ Tag ของ HTML ที่ไม่ได้นำไปใช้กับข้อมูลใดๆ เลยอยู่ (โค้ดที่ล้อมกรอบแดงไว้ <strong></strong>) ซึ่งหมายความว่า Tag นี้ไม่มีความจำเป็นต่อเว็บเพจของเราเลย ดังนั้น เราสามารถลบออกไปจากเว็บเพจได้ โดยไม่ส่งผลกระทบใด ๆ ต่อการแสดงผลหน้าเว็บเรา

ซึ่งหากมีแค่เพียง 1 แท๊กตามรูปข้างต้นคงลบด้วยตนเองได้ไม่ยุ่งยากอะไร แต่ในความเป็นจริงแล้ว จะมีแท๊กมากมายที่เราต้องตรวจสอบ ซึ่งหากจะตรวจสอบด้วยสายตาตนเอง ก็คงใช้เวลานานเป็นแน่ ดังนั้น เราจะมาใช้โปรแกรม Dreamweaver ช่วยลบแท๊กลักษณะเหล่านี้ออกจากโค้ดเว็บเพจของเรากัน ดังนี้

1. ให้เราไปที่ Menu Bar ของโปรแกรมแล้วให้เลือกที่ Commands
2. จากนั้นเลือกที่เมนู Clean Up HTML... ดังรูป

3. เมื่อเลือกแล้วจะปรากฏหน้าต่าง Clean Up HTML ดังรูป

4. จากนั้นให้เราเลือกติ๊กถูกในช่อง Options ต่างๆ ดังตัวอย่างในรูปข้างต้น
5. เมื่อเรากำหนด Options ที่ต้องการได้แล้ว ให้ทำการคลิก OK เมื่อคลิกแล้วโปรแกรม Dreamweaver จะทำการค้นหา TAG ที่ไม่จำเป็นตามเงื่อนไขที่เราได้เลือกไว้ใน Options แล้วทำการลบ TAG นั้นออกจาก Source Code ให้เราโดยอัตโนมัติ
6. เมื่อโปรแกรมทำงานเสร็จสิ้นจะมีหน้าต่างรายงานผลแแสดงให้เราทราบ ดังรูป

จากรูปข้างต้น โปรแกรมได้ทำการลบ Tag ที่ไม่จำเป็นออกไป 1 Tag ครับ

7. กลับมาดูที่ Source Code ของเว็บเพจ จะพบว่า Tag ดังในรูปข้างต้นที่ไม่จำเป็นได้ถูกลบออกไปแล้วจากโค้ดของเรา (<strong></strong>)

ซึ่งมีประโยชน์มากครับ Dreamweaver ช่วยงานในส่วนของการดูแลโค้ดเว็บของเรา และประหยัดเวลาในการทำงานไปอย่างมาก

ข้อควรระวัง
การลบ Tag หรือโค้ดออกนั้น พึงกระทำด้วยความระมัดระวัง โดยเฉพาะการเลือก Options ในการลบต่างๆ หากเราได้เลือกติ๊กใน Option โดยไม่ทราบความหมายของ Options ที่เลือก Tag บางอย่างอาจจะถูกลบไปด้วย ทำให้เว็บเพจเกิดความเสียหายได้
ทางที่ดี...เมื่อเราทำการลบ Tag ที่ไม่จำเป็นออกไปแล้วให้ทำการ Preview แสดงผลกับ Web Browser ในทันที และทำการตรวจสอบการแสดงผล หากพบว่า การแสดงผล หรือการใช้งานเว็บเพจ มีความเสียหายเกิดขึ้น ให้กลับมาที่โปรแกรม Dreamweaver แล้วทำการ Undo การกระทำครับ.

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

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

การเขียนโค้ดโปรแกรมด้วย PHP กับ Dreamweaver (PHP with Dreamweaver)

เรื่อง : PHP กับโปรแกรม Dreamweaver บทความนี้จะขอมาแนะนำการใช้งานโปรแกรม Dreamweaver กับการเขียนโปรแกรมด้วยภาษา PHP ครับ ...

การทำตารางให้มีมุมโค้ง (แบบใช้รูปภาพ)

เรื่อง : ทำตารางให้มีมุมโค้ง (แบบดั่งเดิม/ใช้รูปภาพ) *ปัจจุบัน CSS 3 สามารถทำตารางให้มีมุมโค้งได้โดยไม่ต้องใช้ไฟล์รูปภาพมาตบแต่งครับ...

การสร้างข้อความในแบบ Tooltip กับ Dreamweaver (Spry Tooltip, CS Only)

เรื่อง : การสร้างข้อความแบบ Tooltip ด้วยโปรแกรม Dreamweaver *บทความนี้เฉพาะโปรแกรม Dreamweaver เวอร์ชั่น CS5, CS6 สำหรับ CC ไม่มีให้เรียกใ...

การ Import ข้อมูล MS Word มาใช้ทำเว็บกับโปรแกรม Dreamweaver

เรื่อง : การ Import ข้อมูลจากไฟล์ MS Word มาใช้งานกับโปรแกรม Dreamweaver หลายครั้งผู้ที่มีหน้าที่จัดทำ Website ต้องมีการรับ...