Site Footer

Know Your Pet DNA by Ancestry

Overview

Know Your Pet DNA is a dog DNA testing platform by Ancestry, a leader in consumer genetic testing.

The original Know Your Pet DNA site footer was a simple horizontal list of links that lacked structure, visual hierarchy, and key functionality. As the product evolved, we needed the footer to serve dual purposes: marketing to visitors and providing utility to logged-in members. Here you can see the results of our addressing this backlog item.

Key Objectives

Add email capture functionality across the site
Organize navigation links with room for growth
Create distinct experiences for logged-in vs. logged-out users
Improve visual hierarchy and breathing room

The Solution

Structural Improvements

Multi-column layout replaced the single-row design, organizing links into logical groupings with clear visual hierarchy. This structure accommodates future page additions without cluttering the interface.

Branding addition - The "Know Your Pet DNA by Ancestry" logo now anchors the footer, reinforcing brand identity at every scroll endpoint.

Feature Additions

Newsletter signup: A prominent email capture module with input field and subscribe button now appears on marketing pages, converting visitors at a key decision point.
Social proof: Facebook, Instagram, and TikTok icons provide easy access to the brand's key social media channels.
Member-specific navigation: A dedicated column for logged-in users includes My Pets, Messages, Member Benefits, and Survey links.

Dual-State Design

Light version (logged-out) - Features the bright lime green background with newsletter signup prominently displayed, optimized for conversion.

Dark version (logged-in) - Uses a sophisticated dark green background, removes marketing elements, and adds member utility links, creating an experience tailored to existing customers.

Responsive Considerations

Mobile layouts maintain the same organizational logic with stacked sections separated by dividers, ensuring usability across all devices.

Results

The redesigned footer transforms a simple navigation element into a strategic component that captures leads, serves distinct user segments, and scales with product growth.