คุณติดอยู่ในโลกของ Table หรือไม่

ไม่กี่ปีที่ผ่านมานี้ นักพัฒนาเว็บไซท์หลายๆ คนเปลี่ยนแปลงการออกแบบหน้าเว็บไซท์ด้วยโครงสร้างตาราง (Table) ที่ซับซ้อน มาเป็นการใช้โครงสร้างด้วย div แทน คุณรู้หรือไม่ว่าทำไมจึงเป็นเช่นนั้น

การ ใช้ตารางนั้นเป็นที่คุ้นชินของคนเรา เนื่องจากทุกวันนี้เราได้ใช้ข้อมูลในรูปแบบตารางต่างๆ มากมายจึงมีการใช้ในการออกแบบเว็บไซท์กันอย่างแพร่หลาย แต่ตารางเองก็มีปัญหาในเรื่องความยืดหยุ่น ในความเป็นจริงแล้วตารางถูกออกแบบ มาเพื่อการแสดงผลในรูปข้อมูลตาราง การทำมาใช้ในการออกแบบโครงสร้างเว็บไซท์นั้น จึงไม่ถูกตั้งแต่ต้นอยู่แล้ว และด้วยจำนวน tag ที่ถูกใช้ในการสร้าง กรอบข้อมูลกรอบหนึ่งที่ต้องใช้จำนวนถึง 3 tag (table, tr, td) และเมื่อมีการออกแบบโครงสร้างที่ซับซ้อนที่เป็นตารางซ้อนตาราง (Nested Table) เพื่อให้ได้การแสดงผลตามที่ต้องการนั้น ยิ่งทำให้เกิดการใช้ tag ที่ฟุ่มเฟือยมากยิ่งขึ้น ในการสำรวจสอบ MAMA (Metadata Analysis and Mining Application) ซึ่งเป็น Search Engine เพื่อวิเคราะห์โครงสร้างของเว็บไซท์ของ Opera นั้นได้มีการบันทึกไว้ว่า การใช้งานตารางในการออกแบบเว็บไซท์นั้นมีปริมาณ 82.47% ของเว็บไซท์ทั้งหมด และด้วยการสำรวจสอบ MAMA นั้นได้บันทึกข้อมูลไว้ว่ามีเว็บไซท์ที่ใช้ตารางซ้อนกันมากสูงสุดถึง 745 ชั้น

ในการออกแบบเว็บไซท์หนึ่งๆ ที่มีส่วนหัว ส่วนเนื้อหาที่แบ่งเป็น 2 column และส่วนท้ายของเว็บไซท์นั้นเราสามารถเขียนด้วยตารางได้เป็น

HTML

1. cellpadding="0" cellspacing="0" border="0">
2.     colspan ="2" height="120px" id="menu"></td></tr>

    valign ="top" id="leftContent"></td>valign

="top" id="rightContent"></td></tr>

    colspan ="2" id="footer"></td></tr>

แต่ถ้าเราเขียนด้วย div จะได้เป็น

HTML

1. id="menu"></div>
2. id="leftContent"></div>
3. id="rightContent"></div>
4. id="footer"></div>

จะ เห็นได้ว่าการใช้ตารางในการออกแบบโครงสร้างนั้นต้องใช้จำนวน tag มากกว่าการออกแบบโครงสร้างโดยใช้ div มาก โดยอาจจะต่างกันถึง 1 เท่าตัว คุณอาจจะสงสัยว่าแล้วมันมีประโยชน์อะไร อย่าลืมว่าการแสดงหน้าเว็บไซท์นั้น Browser นั้นจะทำการโหลดเอกสาร HTML มาก่อนแล้วจึงโหลด media ต่างๆ ในเอกสาร ดังนั้นการลดขนาดของเอกสาร HTML ได้นั้นก็สามารถเพิ่มความเร็วในการเรียกดูเว็บไซท์ได้มาก

และในการทำ Search Engine Optimization (SEO) การออกแบบโครงสร้างด้วยตารางนั้น จะส่งผลให้ถูกจัดอันดับรองจากการออกแบบด้วย div เนื่องจากตัว Search Engine นั้นต้องใช้ตรรกะในการที่ซับซ้อนตามโครงสร้างของเว็บไซท์ไปด้วย

และ การใช้การออกแบบโครงสร้างด้วยตารางนั้น มีความยืดหยุ่นน้อยกว่า ตัวอย่างเช่น เมื่อมีการพิมพ์หน้าเว็บไวท์การแสดงด้วยตารางนั้น จะสามารถจัดรูปแบบเพื่อการพิมพ์ได้ยากกว่าการใช้ div หรือไม่สามารถซ่อนเนื้อหาบางอย่าง เมื่อใช้ในการแสดงบนอุปกร์สื่สารเคลื่อนที่ต่างๆ

วันนี้คุณยังติดอยู่ในโลกของตารางหรือไม่