3 Ways to Make Your Website Beautiful

This month is design month and we’re talking about website design that is simple, beautiful and remarkable. This week, I want to talk to you about 3 ways you can have a beautiful website.

Get Inspired

One mistake I see over and over again with clients is the mistake of not knowing what they want and thinking up a design “in their head” without knowing what it would look like on their computer monitor. One way to combat this oversight is to look to other websites for inspiration.

The best way to go about doing this is to simply search for it online. If you were a church, you could simply to to http://www.google.com and search for “church web design inspiration” and see what sorts of websites come up. Chances are you will fnd websites that have several different desgn examples to look at.

You can simply take ideas from one or several websites and come up with a great looking layout and unique design elements that will fit your organization very well.

You can also look through general website design inspiration sites as well, to see if any other ideas appear as well.

Get Graphic

One of the major things you can do to spice of the content of your websites is to add graphics to the page. Text is great for information, but let’s face it: text alone is boring.

Not just any type of graphic will do, though. Here are some recommendations or guidelines to go by:

For every 500 words of text, use at least one related image/graphic

Try to stay away from “cartoonish” clipart and stick with photos

Images of people are more interesting than images of objects

Images shouldn’t take up more than half the page if you are going to have text wrapping around it. If you want a large image, place it on a line by itself

I could keep going on forever on this topic, but these pointers are some good ones to start out with.

Get Uniform

One problem I have with some websites that I see is the use of several different colors, font styles, font sizes, etc. KEEP IT UNIFORM, PEOPLE!

If you want variety when it comes to your fonts, you can use different font sizes, such as the use of headers (<h1>,<h2>, etc.) and the use of bold, italic and underlines. There are a few exceptions to the rule, but a good rule of thumb is to not use more than 2 or 3 different font styles and use the 2nd and 3rd font types very little.

When it comes to font color, you want to stick to a general color theme based on the design of your site. Usually you will have around 2 – 4 colors at the most that you would want to use. For example, the OurChurch.Com website has 2 main colors: Red and Beige. You will find that there are other colors within the graphics we use, but for the most part, we stick to only using red or black text (since our background color is light beige).

Hopefully these tips will help you find a way to make your current website more beautiful or maybe even make a decision to redeseign your website in efforts to obtain a beautiful website.

About the author

Mike Cotton

Mike joined OurChurch.com as Web Designer/Developer in September, 2006. Born and raised in Houston, TX, he is now married and has 3 adorable children. In his spare time he enjoys playing piano/keys and singing throughout the local area as well as at church. You may also see him acting in church dramas as well as a local Improv Comedy Troupe!

4 Comments

I recommend not using underlined text. In fact, when I set up a CMS for someone, I always take out this option from the WYSIWYG editor. Underlined text, on the internet, means that the text is a hyperlink. I know it doesn't always have to mean this, but most users associate them together, so I prefer not to confuse people.

Another underutilized way to spice up text is to use a highlight color. Pick one color that compliments the site and sufficiently contrasts with the text (a pale yellow or blue often works quite well), and set it as the background color for a short phrase of text. It shouldn't be overused, but can be an effective way to make the main point of an article really stand out.

I'm not a web designer per se, but I dabble and have played around. Some things to consider:

1) if you use a reverse (light text on dark), bump up the text size a couple of points;

2) Make sure there is enough contrast between the text and the background (it's web-cool to have light gray on medium gray, but miserable to read except at very large point sizes), but don't be obnoxious (no blue on red);

3) Be sure the text is a legible size. Young eyes might not have a problem with it, but unless young people are your only intended audience, design more toward the older generation whose eyes might not be so with it any longer. (As I'm approaching 50–how did that happen?–I'm more aware of this, even if I still have pretty good vision unaided, but less so now.)