Web page performance is critical to keeping customers and visitors moving along on your site. Slow responses typically result in frustrated users, unhappy customers and worse, abandoned orders. It is important to reduce the number of requests generated by a web page in order to increase its actual and perceived performance.
One critical way is to reduce the number of external files loaded by a page. Another one is to reduce their size through compression. This post aims to take this concept a step further by automating this tedious process using open-source libraries.
[click to continue…]
Kriesi Budschedl has posted a very detailed tutorial to help you build your own Apple.com style menu and adds a nice touch by animating it.
To construct the basic menu, Kriesi takes advantage of CSS Sprites, a technique to reduce the number of image files necessary to accomplish things like rollovers, without the need to preload the images using JavaScript.
A single image contains all the navigation menu options in their normal and active states and CSS rules are used to move the appropriate menu option into view. Once the basic menu is working, animation is added by using Kwicks for jQuery, a plugin written by Jerry Martin, resulting in the final product seen here.
