In the current economy, many are turning to the Internet to sell products and services. Most however are not completely familiar with all of the working parts that are in between the website shopping cart and the final purchase transaction. Here is the typical process:

• A visitor comes to the website and sees something they want to buy.
• They click on the button to purchase the item.
• The item is then added to the shopping cart. The customer can then continue shopping or proceed to “checkout”.
• The customer goes to “checkout”, sees what is in the cart, decides whether or not to buy everything there in the quantity shown, and then proceeds to the purchasing process.
• The customer is then transferred to a page that has a web address that starts with “https“, indicating that page is using a Secure Sockets Layer (SSL). (Always make sure the “s” is there or it is not secure, however, if the seller is using PayPal, it goes to the PayPal website for processing, so no worries.)
• The information from the page is sent to a “payment gateway service”, which is not an actual part of the shopping cart or website.
• The payment gateway service sends the credit card and purchase information through secure means to all necessary financial networks.
• When everything is reviewed by the appropriate systems, the customer’s credit card account is debited and then the merchant account is credited.
• Generally the shopping cart program will then generate an email to the customer showing all of the purchase and shipping details.
• Lastly, the merchant account funds can then be transferred to the seller’s business account.

That is the simplified process. So, to sell online, you need a number of things to accomplish this process:

• A website. Although quite obvious, you still need to have a web host, domain name, and a place to store your “files”, even if you want just a shopping cart, such as osCommerce and nothing else.
• A shopping cart program. A good shopping cart will handle most, but usually not all, of the required actions, i.e., customer email notifications, order storage, credit card processing, shipping status, etc. (Be sure to research the available functions carefully for any shopping cart you want to use.)
• A Merchant Account. A merchant account allows you to process credit card payments online.  They vary in cost, speed, and function.
• A Payment Gateway Account. The payment gateway service acts like the “go-between” - between the merchant account and customer credit card account. Look at it as an online processor that verifies the information, transfers requests and authorizes credit cards in real time.
• A Secure Sockets Layer (SSL) Certificate. This is usually available through your web host and secures all of the transactions when the shopping cart is used. Simplified again – it secures the information passing through so it can not be stolen and used.
• A Business bank account. If you are going to sell things online, you usually want a business bank account where the money can be transferred to, once the transaction is completed.

That is the basic set up. There are companies that can handle the entire process for you, either connected as part of your website, or completely separate from your website. Some charge a set up fee and a monthly fee. It would be a good idea to determine how you want to set up your system to sell online. 

One thing needs to be pointed out. Payment Gateway accounts are sometimes limited as to what shopping carts they will properly interact with so you want to check that out before you spend any money getting your shopping cart and website set up.

Of course, if you do your homework, there are always a way to save money on the entire or part of the process. If you have any questions about this, feel free to email us.

The home page is the most important page of your web site. It’s the page that most of your visitors will view. It’s the primary page that search engines locate first. Your site’s home page needs to be visually attractive, convey key information in a concise manner, and make it easy for your site visitors to find what they need. A poorly organized homepage serves no purpose and can eliminate any chance of achieving your site’s objectives.

When planning your home page, pay attention to all three factors — design/layout, graphics and content. If a visitor can’t find what they need within 5 seconds, they will go to another site. A page that is lovely to look at but doesn’t tell your visitors who you are and what you do means they’re going to go to a site that does. A page that is wordy and repetitive will bore your visitors, and they’ll move on.

Do not waste critical space on your home page by adding unrelated images and long, looped Flash banners that do little for your site. A good home page balances the use of images and well structured, SEO content.

Design/layout. There are three important elements here: navigation, legibility, and colors.

1. Navigation. Your site must have a clear navigational path for accessing site content. This may seem logical, but many sites ignore the “clear” part! Four things to keep in mind with navigation: (a) it must be consistent throughout the site; (b) it must be in a predictable location so the visitor can find it quickly — either above the header, just below the header, or on the left; (c) the navigation bar provides the visitor with a clue as to what page of the site they are currently on; and (d) a large site has a site map.
2. Legibility. No matter how good your content is, if it’s difficult to read, it’s going to be ignored.
   • Your font should be easy to read and the correct size for your audience. Don’t use Comic Sans font for your site if it’s geared to a professional audience. Don’t use a 10 point font for a site for senior services.
   • The background and text colors should complement and contrast with each other. Lack of contrast between text and background can ruin an otherwise well-designed site. No gray text on a light gray background. Dark text on a light background is easier to read than light text on a dark background.
   • Limit your use of capitalized text as it’s harder to read.
   • Allow sufficient space between lines (line height). Text that is tightly spaced is difficult to read.
3. Colors. Avoid the use of too many colors, non-complimentary colors, or overly bright colors. (For more information on use of colors, read our blog entry “Design Elements – Color and Whitespace“)

Graphics. This can be summarized as: (a) don’t make your web site out of one image; (b) make sure your graphics make sense — use your images and photos to illustrate what your company does, not just because they are pretty; (c) size your photos before posting them on your website to save on download times; (d) make sure you use the alt and title tags — both for visually impaired visitors who use text to speech output and for search engine optimization.

Content. When writing content for your site, keep these major points in mind.

1. Write and edit your content keeping in mind that your web site is not about meeting your needs; it’s about meeting your customers’ needs.
2. Make your site’s purpose clear — explain who you are and what you do. Concisely.
3. Start the page with a tagline that summarizes what your company does. Don’t automatically start your page with “Welcome” as your visitors have already made the commitment to go to your web site.
4. When linking to other pages in your site, don’t just describe what each page is about — use specifics and show some of your best content.
5. Avoid the “click here” link title; it’s much better to tell your visitors what they’re going to see when they click a link. After all, we’ve all accidentally ended up on a NSFW site.
6. Give your pages a search engine friendly TITLE tag.
7. Don’t use graphics for text!
8. And did I mention writing and editing your content with your visitor’s needs in mind, rather than yours?

By the way, these rules should apply to all your pages, not just your home page. Any number of pages on a site can be the entry (or landing) page. So take some time to evaluate your home page with a critical eye, and let us know if we can help!

A website menu is considered the most important element in website navigation. If the menu system on the website is not user-friendly, you will lose visitors very quickly.

Consider this. When you go shopping at one of the larger shopping centers for the first time, you won’t know where to go to shop for what you wanted. Unless you are the adventurous type, you will look at the large sign at the entrance that shows the shopping center layout to find out where to go.  You know the one that says, “You are here”.  Your website has to operate under the same idea. They must know all the time where they are while on your website.

Website visitors are usually those who are just browsing, and those looking for something specific. When the website is opened, the first thing they will do is look for the menu. Keep in mind that visitors usually will spend just seconds on a website looking for something they wanted. If the visitor has a difficult time finding the main menu in just those few seconds, you may lose them, possibly forever. It is always easy to remember those websites that were hard to use. (Remember the old saying about “first impressions”?)

There are horizontal, vertical, side, top, bottom, drop-down, sliding, and many other types and configurations of menus. We aren’t going to say any particular type is best because website content and design should dictate the best menu system. For brevity, however, here is a list of our ideas about menus:

1. They should be easy to locate and easy to read. Those flashing, exploding, floating, or framed menus may not only be irritating but are rarely indexed by search engines.

2. With your menu, visitors should be able to go to any page from any page. Remember that visitors do not always get to your website from the main page.

3. Menus should never drop down or slide out so much that the website content is covered up. If there are that many pages, consider a combined vertical and horizontal menu system.

4. The layout should be such that the visitor does not have to keep clicking through to get to the part they are interested in. Good website design means minimum clicks and won’t aggravate or lose the visitor.

5. From a design standpoint, the color and style of the menu should complement the website, not make it look out of place.

6. Numbers 1 through 5 above apply to sub-menus as well. Sub-menus, from drop-downs, slide-outs, etc., should meet the same standards as your main menu system.

Obviously this list is not all inclusive. There are many factors involved with menu systems on websites. Just like the website itself, the elements of design, colors, and operation of menus are just as critical in keeping those visitors.

Your website is one of your key tools for getting information out to your audience. The goal can be for a business to gain customers, getting someone to join a group, or subscribe to a newsletter. With a website, you want to be found on the Internet and get visitors to take the action you want them to.

Stay in People’s Minds

“Out of sight, out of mind”. That adage definitely applies here. You have a website and you need to make sure everyone possible is aware of it. This is where you can “advertise” not only your business, but your website as well. It is advertising your advertising, if that makes sense. You should put your website and email addresses on or in Newspaper Ads, Yellow Pages, Business Cards, Letters, Invoices, Online Ads, Emails, Flyers, Store Windows

You could even purchase some magnetic signs to put on your vehicles. Make sure your drivers have plenty of business cards since you never know when someone will ask for one. (I did, at the Post Office the other day from someone who was checking their mail.) There are many benefits to having your website and email addresses shown everywhere you can.

Online Directories

Another thing to consider is online advertising. Once you have a website, that does not mean you can now just sit and wait for people to start contacting you. Sorry, but there is more work to do. Online advertising does not consist of just your website. There are also those online directories that relate to your industry as well as those industries that relate to yours and some generic ones also, such as Merchant Circle and Craigslist.

Confused? Let me give you some examples. As web designers, we would join directories that deal specifically with web designs and web designers. We might also join directories that are for internet marketing, business advertising, printers, photographers, etc. They are not specifically web designers, but they relate to the interests of our customer base – advertising their business.

Another example would be for a house painter. He or she would advertise as a house painter and join those directories, but also would consider joining in categories such as house construction, house renovations, possible even real estate. After all, who does not get their house all prettied up when they want to sell it?

Website Coding

What about the website advertising itself? It can actually advertise itself. When you visit a web site, there is a lot of coding you do not see, hidden so to speak but there, created by the web designer to make the web page look like it does. One such piece of code is called a “meta tag”. This is a code that some search engines might use to identify or describe your website:

 <meta name=”description” content=” ” >

When you get on Google and do a search, you see a number of websites show up depending on the words you used to search with. As an example, by using the key words to search by, “web designs by”, here is what shows up:

Introduction to Web Designs by LAO

Web Designs by LAO designs new websites and updates existing websites with guaranteed results.

The first line of the entry shows the Title of the page the search engine found. The second and third lines are shown because that sentence is located in the “description” Meta tag of our website as follows:

<meta name=”description” content=”Web Designs by LAO designs new websites and updates existing websites with guaranteed results.” >

The search engine read this from the website and showed it in the search results. When the website was set up by the web designer, this information was properly placed in the Meta tag for the description, located in the main page in this case.

Each page can and should have a different description in the Meta tag. For the description Meta tag, it is recommended that you keep the information relatively short, usually no more than a couple of sentences long. Some say no more than 250 characters including spaces. The content of the information you place there should relate to the content of the specific page where you put it in.

Note: Not all search engines use the exact description you put into the meta tag. The search engine might disregard your Meta tag and simply take some of the content from your web page and use that instead.

So, there are just some things to consider for basic marketing of your website, business, or information resource. Happy Advertising!

Color.

One of the biggest roadblocks many of us have when designing is deciding on a color scheme. Whether it’s a logo, a brochure, or a website, the best layout design in the world will look awful if the colors clash with each other. (Have you seen some of the older websites out there? Have your eyeballs recovered?) Our reaction to color is almost instantaneous and has a profound impact on the choices we make.

Things to Consider When Choosing a Color Theme

1. Personality. Let the colors speak for your personality and image — whether it’s professional, fun, natural, whatever. Choose colors that align with your own style and taste. It’s why we ask our clients questions about they want to convey with their website. One of our clients Consoling Grace, is a church bereavement ministry. The color theme is soft, muted pastels of turquoise, rose and pearl gray to convey a gentle, supportive, soothing feel to the site. Bright reds and yellows would have been inconsistent with the purpose of the site. (Check out this article on Squidoo for a quick look at general responses to colors based on research, historical significance of color and word association studies.)

Remember that the color theme used in your website should also be used in your flyers, logo, business cards, whatever gets seen by others.(Obviously, not every color needs to be used in every piece.) Color is part of your identity!

2.  Too many colors. How many is too many can be hard to answer, but in general one can say that the risk of using too many colors is greater than the risk of using too few.  You will need a primary color (the main color of the page), which sets the tone for the design as a whole.  Pick a secondary color that “backs up” the primary color. It is usually a color that is pretty close to the primary color.  Select a highlight color which emphasizes certain parts of the design. It is usually a contrasting color and should be used sparingly. Depending on your image, more colors can be used, but remember that too many colors will make the page feel busy, cause eyestrain and make it difficult for the user to find the information he or she wants.

3. Contrast. Make sure there is a noticeable difference between your background, main text and link colors. Make sure the colors you choose are not too monochromatic or too similar to your text and links. For the most readability choose complimentary colors or stick with the classic black on white.

4.  Avoid Seizures. Super bright and colorful makes a theme very hard to look at.  While bright colors can be used as accents, if your site looks like a mashup of Pokemon, Jolly Ranchers, and an explosion in a paint factory, it will overwhelm the content of your site.

5.  Complimentary colors.  Complimentary colors are those which essentially make one another stand out — in other words they just look great together. They make people FEEL good when looking at them. It may seem crazy, but it’s a psychological response in humans. It’s also why the color wheel is used by many logo designers, marketers, and advertisers.  My art teacher used to say that if you mixed any two paint colors together and if the resulting color looked like any shade of ordinary mud, you’ve probably chosen complimentary colors.  Red and green are complimentary colors, but keep in mind that a darker shade of green and a lighter shade of red don’t compliment one another nearly as well as a darker shade of green and a darker shade of red do.  Remember too that darker colors are easier to see than lighter ones. If you choose a text color other than black, make certain it’s the darker shade of whatever complimentary color you’re using.

Color tools.

Thankfully, there are a lot of tools available on the web to help sort out color nightmares.

One of my favorites is EasyRGB.com , which lets you put in a hexidecimal color code and it brings up a list of complimentary colors.  This is great if you already have a primary color in mind.

Another great site is ColorBlender , a free online color matching tool.  Simply play with the sliders below the colorblend images and it will show you colors that work well together.

Whitespace.

“Above the fold” isn’t just a newspaper term. On the internet, it refers to the part of a web page that appears in a visitor’s browser without scrolling. It’s the most valuable part of the page – but don’t stuff too much inside too small a space or your design will look cramped (look at the example under #2 above)

“Whitespace,” or “negative space” is the space between elements in a composition.  Whitespace is space that’s deliberately left blank to better structure the page and emphasize different areas of content.  It is NOT empty or wasted space, nor is it necessarily white.  It is an integral part of a design.

A page with too little whitespace makes visitors feel uncomfortable because the page seems cluttered and hard to read. They quickly get overwhelmed and move on to another site.  Pages with too much whitespace, on the other hand, seem empty, as if there’s not enough content to fill the page. Visitors may wonder: “why bother with this?” and go somewhere else.

“Passive whitespace” adds breathing room to a design.  A common example would be the spacing between paragraphs of text, or between a header and the rest of design.

When whitespace is used to lead a reader from one element to another, it’s called “active whitespace.” It visually separates the navigation, content, header, and footer.

Take a look at these two pictures.   The content is the same, the photography is the same, the colors are the same, but they convey a very different image.  The one on the left uses little whitespace and  looks efficient, a bit outdated, and (let’s face it) cheap.  The one on the right uses a lot of whitespace and looks luxurious.  Which facial mask would you rather use?

Whitespace affects the look and feel of a design.  Use it!