When Zazzle.com Inc. set about redesigning its e-commerce site, the company decided early on that how the site should perform was equally as important as how it would look.
Zazzle is an online retailer of personalized merchandise such as T-shirts, coffee mugs, bags, postcards, buttons and postage stamps. The site is as much a digital community and social networking hub for artists, entrepreneurs and small business owners as it is a web store. Zazzle combines a just-in-time manufacturing process with easy-to-use online design tools and a large collection of digital images from The Walt Disney Co., the Library of Congress and others.
This combination enables consumers and businesses to design and store personalized images and create custom merchandise. Zazzle.com, No. 214 in the Internet Retailer Top 500 Guide, includes hundreds of thousands of digital images from artists and creative consumers worldwide.
But after almost five years, an outdated design was beginning to affect site performance. Zazzle also wanted to create a new look and navigation that showcased its product line and got customers more quickly to its top-selling merchandise. To improve performance, Zazzle created a style guide, eliminated all unnecessary HTML coding and organized page elements to load in a specific order.
The changes were simple, but effective. With a new style guide that includes all of the site’s color palettes, style sheets and other layout elements, web programmers are no longer creating ad-hoc pages or adding unneeded coding or images to a product page. Instead they can use the style guide to find and implement common colors and universal style elements.
Zazzle also went through each of its page designs and eliminated all unnecessary cascading style sheets. A cascading style sheet is a style sheet language that developers use to define page colors, fonts and layouts. By reducing the number of sheets designers were using to create and update pages by 50%, the company has seen a significant decrease in the time it takes to load a product page. A visitor using a high broadband connection can now load a page in about three seconds, compared with about seven seconds with the old design. “This site is all about dynamic product creation,” says Zazzle. “We’re making the creation process easier.”
Back...