Heal Your Church WebSite

Teaching, rebuking, correcting & training in righteous web design.

St. Louis Catholic Church, Alexandria Virginia

At least they got their <title> tag right. That’s how I felt after visiting the website of the St. Louis Catholic Church, Alexandria Virginia. I discovered this site back in early April when sang the Schubert Ave Maria and the Malotte’s Our Father ( Lord’s Prayer) at my cousin’s wedding there. Beautiful church, wonderful acoustics, a robust music program, and a very cool priest, yet none of it reflected in their website. At least that was my initial opinion back in April when I put the site in my draft queue.

Image Bloat

As of this past weekend, it appears they’ve made some improvements, including adding some pictures of their beautiful facilities on their front page. Unfortunately, one image is 667,386 bytes large, the other is 363,701 bytes large.

The problem? Once again, we find a site where the web master doesn’t realize that the HEIGHT and WIDTH arguments of the <IMG> tag do not physically reduce the size of the image. In this case, just declaring the height=”388″ and width=”211″ in the HTML means you still get all the bandwidth banditry of the actual 2393×1265 image the end-user actually receives. What the webmaster here needs to do is invest in a graphics application, such as ULead’s Photo Impact, then

  1. physically reduce the image size (in the graphics app).
  2. color optimize it into a JPG
  3. FTP it to the site.

My results converted the 667,386byte image into an easier on the bandwidth 23,609 byte progressive mode image. Your mileage may vary.

Java Applets

The next thing I’d address would be the use of Java applets to render scrolling news, and rollover buttons. I’d get rid of them. IMHO, Java for rollovers should be replaced with cascading style sheets applied to hyperlinks. Yes, users of the antiquated Netscape 4.78 won’t benefit from them, then again, does a user of such a old and limited browser want to see rollovers at all? Moreover, someone with visual disabilities will in that they’ll have no problem seeing the CSS-based hyperlinks as opposed to those rendered with a Java Applet.

A similar arguments can be said to use Dynamic HTML (DHTML) over an applet to display the scrolling text. Only, IMHO, I hate scrolling text, and I’m especially not fond of the marquee style scrolling text. Why? Aside from not working on all browsers, one needs to remember that the convention of the scrolling marquee invented to wrap news around buildings using lighted boards back in a day and an age where people didn’t mind spending five minutes looking up to see if the Dodgers beat the Yankees. This user doesn’t exist in the world of the purpose-driven Internet user. They want what they want now, hence, they tend to ignore any text included in such mechanisms. That, and nothing spells Chinese water torture like taking something vitally important and slowly giving it to your information hungry user letter and line at a time.

Compelling Content

Once again, we have a site with compelling content, that has unfortunately been hidden under a bush. Let’s take for example the “About Our Parish Page.” The first thing I notice is that I can barely read the reddish-orange text against the yellowy-red background image. Rule of thumb, make sure your text color and background color contrast each other. Red against white, navy against silver, yellow against green … you get the picture.

It doesn’t help that the background is a textured image as well. Look, I’m not without sin either. Back in 1995, I too used textured background images. But I gave that practice up somewhere between 1997 and 1998 when I discovered Vincent Flanders and what he had to say about textured background images (among other things I was doing wrong). In other words, unless you want to party like it’s 1999, lose the textured background images.

Getting back to the “About Our Parish Page,” let’s talk content. What you get on this page is a single paragraph that tells you where the church is, and how long it has been there, not much else. To learn about their Mission and Goals or their Council and Committees, you need to click down another level of navigation … even though all this content could easily fit on one page. Yes, I know I complain about pages that are too big sometimes, but here is one case where I feel more would actually be less, more-or-less.

Navigationally Yours

While putting all the “About Us” content on a single page would give the reader a more complete picture of the church in a single snapshot (as opposed to three), it does create a minor navigation issue those times you want to hyperlink/permalink the section/content blocks the single page would contain. In those cases, I would employ the same type of anchor link navigation they used atop their Sacraments and Devotions or Music Ministry pages.

A few other notes regarding navigation. They do a good job of offering text links along the bottom of their page. Unfortunately, the link to the home page wasn’t tested. That should be index.html, not .htm. Also, since the site prominently displays the church’s address at the top and middle of the home page, why not equip it with a hyperlink to the directions page, or at least a Yahoo map?

Shine like a Star

Again, here is a church with something to good, useful and saving to say. Unfortunately, IMHO, her voice, is muffled by Java applets, hard-to-read text, and some unnecessary navigation. Here is one case where I might suggest to a church to keep their compelling content, but instead of trying to roll their own site, plug it into a pre-fabbed template, or perhaps use a pre-fabbed-church-website service such as that offered by E-Zekiel.com.


  1. For a one minute fix…upload a different background.gif file that complements the redish text. The home page is readable just because they used bold text of just a few words. The rest…forget about it.

  2. If you can look past the appearance of the Web site, you’ll find a church with lots of spirituality–check out the confession schedule, updated weekly with three priests hearing confessions 2-3 times daily; beautiful devotions–Eucharistic adoration, rosaries, parish retreats; many parish organizations; an active CYO program; a school. What the Web site lacks in creativity it makes up for in giving parishioners access to information about the many activities going on in this vibrant parish.