Cathedral of St. Louis
Website Design
The Backstory
At the beginning of the pandemic, Msgr. Henry J. Brier, the rector of the Cathedral Basilica of St. Louis, in St. Louis, MO, wanted a better way to engage with parishioners. With unfortunate limitations on in-person attendance, he quickly realized that his parishioners’ attention would shift to the Cathedral’s online presence and he came to us looking for a solution.
Their old website felt dated, was unusable on mobile devices, and failed to convey the transcendence and beauty of this historic church. Unlike most Catholic churches today which have about a 50/50 split of users on desktop vs mobile devices, the Cathedral, because it’s an historic destination, receives 66% of its traffic from mobile devices. It was therefore necessary to build an easy-to-edit, mobile-friendly website capable of meeting all their needs.
The Challenge
- Their legacy website felt dated, did not meet contemporary design standards, and was unusable on mobile devices.
- The old website was focused on the church, placing its needs first. It was impersonal and tried to mitigate interactions with staff. The sitemap struggled to balance users’ needs with the Cathedral’s needs making it difficult to find information.
- The Cathedral of St. Louis had recently started using a new live streaming service they were comfortable with and did not want to change to a new streaming service.
- Staff would be responsible for updating some, but not all content on the new website. Having an easy-to-use CMS would be important.
- Because the new site would be seen by many non-Catholics, having evangelistic content that helps them understand the faith would need to be developed.
The Strategy
User Experience and Information Architecture
- Focus on serving parishioners and tourists by placing their needs in key locations.
- Use information on website to foster relationships with staff and clergy rather than mitigate them.
- Consolidate navigation of the website to seven or fewer categories that represent information users are looking for. All other information must be grouped under these categories.
- Develop an information architecture that places the user’s experience at the center. Use the new information architecture to help guide decisions about page layout and hierarchy, carefully placing content so users can easily find what they need.
- Create engaging ways to share the historical value of America’s most beautiful church without overwhelming the user with large blocks of content.
Web Design
- Visually engage users and draw their attention to the information they came to find.
- Update color palette to help unify the entire design of the website, create consistency, and strategically guide users to key information.
- Curate images to highlight the beauty of the Cathedral and reduce verbiage and use clear headlines and simple calls-to-action.
Why it Works
Our approach focused on a simpler, more navigable menu for an active, complex Church. We ensured tourists could easily navigate to their information and parishioners to theirs by properly categorizing pages.
Updating the visual quality of the website allowed us to create consistency in styles for buttons, headlines, and calls-to-action. These visual clues improve the user’s experience by helping their eye to jump from element to element based on similarity in style so they can more easily find what it is they’re looking for.
Improving the way that users interact with the Cathedral Basilica of St. Louis helps build “brand loyalty.” Brand loyalty in this case means that a person is more likely to return to the Cathedral’s website and take a second action. We focused on improving the experience by improving communication and creating multiple points of contact with the parishioner.
