STEP 3 - Effective website design, layout, and navigation » Your Online Biz

STEP 3 – Effective website design, layout, and navigation



  1. K.I.S.S. = Keep It Simple Silly.  What are you a banker or something? More is not better it’s just MORE.  Try to make things absolutely as simple as they possibly can be.
  2. Content Trumps Design.  Don’t spend endless hours on design spend it creating actual content that will make people want to come to your website to read and share with their friends.


Selecting a design theme is like picking out an outfit for your website to wear on a hot date.  If making a first impression is very important to you then you can get a premium design theme from MOJO ThemesWoo Themes, or Thesis Theme  (Thesis can also be upgraded with Awesome Thesis Skins).

It’s your choice just know these are the same theme designers that many of the top bloggers in the world use for their websites.

I recommend whatever you do don’t take too long contemplating. It’s not that important and you’ll want to change your design before long anyway.  A premium design is a worthy investment because of the advanced design features that will make your website stand out head and shoulders above the competition.

Below I list some of the top reasons why premium themes are better than free themes but just look at them for yourself.  If you compare the free themes from wordpress.org to the premium themes linked above there is no contest.  The premium designs are built by some of the most talented designers in the world.  You would have to pay several hundred if not thousands of dollars to get the same design built from scratch.  Here’s why I think premium design themes are worth the money:

  • The latest and greatest design techniques that looks better and works faster.
  • Mobile compatibility built in, no additional coding or separate “mobile” pages to maintain.
  • Short codes that make building cool looking web content easy.  Graphical web buttons, transparent and gradient objects, expanding boxes, colored tabs, tables, and more.
  • Support.  When you get a custom website built then the support and maintenance is also expensive because it was built custom.  Templates are built using standard practices which are supported with no issues in my experience.
  • Page templates.  Basic wordpress templates don’t have the options that the advanced web designs have for page templates. Most have custom contact form templates, posts on page templates, additional content format options, and more.


  1. Navigation.  Keep the way your website is laid out logical and intuitive.  People will not click around trying to find stuff on your website they will just leave and go to another one.
  2. Menu’s.  Do not stack your menus too many layers deep with too many options.  Keep it simple and brief think about how fast food restaurants use their “value or 99 cent” menus.  Keep it boiled down to a hand full of top selections if possible.
  3. Links.  Organize all the external links to websites that you want to associate with using the wordpress Links app.  This will keep everything in one place so you can manage links once and all pages, posts, etc on your site will get the new link or updated URL.  Coming soon in WordPress version 3.5 Links will be managed via the Link Manager plugin only.
  4. Widgets.  Use to reiterate your primary offers and calls to action.  Great location to install a search, contact, or other form. Also great location for advertisements or donation boxes.
  5. Posts.  Are articles published to your website in a chronological order.  This is what you’ll use to alert the world of what is new on your website.  Use categories to organize your posts and tags to group posts further.  Like a newspaper but better yours.
  6. Pages.  Are like the  foundation of your website.  About us, contact us, Portfolio, etc. are some of the most popular pages that all websites have.  Think about it like this.  Your domain is a tree with your domain as the trunk.  The pages are like large limbs and the posts are the branches.
  7. Media.  Keep your image file sizes small or deal with slow website syndrome.  Use Photoshop or illustrator if you can afford it for professional results or use another software. Images taken on modern high resolution cameras even cell phones create large files.  These software programs make it easy to keep the full richness and fidelity of the images without having a large file to slow your site down.
  8. Header.  Research has proven the information at the very top of your website is the most important.  What is called “above the fold” is the area on the top half of your website that people don’t have to scroll down to see.  This includes your header.  There is a trend where bloggers are using their headers for email forms or to connect with social media.  This takes some manual coding but you can do this too or if you need I’ll help you set it up.
  9. Background.  You can upload an image or a color here be creative do your thing but just know it’s not that big of a deal.  Just keep it from being a distraction is what I would recommend.
  10. Editor.  Is what you will use to manually code your website.  Make sure you back up everything before you start messing around in here.  Once you click save if its wrong you’ll know.  Be careful.


1. Widgets, columns, and basic layout considerations.
2. How to add custom HTML code to your HEADER, FOOTER, and WIDGETS

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CommentLuv badge