Serious Eats Taxonomy and Navigation

Creating a better content organization system for users, staff, and SEO.

Company: Serious Eats
Project Date: 2019
Role: Design lead responsible for user research, UX and UI design, and project management
Team: VP of product, engineer, editor in chief

Project Overview

13 years after its founding, Serious Eats’s taxonomy no longer represented the depth and breadth of the food website. My product team wanted to build a new taxonomy in order to make content more findable for readers, staff, and search engines. I worked with editors and users to interpret, sort, and re-name dozens of categories covering thousands of pieces of content. Using the new taxonomy, I redesigned the global navigation and category pages while the editorial team re-organized the content library. Updating the taxonomy system improved the browsing experience and strengthened the brand’s voice. Additionally, it provided a logical structure for editors and contributors to work with.

Problem

Serious Eats evolved over the years from a NY-centered food blog to a trusted source for recipes and food-related articles. However, it relied on an ad-hoc taxonomy system that did not reflect the richness of newer content, which included recipes, technique tutorials, essays, and eating out guides. The global navigation was not comprehensive, and behind the scenes, it was tricky for staff to categorize new posts. The eclectic collection of non-recipe articles was the most challenging to categorize. We also believed that a bad taxonomy led to lower search rankings, which affected viewership.

Serious Eats had more types of content than what was displayed in their navigation, shown here on mobile.

The mobile nav looks like buttons on a microwave.
— Serious Eats User

Objective

Working with editorial and product stakeholders, I had to create a system for organizing content before updating the UI (global navigation and category landing pages). We agreed that the taxonomy should:

  • Help users quickly find relevant content using terms they understand

  • Help editors categorize the library and support overall content strategy

  • Improve SEO by creating a logical, discoverable site structure

Research Methodology

I worked with the editorial team perform a content inventory and audit, then selected a sample that was a good representation of the content variety. That sample was used in an open card sort (n=50) to learn how users grouped content and named categories, followed by a closed card sort (n=50) to validate the new user-generated categories. I also did a competitive analysis of 15 food and recipe websites to assess their taxonomies.

In the open card sort, I asked users to group snippets of sample articles and name the groups.

Research Findings

We learned that users mentally divided content into two main groups: “in the kitchen” and “out of the kitchen” information. “In the Kitchen” meant actionable, instructional information that users “need to know”. “Out of the kitchen” meant interesting information that users found “nice to know”. This mental model was informative for future content creation.

Overall, users sorted content into 24 categories grouped into 5 top-level categories: Recipes, How-Tos, Product Recs, Culture, and Dining Out.

Results from the closed card sort showing how users sorted types of articles (rows) into categories generated during the open card sort (columns)

Creating a New Taxonomy

I worked with the editors to create a logical system for categorizing existing and future content. It was important for the category labels to be user-friendly but also speak in the brand’s voice and reflect its values.

User-generated group labels and hierarchies informed our category names. For example, “Techniques” expanded into “How-Tos” to include instructional content beyond cooking techniques. "Equipment" was re-titled "Product Recs" to reflect the reviews of cookbooks, gear, and gifts.

After engineering implemented the new system, editors re-categorize content in the CMS.

Updating the UI

While editors re-categorized posts behind the scenes, I updated the UI to streamline the browsing experience. I wanted users to be able to see the breadth of content upon landing on the site then easily discover and dive into specific content silos.

Global Navigation

I replaced the icon-heavy “microwave buttons” with an accordion menu on mobile. I also made the desktop fly out less obstructive by removing the icons and “latest content” preview.

Before: Global Navigation

Before: Global navigation on mobile

Before: Global navigation on desktop

 

After: Global Navigation

After: Global navigation on mobile

After: Global navigation on desktop

Category Landing Pages

I updated the “above the fold” area of the category pages to display the subcategories without overwhelming the viewport with icons.

Before: Category Landing Page

Before: Category page on mobile

Before: Category page on desktop

After: Category Landing Page

After: Category page on mobile

After: Category page on desktop

Impact

I ran benchmarking surveys before and after implementation to measure the impact of changes to the taxonomy system, site navigation, and category pages. Users reported higher satisfaction about their experience in navigation and finding content after implementation. Internally, editorial staff found it easier to use these “neater buckets” when categorizing and publishing articles. However, there was no measurable impact on search rankings, which meant that we had to explore other solutions.

Previous
Previous

Dotdash Workflows App

Next
Next

Starch Madness