There’s always plenty of designing, re-designing, and start-from-scratch-and-then-re-design again that goes on here at Zazzle behind the scenes. We’re perfectionists. One of those “can we make it any better?” projects has involved some style changes for the Zazzle site, and we’ve been toying with the idea for a while now. The more we thought on it and the more we played with it the more we felt that Zazzle’s “doo” was a little too 2008. So, operating under the “less is more” principle, we decided to give Zazzle a haircut. Maybe it’s more of a trim, actually. Here’s what we did:
The first thing was to chop off the gray background gradient outside of the main 900px wide content area. After we did, the whole page immediately felt lighter and we knew we were on the right track.
While we were shaving off visual page weight, the gray backgrounds behind the side navs had to go too. There was no longer any framing element for the left nav decoration to sit against.
With the left and right framing elements gone, we needed to stretch both the header and the footer to 100% of browser width. Doing so gave us a good top-bottom balance and it left the content area plenty of room to breathe and stretch out a little. I happen to love the new footer style and the way it now serves as a good counter-balance to the relatively heavy header.
You may have also noticed that we’re playing with some different button colors. We’re tweaking the bright orange button to call more attention to it. We’ve also livened up the standard gray buttons by making the label color match our link color and lightening the gray background. We believe the later changes will afford more clicks and less head scratching over what looked like, to some, a disabled button.
Zazzle’s “haircut” isn’t just about slimming down some of the visual page weight. A nice side effect of reducing heavy colors and backgrounds is that we save ourselves some actual page weight, i.e., the amount of “stuff” the browser needs to fetch from our servers. Snappy page load and rendering times are critical for conversions, so the more work we do to speed things up the better. In fact, image request reduction is only one of many changes we plan to make in short order in the name of increased page speed. Most of these changes may be entirely transparent to our users, but we hope the reduced rendering time will be dramatically obvious. Stay tuned for that. Many great things ahead.