One of the best ways to look a problem is to look at it from another person’s point of view.  To do this I will present two different situation to help you understand this concept.

Site 1:

Bob is shown a website.  This website has good design features, amazing images, good choice of color.  All the images are relevant to the content.  The choice of font are easy to read.

Site 2 :

Next, Bob is shown another website.  This website features gross and ugly images.  The resolution is out of whack.  The images have nothing to do with the content.  The color scheme looks like it came out of a blender.  There are no less than 10 font styles used on the page.  Each page has a different layout.

Observation:

Looking these two sites from Bob perspective might go something like this:

Bob really likes Site 1 a lot.   He is impressed with the artwork and design.  He found it easy to navigation.  It was as though the design enhances the content.  Bob, enjoyed the site so much he stayed a while, learned many new things and even came back.

As for Site B Bob could hardly wait to leave the site. Visually it gave him a migraine.  There was now way he would ever want to return.  It was so bad that he even removed from his browser history. Now that’s bad.  The worst thing Bob did not fell comfortable, was distracted and was disappointed.  Not very welcoming was it?

Analysis:

Like it or not most people DO judge on first impression.  In these two cases the impression ranged from good to bad.

Often our ego gets in the way of good design.  The primary thing to take away is to plan your websites carefully.  Get feedback for others and get their perspective.  Remember, everyone is different.  Keep in mind design is subject to interpretation.  The goal is to create a favorable impression the first time.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: information technology, Internet, usability, Web Design, Web Development

The image on this page may be used in accordance to the Creative Commons License by churches and other nonprofit organizations for the purpose of backgrounds for projected computer presentations. This image is intended to be used to glorify God as background images to lyrics of Christian praise and worship songs, as well as hymns.

You can use this image in Power Point, Media Shout, Easy Worship, Sunday Plus software or some other presentation software to project song lyrics to a screen

If you use this image, I would appreciate it if you would contact me and tell me how you are using them.

Creative Commons License
by John Pape Jr is licensed under a Creative Commons Attribution 3.0 United States License.

Technorati Tags: 4:3 Ratio, Blue, Church Service, DarkWood Grain, Image, MediaShout, Powerpoint, projection screen, Texture, worship background, Yellow

To get around the Internet we click on links.  Now think of these link in the same way the synapses of the brain are formed.

With website design one of the most important feature that is required is a way to link from one page to another.  Having a dead link is like crashing into a brick wall.  It stops you in your tracks.

As a web designer I make it a point to include a link on nearly every page I design.  These links are important.  If there were no links there would be no other place to go and get additional information.

A website had different kinds of links.  There are unspoken standards of design that should be followed for better usability.  Messing with these convention can have a negative effect on the user.  And as a designer I don’t want to see that.  Understanding the rules of convention that need to be followed is the first step in understanding.

When you look a typical website you can imagine it is like a book.  A book holds several pages.  These pages are often categorized in chapters.  A web page can be likened to pages of a book.

The two types of links: Internal and External

Let’s begin with Internal links.  These are the links that join content within your website.  If we look at the book example.  The Index or the Table of Contents of a book contain internal links that connects a page to another page in the same book.   On a website Internal links connect pages to other pages in the same website.  This allows a visitor to access the about us page from the home page though an internal link.

The other type of  link is the External link.  This link will move you from the current site you are on to another site.  In the book example this would be similar to a citation or reference.

Layout Conventions

Over time more users and website are added and certain assumption about the location of certain links.

One of the most common location for internal links is either horizontally across the top or vertically along the left margin of the page.  In nearly every case this will be the main navigation to the website.  Designer thought these area to be the most natural position for this grouping on links.  As a result these area are prominent in graphic design of the page.

You will also find internal links toward the bottom of the page.  This area is called the page footer.  Here you will find links of secondary importance or are more informational.

Within the body of the content you will usually find External link.  There are no set rules for this it is just a convention that has come out out common use.  The location of the link could be within the body text or as a reference note at the end of the content.

Keep in mind these ideas are only convention and not set in stone rules.  Designer have a lot of freedom to adjust the layout.  These variations can make surfing the web more intersting.  The important thing to remember is to not confuse of alienate your visitor.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: linking strategy, usability, Web Design, Web Development

Now come the concept of optimal web design.  What exact does optimal mean?  It means “the most favorable or desired form of any particular subject”.  How does this relate to the subject of optimal web design?  Perhaps we can say that it is a design that best satisfies the tastes of the masses, while at the same moment works within the limitation of the function.

This now beg the question.  What is optimal web design?  You can say that a website is optimal when it provides maximum usability to the visitor while providing operational viability.  The balance for the designer is to provide results for both the client and for the end user.

When designing it is important to keep the end user’s experience a priority.  The site needs to be friendly to them.  It needs to be easy to use and navigate.  It needs to provide useful and pertinent content.   The content has priority over the look and feel of the layout and artwork is secondary.

There is nothing wrong with a simple white background or very clean and simple lines in a website.  Perhaps even a reduction in unwanted images that cause long page loads is needed.   Keeping essential elements like page title, navigation and content  is necessary.

The use of pictures need be be used sparingly.  Only those that reinforce the content should be used.  Don’t use picture to only decorate the page.  This will be distracting to the site user.  Although pictures are helpful they need to be used wisely.

Your site’s navigation needs to be simple, organized and consistent.  This makes moving though your site easy and predictable.  This will only help your visitor to get to the content they want.

Include in the design a way for your visitor to gain access to basic information regarding the website.  A good start is to include an about us page as well as a privacy policy for the website.  These element help foster your relationship with your visitor.

Having a consistent layout is rudimentary in creating an optimal web site.  You will need area reserved on the page for these four areas common to most every website.

• Header
• Navigation
• Content Area
• Footer

Finally, while aesthetics play an important role, creating an optimal web design is still one that best methods for better usability in a website.  Form and function need to work perfectly together to create a positive user experience.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: usability, Web Design, web devlopment

The image on this page may be used in accordance to the Creative Commons License by churches and other nonprofit organizations for the purpose of backgrounds for projected computer presentations. This image is intended to be used to glorify God as background images to lyrics of Christian praise and worship songs, as well as hymns.

You can use this image in Power Point, Media Shout, Easy Worship, Sunday Plus software or some other presentation software to project song lyrics to a screen

If you use this image, I would appreciate it if you would contact me and tell me how you are using them.

Creative Commons License
by John Pape Jr is licensed under a Creative Commons Attribution 3.0 United States License.

Technorati Tags: 4:3, Blue Sky, Church Service, Horizon, Image, media shout, Powerpoint, projection screen, Sunrays, Texture, worship background

This simple example is useful in helping your understand the importance of positioning content into your website.  The goal is help eliminate a mess caused by confusion.

Group similar information together

In a home you will put beds and dressers in the bedroom.  In the living room you will put a couch, easy chair, coffee table.  You do this because these item help in the function of the room.

In a similar way you need to categorize your website’s content.  You need a constant logical flow of information.  You site’s visitor probably doesn’t want to bounce around from page to page and back again to the information they want.  For the most part you want to put similar content in the same area.

Let’s say you sell items on your website,  the idea here is to group these onto one page.  If you have several items then you will want to create a category and organized them into similar kinds of products.

Perhaps you maintain a website for an organization.  Again you want to group similar content into certain pages dedicated to that topic.  Also, you want to categorize your content to avoid cluttering the site.  I always like the simple and clean approach.

When creating categories for a website you will find that these are typically what you will find.

• Home
• About Us
• Resources
• Contact

Let’s go through each of these pages and figure out what type of content goes into them.  First let’s look at the Home page.

The Home page is usually the first page someone will arrive at on your website.  This page should have content that tells the visitor “What is this website about?”  In addition, it needs to show links to the other areas within the site.

Next let’s look at the About Us page.  This page contains content regarding the organization or person who owns the website.  By including this page you add reliability by allowing your visitor a chance to know who you are and some of your qualification and credentials.  This builds trust.

You will also want to include some sort of Resources page.  The primary aim of your website should be to provide something useful to the visitor.  This is done through your resources page.  If you have several resources you can have multiple pages under the Resources page to accommodate these items.  What can be included in your resources page.  You can include products, services your provide, audio, video, inactive games.  What goes here really depends on the goal of your site.  Remember the resource pages are there to provide something to the visitor.

Next you want a Contact page.  You want to provide a way for a visitor to contact you if they have a concern, question or need help. Although this information could be put in the About Us page a better practice is to create a separate page to handle the communication.  On this page you will want to provide email, phone and address information.  You can also include a form to make communication easier.

Create a Layout That Help the Visitor

With an understanding of the various page and you have your information ready, it is time to place this information on each page in an organized fashion.  To do this a page layout needs to be created.

As we continue with the furniture in the house example, you need to place your your content in such a manner that it is useful to the visitor.  In a room you will place certain furniture in specific spots in other to increase the function of the room.  For example in the living room you most likely place the couch in front of the television. You will also make sure that there is an unobstucted path though the room.  Similarly, the information on your site should have a layout that help to visitor find what they want.

It is recommended that a uniform layout be created for all the pages on your site.  This assists the visitor to move though the site quickly and easily.

There are four basic elements on a web page.  You will have a header that contains the name of the website or an organization’s name.  It may also include a company logo.    The header is usually found at the top of the page.  Next you will find an area dedicated to navigation.  The navigation will be located in the same on every page of the web site.  There are several popular locations for the navigation.  These are Horizontal above or below the header, Vertical on the left or right of the content area.  Next you need a content area which will contain the information specific to the page.  And finally a footer page that be located at the bottom of the page.

When laying out the content on your website you want to consider the convenience and practicality of the site in the same way you would arrange furniture in a room.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: information technology, page layout, site architecture, site navigation, usability, Web Design, web devlopment

Washington, DC Metro Station on a cold January morning in 2007. The man with a violin played six Bach pieces for about 45 minutes. During that time approx. 2 thousand people went through the station, most of them on their way to work. After 3 minutes a middle aged man noticed there was a musician playing. He slowed his pace and stopped for a few seconds and then hurried to meet his schedule…

4 minutes later:

The violinist received his first dollar: a woman threw the money in the hat and, without stopping, continued to walk…

6 minutes:

A young man leaned against the wall to listen to him, then looked at his watch and started to walk again.

10 minutes:

A 3-year old boy stopped but his mother tugged him along hurriedly. The kid stopped to look at the violinist again, but the mother pushed hard and the child continued to walk, turning his head all the time. This action was repeated by several other children. Every parent, without exception, forced their children to move on quickly.

45 minutes:

The musician played continuously. Only 6 people stopped and listened for a short while. About 20 gave money but continued to walk at their normal pace. The man collected a total of $32.

1 hour:

He finished playing and silence took over. No one noticed. No one applauded, nor was there any recognition.

No one knew this, but the violinist was Joshua Bell, one of the greatest musicians in the world. He played one of the most intricate pieces ever written, with a violin worth $3.5 million dollars. Two days before Joshua Bell sold out a theater in Boston where the seats averaged $100.

This is a true story. Joshua Bell playing incognito in the metro station was organized by the Washington Post as part of a social experiment about perception, taste and people’s priorities. The questions raised: in a common place environment at an inappropriate hour, do we perceive beauty? Do we stop to appreciate it? Do we recognize talent in an unexpected context?

One possible conclusion reached from this experiment could be this: If we do not have a moment to stop and listen to one of the best musicians in the world, playing some of the finest music ever written, with one of the most beautiful instruments ever made…. How many other things are we missing?

This story reminds me a a book I read called “Acres of Diamonds“.  In a way this book has a tragic ending.  Here is a synopsis of that story.

There is a man who spent his entire life looking for riches.  Though he tried and tried he failed.  One day he learned of a new opportunity and he sold his home.  The new owner discover that on that property was a diamond field.  In fact it ended up being one of the largest diamond mine in the world.  The tragedy is that the man in the story died broke.  He had all the resources he could need yet was unable to see what he already had.

What treasure, opportunity, gifts do you have right now that you are not seeing?  Open your eyes and see the beauty that is around you.  God has provided you with all that you will every need.  You just need to receive it.

Additional Reading:

• Joshua Bell Official Website
• Original News Article
• Washington Post
• Acres of Diamonds eBook

Technorati Tags: josua bell, perception, video, violin

Typography is one of the first items that needs your attention. For large blocks of text the there should be enough line spacing. A good rule of thumb is this: when you have a long line of text the greater the line spacing should be. The next thing to consider it to make sure that the text is large enough to read. What you want to avoid is eye strain. Body copy that is 10px or less can be difficult to read increasing it to 12px is a good place to start.

Finding information on your site should be an easy task for your visitors. Let’s say you have hundreds of articles on your site. You need to make it easy for the visitor to find the article that interests them. You need to provide a feasible method to allow them to find the information with ease. This can be done with a glossary or an index. These can then be subdivided in to different categories. Add to this an online search feature and you will make your site even more usable.

One thing that make a site difficult to use is one that loads slowly. A site that loads slowly can easily lose visitors. A good metrics it to make sure that your pages load within 15 seconds. We live in an impatient world. Sometimes you will need to trim out images or applications that cause your site to load slowly. The idea here is to deliver the content as quickly as possible.

The final tip I want to present is test all of your links. You do not want to disappoint your visitor by leading them down a dead end path. The link they choose could very well be the exact solution to their problem. A broken link will frustrate the visitor and may tarnish your professional image. So check all the links to make sure they go to the right destination.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: css, HTML web development, usability, Web Design

Download

The image on this page may be used in accordance to the Creative Commons License by churches and other nonprofit organizations for the purpose of backgrounds for projected computer presentations. This image is intended to be used to glorify God as background images to lyrics of Christian praise and worship songs, as well as hymns.

You can use this image in Power Point, Media Shout, Easy Worship, Sunday Plus software or some other presentation software to project song lyrics to a screen

If you use this image, I would appreciate it if you would contact me and tell me how you are using them.

Creative Commons License
by John Pape Jr is licensed under a Creative Commons Attribution 3.0 United States License.

Technorati Tags: 4:3, Church Service, Image, media shout, Powerpoint, projection screen, Texture, worship background

Make sure you have clear directions on the navigation of your website. The navigation menu should be uncluttered and concise so that visitors know how to navigate around your website without confusion.

Reduce the number of images on your website. They make your site load very slowly and more often than not they are very unnecessary. If you think any image is essential on your site, make sure you optimize them using image editing programs so that they have a minimum file size.

Keep your text paragraphs at a reasonable length. If a paragraph is too long, you should split it into seperate paragraphs so that the text blocks will not be too big. This is important because a block of text that is too large will deter visitors from reading your content.

Make sure your website complies to web standards at www.w3.org and make sure they are cross-browser compatible. If your website looks great in Internet Explorer but breaks horribly in Firefox and Opera, you will lose out on a lot of prospective visitors.

Avoid using scripting languages on your site unless it is absolutely necessary. Use scripting languages to handle or manipulate data, not to create visual effects on your website. Heavy scripts will slow down the loading time of your site and even crash some browsers. Also, scripts are not supported across all browsers, so some visitors might miss important information because of that.

Use CSS to style your page content because they save a lot of work by styling all elements on your website in one go.

Need A Web Site?

Custom Web Design for Small Businesses by professional and experienced web designer and developer.

Here is what I can do for you…

• Innovative Web Design
• Graphic Design Logos
• Maintain Your Website
• Data Driven Content
• Flash Applications
• Build Shopping Carts for Ecommerce
• Custom PHP Applications and Programming
• WordPress Installation & Customization

Get an affordable, attractive great website today. Hire Me For Your Web Design Solution. View my portfolio at http://portfolio.mediatunes.com

Technorati Tags: design process, usability, Web Design, Web Development