Tag: table

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

ทำยังไงที่เราจะพอดี พอเพียงกับชีวิตและพัฒนาตัวเองตามเทคโนโลยีได้อย่างพอเหมาะ และปรับตัวเข้ากับระบบกลไกการตลาดได้อย่างดีพอ (อันหลังนี้ไปหาทางกันเอาเองครับ)

ดีไซน์ที่คุณเห็นอยู่นี้ สำหรับแฟนเดนตายของ ไทยซีเอสเอสคงคุยเคยกันดี เพราะมันเป็นดีไซน์เก่า ของเว็บไทยซีเอสเอส ผมถอดทิ้งไปประมาณ เดือนพฤศจิกายน 2549 ที่นำกลับมาใช้ ก็เพื่อเป็นการลำลึกถึงความงี่เง่าและห่วยแตกของตัวเองและไทยซีเอสเอสจะครบ 1 ปี ในเดือนกรกฎาคมนี้แล้ว

เริ่มกันเลยกรุณาดูโค้ด หรือวิวซอสตามไปด้วยนะครับ

ถ้าเราจะสร้างตารางสักอัน โดยที่ไม่ต้องใช้ table แล้วเราสามารถใช้อะไรได้บ้าง ในความเป็นจริงอย่างที่เคยบอกกล่าวกันไว้ ถ้าข้อมูลอันไหนมันแสดงผลเป็นตาราง มันก็ควรที่จะเป็น table tag แต่ ถ้ามันดันเปิดดูกับ Devices อื่นๆ แล้วมันมีปัญหา แล้วเราจะใช้มันทำไมหละ

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

เหมือนเวลาที่ท่านเคยทำอะไรบางอย่างมานาน ทำแล้วทำอีก ทำแล้วทำอีก แล้วอยู่ๆ วันหนึงก็มี เงาลึกลับมาบอกท่านว่า ที่ท่านกำลังทำนั้น มันผิด มันมีทางที่ถูกต้อง ท่านควรลองศึกษาทางใหม่ดูบ้าง

อาการแรกที่ท่านอาจจะรู้สึกและต้องทำ แต่อาจจะทำไม่ได้ คือ ทำใจ ทำใจให้ยอมรับและปรับเปลี่ยน

การเรียนรู้สิ่งใหม่มันไม่ใช่เรื่องยาก มากมายอะไร แต่การบังคับจิตใจตัวเองให้ยอมรับนั้น มันยากยิ่งกว่าต่างหาก

ย้อนกลับไป เมื่อหลายปีก่อน ตอนที่ผมเพิ่งเริ่มทำเว็บใหม่ๆ เครื่องมือที่ใช้ก่อร่างสร้างเว็บก็ไม่ใช่ใครอื่นใด คือ ดรีมวีฟเว่อร์ 3 นั่นเอง

หลายคนกำลังรอคอยเรื่องการใช้ตารางแบบ xhtml อยู่ แต่ความแตกต่าง ระหว่าง html 4.0 กับ xhtml 1.0 มันก็ไม่มีอะไรมากมายนักหรอกครับ แต่ว่า เขาพัฒนาให้มันเฉพาะเจาะจงมากยิ่งขึ้นนั่นเอง เช่นว่า ตารางที่คุณกำลังเขียนนั้นเอาไว้ใช้กับข้อมูลอะไร ย้ำนะครับว่า เอาไว้แสดงผลข้อมูล ไม่ได้แสดงผลกราฟฟิคเลย์เอ้าท์

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

กับคำถามมากมายว่า DIV หรือ TABLE มันดีกว่ากันยังไง มันจะใช้แทนที่กันได้ยังไง หลายคนที่ยังสงสัย ตอนนี้ผมมีข้อมูลเล็กๆ น้อยๆ มาแจกจ่ายกันบ้าง อาจจะไม่กระจ่างมาก แต่คงพอถึงบางอ้อ

เรื่องมันมีอยู่ว่า

ด้วยเหตุแห่งยุคแรกเริ่มเดิมทีที่เหล่า เว็บดีไซเนอร์ พากันเรียกใช้ <table> ซึ่งเป็นตัวจัดการวางข้อมูล ออกมาใช้เป็นตัวจัดการโครงสร้างของเว็บทั้งหมด ด้วยเหตุที่ง่ายและยังไม่มีวิธีใดที่ดียิ่งกว่า TABLE จึงแพร่หลายและถูกใช้อย่างผิดๆ มาตั้งแต่นั้น

ปัจจุบัน คำว่า Tableless Design หรือการทำเว็บแบบพึ่งพา table ให้น้อยที่สุด หรือไม่ต้องใช้เลย อาจจะแพร่กระหลายในหมู่คนทำเว็บต่างประเทศอื่นๆ โดยเฉพาะฝั่งยุโรป แต่ในเมืองไทยยังไม่เป็นที่นิยมมากนัก เพราะต้องการใช้เวลาในห้วงระยะหนึ่งในการทำความเข้าใจ เรียนรู้มากพอสมควร ทั้งในเรื่องของ XHTML, XML เพื่อที่จะสามารถเข้าใจหลักการทำงานพื้นฐานได้ ถึงแม้โครงสร้างภาษาจะไม่แตกต่างจาก HTML มากมายก็ตาม