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
Challenge
Improve content taxonomy and navigation experience for a food and recipe website
What We Did
Audited site content with editorial team
Conducted open and closed card sorts
Updated taxonomy and category names based on user feedback
Redesigned global navigation and category landing pages
Results
Recategorized site content into 20 updated categories
Increased user satisfaction with navigation experience
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.”
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.