ทุกวันนี้เราคงได้ยินคำว่า HTML5 CSS3 และ WebGL กันมากขึ้น แต่เราก็ยังไม่ค่อยเห็นว่าเทคโนโลยีใหม่ๆ เหล่านี้ทำอะไรได้บ้าง ทาง Mozila ก็เลยเปิดตัวเว็บเดโมที่ชื่อ Web O'(pen) Wonder ( แปลแบบลวกๆ จะได้ว่า เว็บ(มาตรฐานเปิด)มหัศจรรย์ ) แสดงให้ดูว่าเทคโนโลยีเว็บพวกนี้สามารถสร้างสรรค์ออกมาได้ขนาดไหน

แน่นอนว่า Mozilla สนับสนุนแนวทางมาตรฐานเปิด (open standard) มาช้านาน เดโมเหล่านี้จึงไม่ต้องการ Quicktime, Flash หรือ Silverlight แม้แต่น้อย แถมยังดูได้ทุกเบราว์เซอร์ที่สนับสนุนมาตรฐานเปิดจริงๆ อย่าง Google Chrome หรือ Opera เบราว์เซอร์ที่ไม่ได้กล่าวถึงดูได้แต่อาจจะไม่เต็มร้อยเท่าเบราว์เซอร์ที่สนับสนุนจริงๆ

หน้าแรกของ Web O'(pen) Wonder มีหน้าตาเป็นอย่างนี้

มาเริ่มกันที่ The Planetarium เป็นหน้าเว็บที่เอารายละเอียดและเกร็ดความรู้ที่น่าสนใจของดาวแต่ละดวงในระบบสุริยะนี (ไม่มีดาวพลูโตแล้ว) มาทำให้ดูสวยงาม สำหรับเดโมนี้ใช้ CSS3 Transitions และ @font-face เป็นหลักโดยใช้ text-shadow และ font-feature-settings ในการปรับแต่งตัวอักษรให้ดูสวยงาม ใครสนใจคลิกที่รูปด้านล่างหรือดูวิดีโอ Firefox 4 Demos: CSS3 Planetarium

ดาวพฤหัสบดี

อ่ะๆ ใช่ว่า Adobe Flash เท่านั้นที่จะใช้สร้างเกมส์ได้ โดยเจ้าตัว Runfield นี้เป็นเกมส์ที่สร้างขึ้นด้วย HTML5 กับ JavaScript เดโมนี้น่าจะเป็นตัวจุดประกายแก่นักสร้างเกมส์ได้ดี โดยไม่จำเป็นต้องพึ่ง Flash (เพราะจะสร้างเกมส์ต้องซื้อ Adobe Flash Profesional มาใช้) แค่ใช้เทคโนโลยีสองตัวบนก็สามารถสร้างเกมส์ขึ้นมาเล่นโดยไม่ต้องเสียเงินสักบาทเดียว แถมใน Firefox 4 มีตัวประวลมวลผล JavaScript ตัวใหม่และตัวเร่งความเร็วด้วยฮาร์ดแวร์จึงส่งผลดีต่อเกมส์พวกนี้

ปล. เกมส์นี้มีปุ่ม Twitter ให้ประกาศสถิติเวลาเราเล่นจบด้วย

เป็นเกมส์หมาจิ้งจอกวิ่งกระโดดหลบหลุม

อ่อ! ถ้าใครอยากเล่นเกส์ HTML5 อีก ไปดูได้ที่ Mozilla Labs Gaming นะจ่ะ

ชิ้นถัดไปเป็น Remixing Reality ที่นำเอา WebGL Canvas และ Audio API มาผสมผสามกันทำให้เกิด augmeted reality กับวัตถุ 3 มิติได้ทันทีแถมยังเปลี่ยนวัตถุไปมาได้ตลอด แม้กระทั่งเราจะวาดรูปลงไปเลยก็ได้มันก็จะแสดงผลให้เดี๋ยวนั้น

และสิ่งสุดท้ายแต่ไม่ท้ายสุด(เพราะยังมีอีกหลายอัน) ที่จะนำมาเสนอก็คือ HTML5 Poster เป็นหน้าเว็บที่รวมเอามาตรฐานเว็บยุคใหม่ๆ มาไว้ในหน้าเดียว มีคำอธิบายโดยย่อและเดโมสดๆ ทันทีที่เราเอาเมาส์ไปจ่อในแต่ละหัวข้อ

นำเมาส์ไปจ่อที่หัวข้อ WebGL วัตถุกาน้ำก็ลอยขึ้นมาทันที

หรือเอาเมาส์ไปจ่อที่หัวข้อ Transition มันก็จะโผล่ transtion วิ้งๆ ขึ้นมา

ส่วนที่เหลือลองไปเล่นดูเองที่ Web O'(pen) Wonder เหมาะสำหรับนักพัฒนาที่จะได้รับรู้และได้ไอเดียไปในการสร้างเว็บแอพพลิเคชั่นแนวทางใหม่ๆ ส่วนผู้ใช้ทั่วๆ ไปที่ดูเดโมเหล่านี้ ก็เตรียมตัวรับประสบการณ์ใหม่ๆ ในอนาคตได้เลยเพราะ เว็บที่เราจะได้เห็นในอนาคต จะไม่ใช่แค่ตัวหนังสืออีกต่อไป!

ปล. สำหรับใครที่พัฒนาเว็บด้วยเทคโนโลยีเหล่านี้ และต้องการโชว์ออฟให้ทุกๆ คนได้เห็นแนะนำให้ไปส่งผลงานได้ที่ Mozilla Demo Studio ณ บัดนี้