Color Swatch Solution

Created a feature that helped to expose more color options while preserving SEO value.

Color Swatch Solution

Created a feature that helped to expose more color options while preserving SEO value.

Color Swatch Solution

Created a feature that helped to expose more color options while preserving SEO value.

Designer

Role

2017

Year

SEO Visibility

Context

On the Sierra Trading Post website, we had many products that had lots of color options. These products had color swatches that couldn't all fit within the confines of a product listing page. Because of this, we would lose some SEO value of having those color options listed on that category of page. A solution was needed to be able to retain SEO value while avoiding a total rework of the product listing page layout. 

Context

On the Sierra Trading Post website, we had many products that had lots of color options. These products had color swatches that couldn't all fit within the confines of a product listing page. Because of this, we would lose some SEO value of having those color options listed on that category of page. A solution was needed to be able to retain SEO value while avoiding a total rework of the product listing page layout. 

Context

On the Sierra Trading Post website, we had many products that had lots of color options. These products had color swatches that couldn't all fit within the confines of a product listing page. Because of this, we would lose some SEO value of having those color options listed on that category of page. A solution was needed to be able to retain SEO value while avoiding a total rework of the product listing page layout. 

Sketches and Ideation

In the ideation and brainstorming phase of this project we identified the business objectives and users needs, using them to create our roadmap. This project being a smaller feature, as opposed to a larger user flow, we aimed to create a simple solution that would satsify these needs.

Final Product

I ended up creating a solution that involved initially hiding some of the color options behind a hover area. The customer was told that there were more options for colors with a "+2 More" appended to the last available space in the color swatch. We learned that most of the time, customers would hover over the visible color options to see an example of the product in that color. When the customer does this, the color swatch area expands to reveal all available colors and the ability to preview the new colors as well. 

Impact

The benefit of this feature was that is preserved SEO value by keeping the color options within the markup of the product listing page, while also leveraging the hide/hover aspect to keep the product within the current structure and layout of the site - saving the company development time and money. 

Impact

The benefit of this feature was that is preserved SEO value by keeping the color options within the markup of the product listing page, while also leveraging the hide/hover aspect to keep the product within the current structure and layout of the site - saving the company development time and money. 

Impact

The benefit of this feature was that is preserved SEO value by keeping the color options within the markup of the product listing page, while also leveraging the hide/hover aspect to keep the product within the current structure and layout of the site - saving the company development time and money.