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

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

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

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

ถึงเวลาที่จะจัดการกับสาเหตุเหล่านี้กันแล้วครับ จากหลักการที่ว่า ความเร็วในการใช้ แสดงผลเว็บเพจขึ้นอยู่กับขนาดของไฟล์แต่ละหน้า ( Text + รูปภาพ) ถ้าอยากให้แสดงผลได้เร็ว ผลรวมของไฟล์ไม่ควรเกิน 100-200 KB เอาล่ะครับเรามาแก้ปัญหาเรียงลำดับไปทีละข้อกันเลย

ลดขนาดรูปภาพให้เล็กลง (สวยคงเดิม)

ขนาดของรูป (เมื่อไม่คิดถึงวิธีการบีบอัดข้อมูล) ก็จะมีขนาดจากผลคูณของความกว้าง ความยาว และจำนวนสีของรูป จากสมการ

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

คุณจะเห็นได้ว่า วิธีลดขนาดรูปที่ง่าย ๆ ก็คือลดจำนวนสีลง คุณภาพของรูปจะลดไป ไม่มากนัก มีคำถามว่าจะลดไปเหลือกี่สี พิจารณากันได้ง่าย ๆ ครับ ถ้าเป็นรูปกราฟิกง่าย ๆ ที่ทั้ง รูปมีสีแค่ 3-4 สี ก็อาจจะลดลงจนเหลือแค่ 3 บิตหรือ 8 สีก็ยังได้ แต่ถ้าเป็นรูปถ่ายของคน ทิวทัศน์ งานเทศกาล ฯลฯ ไม่ควรจะลดลงต่ำกว่า 8 บิต หรือ 256 สี ไม่เช่นนั้นจะทำให้รูปหมดสวยไปเลย ก็ได้ ให้ทดลองดูครับ

การจัดเก็บไฟล์ด้วยฟอร์แมตที่แตกต่างกัน ก็จะได้ขนาดไฟล์ที่แตกต่างกัน ในเว็บเพจปัจจุบัน เรานิยมใช้กันอยู่ 3 ฟอร์แมต คือ GIF, JPG และ PNG ซึ่งจะมีการบีบอัดข้อมูลให้มีขนาดเล็กลง แต่ถ้าเราใช้ โปรแกรมช่วยบีบอัดลงอีกก็จะได้ขนาดเล็กลงไปอีก เช่น โปรแกรม Ulead Smart Saver Pro, JpegOptimizer หรือ GifClean เป็นต้น สำหรับท่านที่นิยมใช้โปรแกรม Photoshop ในการตกแต่งรูปภาพ ผมแนะนำให้อัพเกรดขึ้นเป็นเวอร์ชั่น 5.5 หรือสูงกว่า เพื่อจะได้ใช้คุณสมบัติของการบีบอัดภาพใช้ในเว็บเพจแบบเต็มร้อย รวมทั้งสนับสนุนการบีบอัดภาพในฟอร์แมต PNG ด้วย ดูรายละเอียดแนะนำโปรแกรมได้ที่หัวข้อ Reviews Programs

ส่วนใหญ่เราจะใช้แค่ 3 ฟอร์แมตนี้เท่านั้น ถ้าคุณสังเกตสักนิดว่า ไฟล์ที่มีขนาดเท่ากัน ไฟล์ GIF จะแสดงผลได้เร็วกว่าเพราะการคลายไฟล์ออกมาแสดงผลผ่านบราวเซอร์ทำได้เร็วกว่า ไฟล์ JPEG (ซึ่งมีกระบวนการบีบอัดที่ซับซ้อนกว่า) ดังนั้นถ้าไม่ใช่ไฟล์รูปภาพที่มีสีจำนวนมากแล้ว ให้จัดเก็บเป็นไฟล์ GIF จะดีที่สุดสำหรับ โฮมเพจของคุณ แม้ว่าขนาดไฟล์จะโตกว่าไฟล์ JPEG ก็ตาม (รายละเอียดของภาพ (resolution) ไม่ควรเกิน 72 dpi

สำหรับไฟล์ฟอร์แมต PNG เป็นการนำเอาคุณสมบัติที่ดีเด่นของไฟล์แบบ GIF + JPG มารวมกัน นั่นคือสนับสนุนสีได้มากกว่า 256 สีแบบ JPG แต่เทคโนโลยีการบีบอัดภาพให้ขนาดเล็กลงใช้แบบ GIF มีการแสดงผลแบบ Interlace และแน่นอนสามารถทำภาพแบบโปร่งใสได้ด้วย ที่นิยมใช้กันมีอยู่ 2 แบบคือ PNG-8, PNG-24 ต่างกันที่จำนวนบิตสีที่จัดเก็บ ลองเอาไปใช้กันดูนะครับ ในเว็บไซต์ของผมนี่ภาพที่แสดงผลในช่วงหลังๆ ก็มีแบบ PNG มากขึ้นแล้ว

จำกัดขนาดไฟล์ให้เหมาะสม

พยายามจำกัดขนาดของไฟล์ให้พอเหมาะ โดยเฉพาะในเรื่องความยาวในแต่ละหน้า ถ้ามีหลายหัวข้อและแต่ละหัวข้อก็มีข้อความยาว และภาพประกอบอีกมากมาย คุณก็ควรจะแบ่ง ซอยให้แต่ละหัวข้อไปอยู่กันคนละหน้า โดยมีหน้าแรกเป็นตัวเชื่อมโยงไปยังหน้าอื่น ๆ ตัวอย่าง ดังเช่นในหัวข้อ "Basic HTML" นี้ผมแบ่งย่อยออกเป็นหลายหน้าตามหัวข้อย่อย บางหัวข้อย่อยก็ยังซอยออกเป็นหลายหน้าอีก โดยให้หน้าที่ 1 (ไฟล์ basichtml.htm) เป็นหน้าหลักของชุด แล้วเชื่อมโยงไปยังหน้าอื่น ๆ ในทุกๆ หน้าสามารถย้อนกลับมาที่หน้าที่ 1 ได้เสมอ

ปิด Tag บ่อย ๆ อย่าปล่อยไว้ห่างเกินไป

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

กำหนด Tag ผิด หรืออ้างผิดชื่อ

ส่วนใหญ่จะเป็นการอ้างถึงพวกไฟล์รูปภาพภายในไซต์ แล้วอ้างอิงผิดทำให้โหลดภาพ ไม่ได้ ซึ่งเป็นได้หลายกรณีเช่น ใส่ชื่อไฟล์ผิด (ตัวอักษรตัวเล็ก/ใหญ่ไม่ถูกต้อง) ปัญหานี้จะไม่เกิด ขึ้นในเครื่องของผู้เขียนที่ใช้โปรแกรมใน Windows แต่เมื่อนำไปฝากไว้ในเซอร์ฟเวอร์ที่เป็น UNIX จะเกิดปัญหาทันที เพราะในโฮสต์ที่เป็นยูนิกซ์นั้น การใช้ตัวอักษรตัวเล็ก/ใหญ่ จะมีความหมายที่ แตกต่างกัน เช่น Picture.jpg ต่างจาก picture.jpg หรือ picture.JPG ต่างจาก picture.jpg ดังนั้น บราวเซอร์จึงไม่สามารถแสดงผลได้ อีกกรณีหนึ่งคือ การเก็บไฟล์ในโฟลเดอร์ เมื่ออ้างถึงไฟล์จะมีความแตกต่างจากใน Windows คือ ในวินโดว์ปกติจะใช้รูปแบบเป็น images\picture.jpg หรืออาจใช้ images/picture.jpg ก็แสดงผลได้ถูกต้อง แต่ในยูนิกซ์ใช้ได้เฉพาะตัวหลังเท่านั้น

Link ตาย หาไฟล์ไม่เจอ

ถ้าคุณคลิก Link แล้วเกิด Error โดยบราวเซอร์แจ้งว่า 404 Not found นั่นแสดงว่า ไม่มี เพจที่อ้างถึง แสดงว่าคุณเขียน URL ของลิงค์นั้นผิดตรงไหนสักที่หนึ่ง หรือถ้าเป็นไซต์อื่นเขาอาจ จะย้ายไปที่ URL อื่นแล้วก็ได้ ทำให้ผู้ชมเกิดอาการหัวเสียพอ ๆ กับคลิก เข้าไปแล้วพบแต่ภาพของ รถแทรกเตอร์ หรือคนขุดดินไม่มีสิ้นสุด พร้อมกับคำว่า Under Construction ทำให้คนที่หลงเข้าไป ได้รับความรู้ใหม่ว่า เพจนี้ยังสร้างไม่เสร็จ (หรืออาจจะยังไม่เริ่มสร้างด้วยซ้ำ) คุณควรหลีกเลี่ยง การทำจุดเชื่อมโยงลักษณะนี้ ถ้ายังไม่เสร็จก็อย่าพึ่งสร้างลิงค์เข้าไปดีกว่า

เสียงเพลงสร้างความสุขสันต์ หรือทำลายฝัน

การใส่เสียงเพลงเป็นแบคกราวด์ประกอบอาจจะเป็นฝันร้ายของผู้เข้าชมก็ได้ โดยเฉพาะ เว็บเพจที่มีสีสันและรูปภาพมากมายเป็นพิเศษ จะยิ่งทวีความช้าเป็นเท่าทวีคูณ ถ้าคุณอยากใส่ เสียงเพลงจริง ๆ ก็น่าจะใส่โดยการสร้าง Console ควบคุมให้ผู้ชมคลิก เปิดฟังเอง ไม่ให้เล่นโดยอัตโนมัติ