Web Design

Category Page Improvements


Sometimes, shopping category pages can be just as important as the actual product listing page. Category pages set the tone for how your users will be able to find the products they are looking for. When converting these category pages, my goal was to remove the clutter, make everything more visual, and just make it easier for the user to get to the products they want. I also did not have a budget to include any programming time with these pages, so the only changes I could make were to image paths, css, or JQuery. What you'll find below are before and after shots of each page.

Before & After: Bottles Landing Page

My main problem with this page (Before is on the left) was that there was no direction. I never really knew where we were trying to send users or what they were supposed to be looking for. The images are tiny. The text is all over the place. There's no focus and nothing pulls my eye in immediately. It reads like a giant, Moby Dick sized book with no direction. So I cleaned it all up, used larger photos, & hid some of the SEO fluff behind a :hover effect. I also only left the important links visible and seperated them enough to have them stand out more.

Before & After: Individual Bottle Pages

These pages are again the original code. The only html changes were the images. These original pages were also a bit confusing, with a massive amount of text covering the page. Nothing was highlighted, the links blended in with the rest of the text, and there wasn't anything visual to guide the user. Some of the original images didn't even have a label in them. They were just of a water or beer bottle. Finally, I would have liked to get rid of the useless "Beer Bottle Tips" & "Water Bottle Tips" sections, but I was not allowed to. Nothing is worse to me than a giant section of text that spends half of its time trying to explain what it is... After the changes, we were able to gain a few spots on the SERP's and the conversion rates went up. Sometimes, it's best to just K.I.S.S.

Copyright 2014 - Dave Waring

Orlando, FL

www.HireDaveWaring.com is a fully responsive portfolio website that was built 100% from the ground up in ASP.Net, by Dave Waring.