ฐานความรู้

เว็บเพจที่มีรูปเยอะใช้เวลาโหลดนานเพราะเกิด server request หลายครั้ง Image Sprite เป็นรูปเดี่ยวๆ แต่ประกอบไปด้วยหลายรูป

เราสามารถใช้ Image Sprite เพื่อลดจำนวน request เป็นการลดแบนวิท และลดเวลาในการโหลดเว็บได้อย่างมีประสิทธิภาพ

การทำ Image Sprite เราต้องเขียน css เพื่อควบคุมการแสดงผล ซึ่งเขียนเองไม่ยาก แต่มีเว็บแนะนำซึ่งเว็บนี้จะสร้าง Image Sprite และเขียน CSS มาให้โดยอัตโนมัติ โดยมีวิธีการดังต่อไปนี้

1. เข้าไปที่เว็บ https://css.spritegen.com  จากนั้นให้อัพโหลดรูปแล้วกดปุ่ม "Create Sprite" 

2. เว็บจะสร้าง Image Sprite จากรูปที่เราอัพโหลด ให้เราคลิกขวาแล้วกด save จากนั้นให้อัพโหลดขึ้น server เพื่อนำไปใช้งาน

3. ให้เราคัดลอก html และ css ไปใช้กับเว็บเพจ โดยต้องใส่ url ของ image sprite ให้ถูกต้องด้วย

นอกจากการทำ css sprite แล้วเราควรหา host คุณภาพเพื่อให้เว็บของเราโหลดไวขึ้น