‹ Home
Exported

Joseph & Mary - Freeport, IL

Gary Smith, Web Department Director at DiocesanBlake Stapleton, Web Designer at DiocesanVeronica Alvarado, Project Manager at DiocesanMary Goeldel, DiocesanKyle Sullivan, Web Development at DiocesanSam Pohlman, Web Developer at DiocesanDanae Chudy, Web Designer at DiocesanNathalie Shultz, Web ConsultantCody Armock, Web Content Specialist at DiocesanFr. Timothy Barr, Joseph and Mary Freeport StaffDee Dee Timmerman, Joseph and Mary Freeport StaffMarcus Borger, Developer at Diocesan_SupportRyan Hoch, Web at DiocesanRachel Tupper +2 others
TO THE CLIENT Sent by Veronica Alvarado on

Fold vs Aspect Ratio

To: Fr. Timothy Barr
CC our team: Danae Chudy

Good morning Father,


Danae let me know that you are still deciding if you would like the homepage to resize based on the fold (image fills up height of screen of any device you're on) or aspect ratio (image keeps it's ratio, even though on mobile it may be very small).

Since this is something that must be decided upon before the design can be officially approved, I wanted to share some examples of some sites that have used either fold or aspect ratio:

Fold (3 examples)

  • Image will always fill the same percentage of the screen 
  • Diocesan will add fields for text so that it resizes on mobile
  • When used properly, images are background/mood-setting images, not focal points
  • Text will use the same fonts as website theme

Saint Elizabeth Ann Seton - Lake Ridge
image.png 1.22 MB • Download
IMG_8415.PNG 2.23 MB • Download
Sacred Heart of Jesus - Grand Rapids
image.png 1.55 MB • Download
IMG_8416.PNG 3.03 MB • Download
St. Francis de Sales - Cincinnati
image.png 2.19 MB • Download
IMG_8417.PNG 2.7 MB • Download

Aspect Ratio (4 examples)

  • Against best practices/not recommended since any text on slide would not be mobile responsive (so some text may be too small to read)
  • Image will keep its exact ratio & never crop
  • Items below image will move up or down depending on the width of device used
  • Best used if you plan on putting text directly on your images or specific images of people's faces

Holy Spirit & St. Helen - Crown Point
image.png 935 KB • Download
IMG_8421.PNG 1010 KB • Download

St. Thomas a Becket - Reston
image.png 1.32 MB • Download
IMG_8420.PNG 1.65 MB • Download


Thomas the Apostle - Ann Arbor
image.png 2.06 MB • Download
IMG_8418.PNG 1.75 MB • Download

St. Francis Xavier - Mount Washington
image.png 1.5 MB • Download
IMG_8419.PNG 1.77 MB • Download


Other Things to Keep in Mind

  • Statistically, we've found that our parish websites are visited on a mobile phone up to 67% of the time (does not include tablets). 
  • Putting information in your slider greatly reduces the likelihood of people scrolling down to view the rest of your website
  • Sliders should only include 4-6 images 

Please remember that this decision must be made before designs are approved since the mobile design will depend on your choice. 

Let us know if you have any questions.
Thank you,


Veronica Alvarado

Web Deparment, Diocesan
877-923-0777
FROM THE CLIENT Fr. Timothy Barr, Joseph and Mary Freeport Staff Fr. Timothy Barr
Thanks Veronica, I would like it based on the fold (image fills up height of screen of any device you're on). God Bless you.
To: Danae Chudy and Veronica Alvarado
TO THE CLIENT Veronica Alvarado, Project Manager at Diocesan Veronica Alvarado, Project Manager
Thank you for reviewing this so quickly, Fr. Timothy. It is very much appreciated.
I will let Danae know so that she can have the appropriate designs ready for you. 

Thank you and have a blessed weekend,

Veronica Alvarado

Web Department, Diocesan
877-923-0777
To: Fr. Timothy Barr
CC our team: Danae Chudy