Faith Focused Dating. Create your Free Profile and meet your Match!

A Tech Geek’s Explanation of Responsive Design

Faith Focused Dating - Grow in Faith, Fall in Love.

by Michael Lloyd


Co-founders Mike Lloyd and Jason LaFosse give a more detailed explanation of CatholicMatch’s new website design.

Are you one of the many CatholicMatch subscribers who login to your account using your mobile phone? For the past couple of years we have tried to keep two versions of our site. One version is for regular computer users and the other version is for people who are accessing the site with their mobile phones.

As more and more people started using handheld devices as their main computers, we quickly discovered that managing two different sites would simply not work. It was more difficult to keep site features and security in sync — while also providing optimal user experience.

We wanted to develop a consistent design for our members that would be easy to navigate not only on a widescreen monitor, but also on a cell phone. But as a small business with only three developers, we knew we couldn’t possibly keep up with larger companies who have more than 100 programmers working on their site and are writing apps for every specific device. We needed to be smart about our investments and decided to focus our efforts on responsive design.

Responsive design provides easy reading and navigation across a wide range of devices from widescreen, desktop, and tablet(L)/desktop, to phone(L)/tablet(P) and phone(P). The goal was to minimize the resizing and scrolling when we tested the site in the widescreen window and then shrank it down to a phone held in portrait view.

In order to accomplish this, we used the front-end framework Bootstrap — originally built at Twitter by @mdo and @fat. Bootstrap was the right tool for us since many of the features we desired were already developed in this program.

This toolkit made a significant difference with our site design and how it renders on multiple handheld devices. The graphic library makes it possible to provide a consistent design for our forms, icons and tables, so that our site design looks the same on an iPhone or on a widescreen monitor.

This open source software allows small businesses like CatholicMatch to stay current and competitive in the web development community.

Help us by testing out the new site. Leave us your feedback in the comments below so we can continue to provide the best user experience for our members.