HTML5

เชื่อว่าเพื่อน ๆ พี่ ๆ น้อง ๆ เห็นชื่อเรื่องที่เกริ่นไว้คงทราบกันทันทีว่าคราวนี้ผมจะพูดถึงหนึ่งในสมาชิกหน้าใหม่ของ HTML5 ซึ่งก็คือเจ้า dialog นั่นเองครับ เนื่องจาก HTML5 นั้นมีการปรับโครงสร้างภาษา ไปค่อนข้างมากครับ เหตุผลก็คงหลีกไม่พ้นประโยชน์เหล่านี้ครับ เช่น เพื่อให้ง่ายต่อการใช้งานในการออกแบบโครงสร้าง HTML/CSS และ มีความหมายมากขึ้น (semantics) เพราะฉะนั้นเจ้า dialog จึงถูกสร้างมาเพื่อที่จะเข้ามาทำหน้าที่ในการควบคุมโครงสร้างเนื้อหาที่เกี่ยวข้องกับกรณีต่อไปนี้ครับผม

• บทสนทนาระหว่าง คนสองคน หรือ หลาย ๆ คน
• บทสัมภาษณ์
• บทละคร ที่เป็นการสนทนากันระหว่างตัวละคร
• และ อื่น ๆ ที่เกี่ยวข้องกับการสนทนา ปฏิสัมพันธ์ระหว่างคนสองคนขึ้นไป

ใน HTML5 นั้น dialog จัดอยู่ในหมวดของ Flow Content ชนิด Grouping Content (@pornAntha จะอธิบายเกี่ยวกับหมวด และ ชนิดของ elements ใน HTML5 เร็ว ๆ นี้ครับ)

คำเตือน บทความนี้เป็นบทความเฉพาะกลุ่มเป้าหมาย เนื้อหาส่วนใหญ่ไม่ได้อยู่ในโลกปัจจุบัน ไม่ค่อยเหมาะสำหรับคนที่มองอนาคตระยะ 15 เมตร

คำเตือนที่สอง เนื้อหานี้ ไม่เหมาะสำหรับผู้ใช้ทั่วไป และ ตัวอย่างทั้งหมด ไม่สามารถใช้ User Agent ที่เป็น Browsers อย่าง IE ทั้ง 6-7-8 เรียกดูได้ เพราะฉะนั้น กรุณาใช้ Firefox, Opera, Safari, หรือ Chrome เข้าชม

คำเตือนที่สาม ผมเกรียน...

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

-1-

คำถามชุดที่หนึ่ง ราคา สี่ร้อยเก้าสิบเก้าบาท

ถามว่า HTML5 จะใช้ได้ในเร็ววันนี้หรือไม่

คำตอบคือ ทั้งใช่ และไม่ใช่ อย่างไรบ้างหละ

สำหรับคำตอบที่บอกว่า ยังไม่ได้ใช้ในเร็ววันนี้ ก็คงจะเอนเอียงไปทางผู้ที่ทำเว็บเพื่อรองรับเนื้อหาข่าวสารที่พึ่งพิงผู้ที่ใช้ IE เข้าท่องเว็บไซท์เป็นหลัก เพราะ HTML5 บางElement (ส่วนใหญ่) ยังคงเป็นบรุษนิรนาม ใน IE8 เราอาจจะต้องรอจนถึง IE9 นั่นอาจจะเป็น ปลายปี 2012 หรือ ช้ากว่า

สำหรับคนที่บอกว่า จะได้ใช้แล้วแน่ๆ ก็คงเป็นนักพัฒนา นักแสวงหาความรู้ใหม่ๆ ทั้งหลาย เจ้าของ Web Log ที่อยากจะลองเล่นเพื่อศึกษาหาประสบการณ์ เพื่อเตรียมความพร้อมสำหรับอนาคตที่ไม่รู้ว่ามันจะมาถึงเมื่อไหร่ เช่น ป๋า Bruce Lawson ที่ลองเล่นไปก่อนใครแล้ว (ใช่สิ เพราะลุงแกพัฒนาเอง เล่นเองนี่)

ใครจะเลือกแบบไหน ก็ตามสบายครับ ไม่ว่ากัน บ้านเราสิทธิและเสรีภาพ เข้าถึงแล้ว เหลือเพียงแค่ความเท่าเทียม ที่มันยังไม่มี

คำถามชุดที่ 2 ราคา สองพันสามบาท

ถามว่า CSS3 ใกล้จะได้ใช้หรือยัง

คำตอบ เอาเป็นว่า เราอาจจะได้ใช้พร้อมๆ กับวันที่บ้านเรามีรถไฟความเร็วสูงจากกรุงเทพ ไปเชียงใหม่ นั่นแหละ แต่สำหรับคนที่ใฝ่หาและอยากลอง ?คุณได้สิทธิ์นั้น เดี๋ยวนี้? แค่เปลี่ยนจากการถามสาวยาคูลล์เป็นถามพี่กูเกิลแทน คำตอบจะหลั่งไหลเลยทีเดียว

ผมไม่ทราบว่าเพื่อน ๆ designer, Media Agency และ บริษัทต่าง ๆ ส่วนใหญ่ในประเทศเรามี process การทำงานกันอย่างไรบ้าง แต่เท่าที่สอบถามคนรอบข้างนั้น หลาย ๆ คนยังไม่เคยใช้หลักการระดมสมองที่เรียกว่า Wire Framing นี้ น้อยคนมากที่รู้จัก หรือ อาจจะทำอยู่เป็นนิจแต่ไม่รู้ว่า ไอ้สิ่งที่ทำนั้นมันคือ อะไร ผมเองก็เพิ่งรู้จักมาเมื่อไม่กี่เดือนนี้เหมือนกัน ว่าสิ่งที่เราทำบางครั้งก่อนลงมือทำงานขั้นตอนหนึ่ง มันเรียกว่า Web Wire Framing ต้องขอบพระคุณพี่เอ้ @DjFunkyDog ที่เปิดหูเปิดตา และ เอื้อเฟื้อเวลานั่งสอนน้องคนนี้มา ณ ที่นี้ เป็นอย่างมากครับ (สอนโดยไม่รู้ตัวบางทีก็มี เอิ๊ก ๆ) ก่อนอื่นผมจะขออนุญาติอธิบายเกี่ยวกับ Wire Frames ก่อนนะครับ

Wire Frame นั้นเป็นขั้นตอนที่ ทุกคนที่เกี่ยวข้องในตัวผลิตภัณฑ์นั้น ๆ ต้องร่วมกันแสดงความคิดเห็น ก่อนลงมือผลิตเจ้าผลิตภัณฑ์นั้น ๆ ขึ้น เหมือนเป็นการร่วมกันร่าง พิมพ์เขียวของเจ้าสิ่ง ๆ นั้นขึ้นมา โดยแต่ละทีมนั้นสามารถทำ Wire Frame ของแต่ละทีมมาก่อน ก่อนที่จะ Finalize Wire Frames ของเจ้าผลิตภัณฑ์ที่จะสร้างขึ้นนั้นอีกทีเป็นรอบปิดท้าย

ผมขออนุญาติเรียนไว้ก่อนว่า wire framing นั้นไม่มีรูปแบบตายตัวในแต่ละผลิตภัณฑ์ และ ขั้นตอนการทำงานของแต่ละคน / บริษัท นั้นก็จะมีการ wire framing แตกต่างกันไปด้วย เพราะฉะนั้น พื้นที่นี้เป็นพื้นที่สำหรับการแลกเปลี่ยนครับ ถ้าเพื่อน ๆ พี่ ๆ น้อง ๆ มี idea ที่ดีกว่า หรือ แตกต่างอยากให้ share กันครับผม

XHTML ส่วนใหญ่ในเวปที่เราเห็น ๆ กันอยู่นั้นใช้ content type แบบ text/html พูดง่าย ๆ มันก็ยังเป็น ต้มยำ tag ที่ทำงานในแบบ XML ไม่ได้เป็น XML ไปเสียทีเดียว