Working with CSS sprites in Fireworks CS6

CSS Sprites Export Options

CSS Sprite เป็นเทคนิคสำคัญสำหรับการพัฒนา Web Page ในปัจจุบัน เพราะสามารถช่วยลดจำนวนของ HTTP Request ซึ่งจะช่วยให้ Web Page สามารถ load ได้รวดเร็วขึ้น Sprite Image ก็คือ Graphic File ที่ภายในประกอบไปด้วย Graphic หลายๆรูปที่เอามาจัดเรียงไว้ภายใน file เดียว ซึ่งเวลาเรียกใช้งาน เราก็จะอาศัย CSS ในการบอกตำแหน่งพิกัด ความกว้าง ความยาว ของ Grpahic ที่เราต้องการใช้งาน สำหรับวันนนี้อยากจะมาแนะนำการใช้ Adobe Firework CS6 ในการสร้าง Sprite Image ซึ่งข้อดีของการใช้ Adobe Firework ก็คือ มันจะคำนวณตำแหน่งพิกัด ความกว้าง ความยาว และ Generate ออกมาเป็น CSS ให้เราสามารถนำไปเรียกใช้งานได้เลย โดยที่เราไม่ต้องมาเสียเวลาสร้าง CSS ขึ้นมาเอง ซึ่งสามารถช่วยลดเวลาในการ develop ลงได้อย่างมากเลยทีเดียว สำหรับขั้นตอนการใช้งาน Adobe Firework ในการสร้าง Sprite Image สามารถศึกษาได้จากบทความความของ Adobe ซึ่งเขียนโดย Prinyanka C. Herur ตาม link นี้ครับ http://www.adobe.com/devnet/fireworks/articles/css-sprites.html

แหล่งที่มา: http://www.adobe.com/devnet.html