Website customization categories:

You’ve created your web page and now you want to know how to customize your website or customize your blog to match your own personality or brand.

This is a big topic so I will break it down into different articles.

  • Look and Feel:  In this section I will discuss the presentation of your website, it’s your website’s first impression, what those in the business call the UI or user interface.
  • Format:  This is the structural format of your web page or blog.  It could be a simple thread of blog posts or a static page that talks about your brand or cause.
  • Function and Workflow:  You want people to interact with your website.  In this section I will discuss some of the more common functions of popular web pages today.
  • Integration:  Your web page is part of the world wide web (the Internet), I will discuss how to connect your website to social media and other third party tools.

Look and Feel:

The look and feel of your website can be almost as important as the content.  Don’t get me wrong, website content is still king.  However, part of the experience of people engaging with your website is your website’s aesthetic appearance.   What your web page looks like can say a lot about how you anticipate people will engage with your site.  For instance, if your web page has a stark professional look, with no social call to action, your audience is more likely to consume and run.  If your web page is dynamic, with calls to action, you are more likely to drive people to interact with you via your website or blog.

So let’s discuss the elements of good look and feel or website style.

Color:

The colors you use on your website and the way that these colors interact with each other will say a lot about the style of your website or blog.   Whether we like it or not colors can and do act upon us emotionally and psychologically.  Okay, before you start snoring, I am not going into great detail here about the psychology, but here are some of the basics according to an article by Helpscout (https://www.helpscout.net/blog/psychology-of-color/):

color-emotion

I almost hesitated putting this into the article,  because there are those like me who tend to over analyze everything, who may look at this chart and really start to over think the whole color scheme of their website.   Remember, just because you don’t have orange on your website does not mean you don’t engage your members in a friendly way.  However, knowing that yellow is hard to read may help you rethink making a completely yellow website.

 

A couple of more key recommendations regarding color.

  • Try to be consistent with your colors
  • Don’t use too many colors
  • Make sure your colors don’t clash
  • Look at websites you enjoy going to and study their use of color.  Usually simple is better.
  • Use colors in your text to call out important information or to get a point across
  • Try to stick with easy on the eye high contrasting colors for normal reading text

Fonts:

The saying “just because you can, does not mean you should” definitely applies here.  If you are using a standard WordPress theme and editor you are likely to stay out of trouble in this area since most themes have reasonable looking font’s associate with them.  However, that does not seem to stop some people from going crazy with fancy script fonts or themed fonts that may look OK for a second or two but become unbearable to read.

The basic rule here is, if you want people to read your content, make it easy for them to read.  If you still have that urge to use that monster font for Halloween, use it for a title or a single word as an effect.

Other considerations regarding font usage:

  • Be consistent with your fonts on the page and from page to page
  • Don’t be afraid to go large with your font on the main page to call attention to your message
  • Don’t mix too many fonts unless you have a specific purpose for doing so like calling out a difference
  • Make sure fonts are large enough to read easily
  • Try to be consistent with heading usage.  Each post should have an H1 Title Heading 1 and then cascade down from there.
  • Don’t over use H1 headings on a page since this can cause issues regarding SEO (search engine optimization)
 The key thing with fonts it to keep it simple.
Layout and Spacing:

Are you still with me?  Great, let’s move on to the next part of website look and feel, which is layout and spacing.

I have worked with quite a few professional web design firms and contractors and they all say the same things.

  • Keep the layout clean
  • Pay attention to the lines
  • Make sure to include ample white space
  • Keep the noise down

So that all sounds well and good, but what does it mean.

Let’s talk about clean layout.  Again, if you are using a decent WordPress theme in all likelihood the layout of your web site will be structured and clean.  This means that there is a clearly designated header section with perhaps a menu.  There will also be a place for the main content that is consistent from page to page and usually at least one sidebar that is consistent all the way down the page.  Lastly there should be a well formatted footer that indicates you have reach the bottom of the web page or blog.  Let’s face it, people need closure, so make sure you have a nice footer.

The gist of clean website layout is that everything has a place and that everything is in it’s place. 

Paying attention to the lines in your web page simply means being mindful of how things flow on the page.   For example, you would not expect to arrive at a website and see content from once section protrude into another section.  Or, to see pictures that seem out of place or that interrupt the natural flow of content.

One of the most common mistakes that people make when designing a website is overcrowding the web page or lack of white space on the website.  White space is simply the use of blank space, gutters or breaks in the content that makes the website less cluttered and easier to read, navigate and understand.  It’s why we use paragraphs when writing.  Can you imagine how hard it would be to read if we did not use paragraphs or proper word spacing.  The same rule applies to website layout.

 As mentioned before, most WordPress themes and layouts honor good usage of white space.  Again, look at some of your favorite websites and see how much white space (blank space) exists on that page.

Customizing a web page

This leads us to the last part of layout and spacing,  which is minimize the noise on the page.   The challenge with every website is that you only have a few seconds to capture someone’s attention.   So the natural tendency it to try and cram every bit of information you can above the fold in an attempt to captivate the reader. As with most design simple is better.  Make sure that your message or pitch is clearly ascertainable within just a few seconds of seeing your page.

One designer I worked with said that your main page needs to pass the “walk by” rule.  Imagine your web page was on display at a convention or in a store and you wanted to capture someones attention.  The typical time someone will look at your site for the first time may be less than ten seconds or the time it would take someone to walk by your web page.

Don’t panic.  You don’t have to redo your website with neon flashing lights.  Just make sure the message on your main page reflects what your website is all about.  Make sure you don’t have a confusing message where you are trying to say to much.  Lastly, make sure people know how to navigate around your website.

Wow, that was a lot to cover and we only scratched the surface of some of these topics.

I want to say a big thank you for reading this post, it really means a lot to me.

In the next article, I will post instructions for how to begin customizing your web page format.

If you found this useful, please share this tip with your friends!: Click here to Tweet it

Alex

“How to Customize the look a feel of your Website”

What questions do you have about customizing a webpage?  Leave a comment below.