Church Communications Blog

3 Keys (and a Bonus Tip) to Church Website Design

Written by Joanna Gray | Oct 7, 2015 7:11:00 AM

[This post originally appeared on Tony Morgan's Unstuck Group. We are happy to share it with you, as well.]

It should be easy, right? “If you build it, they will come,” right? So we build a website, talk about it, add information, plan events, and somewhere along the line, we realize it’s not really working. No one is using it or you’re embarrassed by your site. What went wrong?

I’m not sure “if you build it, they will come” was ever really true, and it’s even less true today. A better version is, “if you design it, they will come.” A well-planned church website designed around what your congregation is actually looking for is what you need to “build.” Your congregation only wants a few basic things from your website:

  • Ease of use (how to find stuff)
  • A feeling of engagement (how to care about stuff)
  • A clear idea of what to do next (how to do more stuff together)

How do you help your church come to life online? Below are the three ways we have found to be the most effective at achieving those goals for your congregation. 

Design an Engaging Experience

One of the most effective things you can do is to visually draw your audience into the picture. A great design technique for doing this is called parallax and it’s easier to show than describe:

The parallax design fills the screen with a full-width image, adds text or other elements on top of it and you get a 3-dimensional feeling that you could “step into the picture” and join the congregation. The other trick with a parallax design is the way the panels scroll at different rates and keep the viewer interested and scrolling. This combination of visual and tactile connects with the viewer in a very strong way.

This is a compelling way to tell a story without stopping to tell the story. Your audience engages with the site and gets the full experience even before they start clicking around.

(Bonus Design Tip: Design Responsive)

When was the last time you tried to pull up a website on your phone or tablet only to have to pinch and zoom and squint as you tried to read tiny type or menus that wouldn’t expand. The answer is not bigger type, it’s a fully responsive design that actually displays differently on different devices. The menus still work, too! A great example is Providence Baptist Church. Pull them up on your phone and your desktop and compare the differences.

Just in case you didn’t hear it yet, mobile web usage now exceeds desktop web usage. Back on April 21st, the internet quietly experienced an event dubbed “Mobilegeddon.” On that day, Google started giving lower search rankings to sites that weren’t mobile friendly. Did that affect your website? Hopefully not. But it’s more important than ever to keep up with modern design and technology. This tool can help you check your site: the Responsinator.

Design Clear Next Steps

It’s time to design the “path” you want your congregation to travel. Everyone who visits a church’s website is at a different stage in their spiritual journey. There are ways to engage with them all no matter where they are.

People who are new to your church are looking for information about what to wear or where to park. Folks who are more engaged are looking for ways to get more involved, start to volunteer and give back to the community.

On the “New Here” page, you should have information about nursery options, Statement of Faith and a Welcome note. While a website reader is learning about missions, perhaps you could offer them a link to a local ministry volunteering opportunity.

Start to think through how you could lead your congregation through your church. Design space on the pages to provide those links. Think through the different paths and the information your readers will want at various stages. You can learn more about Next Steps if you’re interested. The churches mentioned here have good examples of this. But the real pro at this kind of thing is Amazon. If you have a movie in your cart, they recommend, the sequel; if you’re ordering tools, they show the toolbox. Start to look for examples in your everyday life.

Design for Flexibility

From one month to the next, a church can be very different. A church website needs to be designed to have room for different areas of focus.

Having an area about special events can be really pointless and make your congregation looks pretty dead if it shows a calendar that happens to be empty. If you’re promoting a new sermon series or podcast, it would be great if you could use your web design to immediately grab your audience’s attention.

A great church website design can easily switch focus like this. Your website is like a little slice of life -- you need a design that can grow and change through the seasons of your church.

Flexibility is necessary to show what’s current, and how to get involved. A great example that can easily be updated is Eagle’s Landing Church. To meet their content needs, they have seven areas that can be placed on the homepage to quickly change the focus from an event to the latest message or whatever they need to highlight.

If You Build It, Design It.

Your church’s website is one of the most important investments you can make. More and more today, your website is your only chance to make a difference for new visitors or engaged members. Make sure that after people come to your site, the great design keeps them coming back.