JMU Catholic Campus Ministries Website Redesign

Web Design /

I took on the project of redesigning the entire JMU Catholic Campus Ministries Website via eCatholic (a content management system).

This project entailed creating a site map, wireframes, rearranging written content, finding new images taken by our students along with free stock photos, creating buttons, a favicon, and social media icons for the site. I created branding guidelines to follow and used my HTML and CSS skills to style the site accordingly.

The logo was also designed by me and was the 2018 – 2019 CCM t-shirt design for this year. Everything seen on the site, except for the written content, was created by me.

See the Website

See the Code

The Process

Site Map and Wireframes of the new CCM Website

old ccm site 1

old ccm site 2

Screenshots of the old Catholic Campus Ministries website. There was no CSS styling and the colors consisted of grey navigation with a black background color.

Additional social media icons created by me in Adobe Illustrator

Favicon & Site Title in the tab bar

Site search bar along with social media icons

Site map for the final site in eCatholic (the CMS)

Code (CSS) I wrote to stylize the site. Through trial and error, I learned the theme starting code myself and tested different elements to determine what code changed each part of the site.

The Home page of the redesigned site. The color scheme consists of purple and gold, JMU school colors, along with a newly designed logo in the top left hand corner and social media icon buttons created by me in Illustrator.

Above and below are more screenshots of other pages on the site. All hero banner images were selected by me. 

    Catholic Campus Ministries Logo


Overall the project took a week to finish. I had a lot of fun utilizing my coding skills and creating a website that the community and the ministry would enjoy. I also embedded Google Analytics into the site and have noticed a tremendous increase in traffic due to the improved, now user friendly, site.