San Francisco Zoo & Gardens

As SF Zoo’s main connection to the public, sfzoo.org is where visitors buy tickets, become members, donate, and register for events. It also holds information about volunteer and education programs, and gives the Zoo a place to share its conservation work. The existing WordPress site was more than a decade old and built as standalone pages, which made it harder to keep content current and to organize a growing library of animals, events, and stories. Through a full website development project, the Zoo saw an opportunity to create a digital space that is easier to explore and engage with, one that reflects the care it shows its animals and keeps pace with the forward-looking organization it is.

A flexible WordPress foundation: We rebuilt sfzoo.org with custom WordPress development, replacing the old page-by-page setup with a system the Zoo's team can more easily manage day to day. A set of custom post types and blocks provides flexible, reusable pieces for building and updating pages. Built to be fully responsive, the site now works reliably across all devices. It integrates with the Zoo's existing ticketing and payments platform, Accesso Passport, so visitors can buy tickets, join, give, and register for events, with forms routing inquiries to the right team. A refreshed blog also gives the Zoo a modern home for timely stories, with space for staff-authored articles that share the behind-the-scenes work of the team.

Structure for complex audiences: Site architecture was a foundational part of this project. Our design and development team collaborated closely with SEO and analytics partners at Column & Row whose audits and research shaped the sitemap, URL hierarchy, and schema. Content strategist, Michael Marshall, built content outlines and provided copywriting support for key high-traffic pages. Their work produced a thoughtful, SEO-driven structure, while the custom post types organize content so visitors can easily find what they need.

A joy-filled design: The website design brings the joy and wonder of a day at the Zoo. Photography treatments lift animals out from their backgrounds, and Lottie animations add a touch of whimsy and fun. A custom quiz block surfaces fun facts about the animals and the Zoo, and offers a nostalgic nod to audio storybook kiosks on the grounds. A historical timeline traces important milestones, reinforcing care and trust. We also did light visual identity work to give the Zoo an expanded brand palette for web.

Accessible design and development: Accessibility was woven into each phase of the project, starting with the sitemap and wireframes. The site was built to WCAG Level AA, with particular attention to the mobile experience for visitors. Wandke Accessibility completed technical testing on four high-traffic pages and collaborated with the Mangrove team on remediation. Using the TranslatePress plugin, the site is available in Chinese, Tagalog, Spanish, and Vietnamese for the Zoo’s local and international audiences.

Together, this work gives the Zoo a digital home that more closely embraces who it is today and helps it carry its mission of care and conservation forward, bringing more people in to visit, join, and support its work.

• Custom design elements: Cutout photography treatments for the animals, paired with Lottie animations, add a touch of whimsy and weave a sense of fun throughout the site.
• SEO-driven site structure: Close collaboration across all project teams shaped a thoughtful architecture that helps visitors find what they need and supports strong search visibility.
• Accesso Passport integration: Links and modals connect to the Zoo's Accesso Passport platform for tickets, membership, donations, gift vouchers, adopt-an-animal, and event registration.
• WCAG Level AA accessibility: Built to WCAG Level AA, with technical testing on four high-traffic pages and remediation in collaboration with Wandke Accessibility.