The URL Structure of Faceted Navigation

Faceted navigation is the collection of UI elements and functionality which provide the ability to filter and refine category views. There is some debate in the SEO, UX and general web development communities about the best way to present faceted navigation in the URL.

Faceted navigation, such as filtering by color or price range, can be helpful for your visitors, but it’s often not search-friendly since it creates many combinations of URLs with duplicative content.

Faceted navigation best (and 5 of the worst) practices

The correct way to denote facets in a URL is through the use of query parameters. However, some believe that virtual subdirectories present a better alternative for SEO and UX. We’ll compare the different options for including facets in a URL, starting with simplistic examples of each method.

Learn how to best structure faceted URLs for SEO and UX

Good UX Is Good SEO

Google has a long standing tradition of encouraging a better web by updating its algorithms to benefit sites that offer a positive user experience (UX) and penalize those that don’t. As Google Webmaster Matt Cutts explains, “we try to help people make the web a better experience, so people will be on the web longer, and people will be happier … for example, we never show popup ads on Google. Even though it might have meant a little bit more money up front, because we also knew it would also annoy users and make them less likely to come back.”

Learn how Google has demonstrated that good UX is good SEO

The Appropriate Use of Modals

Modal windows are designed to enhance user experience by presenting new content situationally. By definition, these interstitials obstruct user flow by preventing interaction with the main application. This UI element generally requires a user interaction to initiate its display; however, a page load, scroll event, or an arbitrary timeout is not a justifiable “interaction” for the presentation of a modal window. Presenting a modal window without an appropriate prequalifying event not only disrupts user flow and concentration, it also introduces frustration and confusion.

Learn how and when to use modals

Designing & Optimizing Favicons

Favicons, or favorites icons, provide users a visual way to differentiate between a browser’s tabs, bookmarks, favorites, and history items. Depending on browsing habits, a user may have more exposure to a website’s favicon than its logo. To craft a favicon that improves user experience and entices users to return to a site, authors should ensure that the favicon is unique, crisp and well optimized.

Learn how to create optimized favicons

Ambient Video

Ambient videos create engaging, “interactive” layouts by setting a video as the background of a page or a section of a page. While this design technique can evoke a powerful emotional response, special care must be taken to ensure that implementation does not negatively impact user experience.

As a rule, ambient videos (also referred to as “environmental videos” or background videos) should not include audio. Generally, these videos do not require user interaction to begin playback and loop seamlessly. In many ways, ambient videos resemble animated GIFs; cinemagraphs are particularly well suited for ambient videos.

Challenges of ambient video include accessibility, playback compatibility, and performance.

Learn how to create ambient videos
©2019 Joey Hoer. All rights reserved.