Faceted Navigation

What is Faceted Navigation? Faceted navigation is when the navigation changes on a page based on the filtering options offered by the web site. This is often seen on large e-commerce sites that let you filter products by color, size, price, and other specifications.

The ideal URL. In an ideal state, unique content would have only one accessible URL. This URL would have a clear click path that follows a category > sub-category > page structure. This structure consist of one representative URL for individual categories and one representative URL for each article/product.

What we don’t want is numerous URLs for the same article/product and/or numerous category pages that provide little or no value to searchers and search engines.

Article/Product Page Example

Canonical: example.com/product.php?item=swedish-fish
Duplicate: example.com/product.php?item=swedish-fish&category=gummy-candies&price=5-10

Category Page Example

Canonical: example.com/category.php?category=gummy-candies&taste=sour
Duplicate: example.com/category.php?category=gummy-candies&taste=sour&price=over-10

Issues Relate to Faceted Navigation

5 Ways NOT to Implement Faceted Navigation

1. Use non-standard URL encoding or parameters, like commas or brackets, instead of “key=value&” pairs.

Worst Practice 1: example.com/category?[category:gummy-candy][sort:price-low-to-high][sid:789]

  • Key value pair marked with : rather than =
  • Multiple parameters appended with [] rathe than &

Worst Practice 2: example.com/category?category,gummy-candy,,sort,lowtohigh,,sid,789

  • Key value pairs marked with a , rather than =
  • Multiple parameters appended with ,, rather than &

Best Practice: example.com/category?category=gummy-candy&sort=low-to-high&sid=789

2. Using directories or file paths rather than parameters to list values that don’t change page content.

Worst Practice: example.com/c123/s789/product?swedish-fish

  • Where /c123/ is a category, /s789/ is a sessionID that doesn’t change page content

Good Practice: example.com/gummy-candy/product?item=swedish-fish&sid=789

  • The directory, /gummy-candy/,changes the page content in a meaningful way

Best Practice: example.com/product?item=swedish-fish&category=gummy-candy&sid=789

  • URL parameters allow more flexibility for search engines to determine how to crawl efficiently

3. Converting user-generated values into (possibly infinite) URL parameters that are crawlable and indexable, but not useful in search results.

Rather than allow user-generated values to create crawlable URLs — which leads to infinite possibilities with very little value to searchers — perhaps publish category pages for the most popular values, then include additional information so the page provides more value than an ordinary search results page. Alternatively, consider placing user-generated values in a separate directory and then robots.txt disallow crawling of that directory.

Worst Practice: example.com/find-a-doctor?radius=15&latitude=40.7565068&longitude=-73.9668408

Best Practice: example.com/find-a-doctor?city=san-francisco&neighborhood=soma

4. Appending URL parameters without logic.

Extraneous URL parameters only increase duplication, causing less efficient crawling and indexing. Therefore, consider stripping unnecessary URL parameters and performing your site’s “internal housekeeping” before generating the URL. If many parameters are required for the user session, perhaps hide the information in a cookie rather than continually append values

Worst Practice: example.com/gummy-candy/lollipops/gummy-candy/gummy-candy/product?swedish-fish

Best Practice: example.com/gummy-candy/product?item=swedish-fish

Worst Practice: example.com/product?cat=gummy-candy&cat=lollipops&cat=gummy-candy&cat=gummy-candy&item=swedish-fish

Best Practice: example.com/product?item=swedish-fish&category=gummy-candy

5. Offering further refinement (filtering) when there are zero results.

Prevent useless URLs and minimize the crawl space by only creating URLs when products exist. This helps users to stay engaged on your site (fewer clicks on the back button when no products exist), and helps minimize potential URLs known to crawlers. Furthermore, if a page isn’t just temporarily out-of-stock, but is unlikely to ever contain useful content, consider returning a 404 status code. With the 404 response, you can include a helpful message to users with more navigation options or a search box to find related products.

Worst Practice: Allowing users to select filters when zero items exist for the refinement.

Best Practice: Only create links/URLs when it’s a valid user-selection (items exist). With zero items, grey out filtering options. To further improve usability, consider adding item counts next to each filter.

 

Resources:
GSC Blog: “Faceted Navigation Best & Worst Practices”