เพิ่มลูกเล่นให้กับเว็บไซต์ให้ดูอลังการด้วย
Dynamic HTML (DHTML)
หากเว็บไซต์ของที่ทำไว้ยังดูธรรมดาจืดชืดไม่หรูหราอลังการ
วันนี้มีวิธีที่จะเพิ่มลูกเล่นและความน่าสนใจให้กับเว็บไซต์ด้วย
ไดนามิค HTML Dynamic HTML หรือ DHTML)
เพื่อเพิ่มลูกเล่นต่างๆ ภายในเว็บไซต์กับผู้ที่เข้ามาใช้บริการ
ในเว็บไซต์ ได้อย่างน่าอัศจรรย์
หากจะยกตัวอย่างการทำงานของ DHTML
อาจจะเคยเห็นกันมาแล้วในหน้าเว็บไซต์ต่างๆ
ซึ่งมีหลายรูปแบบในการทำ DHTML มาใช้
เช่น ทำเมนูในเว็บไซต์แปลกๆใหม่,ทำให้มีภาพลอยไปลอยมา,
ทำให้ตัวหนังสือในเว็บไซต์คุณมีลูกเล่นมากขึ้น,การทำให้เมาส์
หรือเคอร์เซอร์มีลูกเล่นแปลกๆ,การเปิดหรือปิดหน้าต่างเว็บไซต์,
การป้องกันการคลิกเม้าส์ขวาในหน้าเว็บนั้นๆ เป็นต้น
นี้เป็นเพียงแค่บางส่วนของความสามารถของ DHTML
ที่สามารถทำได้และเพิ่มลูกเล่นให้กับไซต์
Dynamic HTML (DHTML) คืออะไร?
เป็นเทคนิคที่ช่วยเพิ่มความสามารถให้ Browser
สามารถทำการโต้ตอบการผู้ใช้งานเองได้
โดยไม่ต้องจำเป็นต้องไปขอข้อมูลจากWeb Server
ทุกครั้งไป เป็นตัวเลือกที่จะให้ผู้ใช้สร้างเว็บเพจ
ให้มีภาพเคลื่อนไหวมากขึ้นและตอบสนองผู้ใช้
แบบInteractiveมากกว่าเว็บไซต์ในรูปแบบHTMLปกติ
ซึ่งวิธีการสร้างเป็นแบบ DHTMLจะเป็นการใช้
เทคโนโลยีของ JavaScript และ Cascading Style Sheets
เหล่านี้ช่วยในการกำหนดค่าต่างๆของความสูง ความกว้าง
หรือตำแหน่งของส่วนต่างๆ ซึ่งอยู่บนเว็บเพจ
หรืออาจจะเป็นการรับข้อมูล User Interface
ได้ด้วย JavaScript ก็เป็นได้
ตัวอย่างของการทำงานของ Dynamic HTML
การทำงานของ DHTML สามารถทำได้หลายๆอย่าง
ซึ่งหากจะลองแบ่งความสามารถและลูกเล่นในการทำงาน
ของ DHTML ที่สามารถใช้ในเว็บไซต์อาจจะแบ่งได้เป็น
-การเพิ่มลูกเล่นให้กับเมนู หรือ เนวิเกเตอร์ในเว็บไซต์
(Menus & Navigation)
การเพิ่มลูกเล่นในการใส่เมนูในเว็บไซต์ของคุณได้เช่น
ทำให้เมนูซ่อนตัวเองไว้,มีเมนูในมุมต่างๆของหน้าเว็บ,
เมนูลอยไปลอยมาหรือจะให้เมนูเลื่อนออกมาแบบอัตโนมัติ
-การเลื่อนหน้าจอในเว็บไซต์
(Scrollers)
การเปลี่ยนข้อความหรือข้อมูลโดยที่ไม่ต้องเลื่อนหน้าจอ,
การทำให้ข้อความวิ่งเข้ามาแสดงที่หน้าเว็บจากด้านข้าง
-การจัดการเกี่ยวกับรูปภาพ
(General Images)
การเปลี่ยนรูปภาพแบบอัตโนมัติโดยที่ไม่ต้องกด,
การทำให้ภาพลอยไปลอยมา,การใส่หิมะให้ตก,
การทำภาพจิกซอวร์ในเว็บ,การทำให้มีภาพลอยตามเมาส์,
การย่อภาพให้เล็กลง(Thumbnail),การทำสไลด์ภาพโชว์
-การจัดการหน้าต่าง หรือเฟรม
(Window and Frames)
การทำให้หน้าต่าง Pop Up ออกมา,การแสดงหน้าจอเว็บ
เต็มหน้าจออย่างอัตโนมัติ,การทำให้หน้าจอเลื่อนลง
แบบอัตโนมัติ,การสร้างหน้าต่างใหม่ออกมาในรูปแบบต่างๆ
-การเพิ่มลูกเล่นให้กับข้อมูลเอกสารในเว็บไซต์
(Document effects)
สร้างฝนตกในหน้าข้อมูล,มีฟ้าผ่า,การทำ Drop Down เมนู
ในการดูข้อมูลในเว็บ,มีดวงดาววิ่งไปมาในหน้าเว็บ,
การสร้างแว่นขยาย เพื่อดูตัวอักษรในเว็บ
-การเพิ่มลูกเล่นให้กับเมาส์และเคอร์เซอร์
(Mouse and Cursor)
ใส่หางให้กับเมาส์เมื่อมาวางไว้ที่หน้าเว็บคุณ,
การสร้างเอฟเฟ็กให้กับเมาส์เมื่อเลื่อนไปมา
-การใส่วันที่,เวลา และปฏิทินในเว็บไซต์
(Date,Time and Calendar)
การแสดงวันที่ เวลา หรือนาฬิกา ที่หน้าเว็บของคุณ,
การนับถอยหลังภายในเว็บ,การแสดงปฏิทิน
ในรูปแบบต่างๆในเว็บไซต์ของคุณ
สามารถหามาใช้และใส่ในเว็บไซต์ได้ง่ายๆ โดยมีเว็บไซต์หลายๆเว็บ
ที่ให้ข้อมูลเหล่านี้อยู่ ซึ่งสามารถไปนำมาใช้ได้ฟรี
ใส่ DHTML มากๆ ระวังเครื่องช้า
เนื่องจากการทำงานของ DHTML เป็นการงานที่
เครื่องของผู้ใช้ (Client) หากใส่ลูกเล่น DHTML ต่างๆ
ในเว็บไซต์นั้นมากจนเกินไป ก็อาจะทำให้เครื่องคอมพิวเตอร์
ของผู้ใช้ช้าลงได้ โดยเฉพาะหากเครื่องคอมพิวเตอร์บางคน
ที่เป็นสเป็กต่ำๆ ก็อาจจะเครื่องคอมพ์นั้นอืดไปได้เลย
ดังนั้นจะใส่ลูกเล่น DHTML อะไรลงไปในเว็บ
ก็อย่าใส่มากจนเกินไป และก็ควรเช็ก เมื่อ DHTMLแสดงผลแล้ว
มันกินทรัพยากรของเครื่องผู้ใช้ไปแค่ไหน
ในการใช้ DHTMLกับเว็บไซต์นั้น สามารถนำมาประยุกต์
ผสมผสาน หรือเพิ่มเติม ทำให้เพิ่มความสามารถและลูกเล่น
ที่หลายเว็บไซต์อาจจะไม่เคยทำมาก่อนเลยก็ได้ แต่ทั้งนี้
และทั้งนั้นต้องขึ้นอยู่กับความคิดสร้างสรรค์
ที่จะนำสิ่งเหล่ามาประกอบกันเป็นผลงานชิ้นใหม่ๆ
