The answer to this is not new, and has been discussed adnauseum on various tech and marketing forums, but might be a revelation for the new business owner. But more importantly, understanding the real business model of search engines will help you position your company in that “game” for better long term results.

Google is the leader of the pack right now, so we will limit our focus on understanding Google, but generally the same ideas also will apply to all search engines. Understanding who is the customer, should be a big part of the underlying core of everything you try to do when interacting with Google.  Therefore, if what you are trying to do, conflicts with Google’s business goals then you are swimming  upstream and this will lead to poor results and significant frustration.  One of the first topics toward understanding Google is: Who is Google’s real customer?

Finding the real customer

If  you thought it was you, the business that wants to rank in their search results is Google’s customer, then “you be wrong”.  The right answer is found by following the money, and the money comes from the businesses that are purchasing the ads.  The value of those ads has to do with “high quality and relevant eyeballs” (the users), which is the traffic that is generated by people using Google to find “stuff”, and that “stuff” (products, services, and information) is what attracts those search users.  When a user (the eyeball) lands on a search result, Google’s goal is to then provide ads that match that search and increase the likelihood that this user (the eyeball) will also then click the ad.

Google maximizes the value of that ad space by how well it matches the users (the eyeball) demographics to the presented ads, which makes their “eyeball” exposure more relevant, of greater quality, and this in turn increases the value of the ad space.  To do all of this Google has to maintain a balance  between offering reliable and high quality search results for free and how it leverages, defines, and filters that traffic demographics to match the  ads. Basically the search user is the product, the real customer is the advertiser. Where does that leave you?

This is not a unique concept to the Internet, but has been true of all media from the beginning.  If you listen to music or talk on the radio, you are probably not the customer — you’re the “ear” for the advertisers that are targeting your demographic. The music and talk is just the bait to get you to listen. If you watch television, again, you are not the customer — you are the product and the bait is the programs. If you read most magazines (even if you pay for them), you are not a customer — you’re the product, the bait is the articles and pictures.

The search user is the Product, your website content is the Bait

There are three players in the search business model, The search user, the search listing (your webpage content) and the ad purchaser. As mentioned above, many SEO commentators have referred to the search user as the product.  The point here is that the product (the search user) engages the search system to find “stuff” and if that “stuff” is delivered reliably and if high quality, then the customer (the advertiser) gets the opportunity to have their ad presented to a highly qualified and motivated audience.  Thus your  website content listing becomes  “bait” to the product, the search user, so the customer, the advertiser, can sell the user something that relates to their search criteria.

The eye opener for many new Internet businesses is understanding that you are only the bait. The problem for both you and Google is that YOUR motivations can come in conflict with Google’s.  All that you care about is getting on the first page so that the chance of a search user clicking to your website goes up.  Somewhat like the ad purchaser, you want the “eyeball” but you want it free. So, from your point of view, ANYTHING and ANYWAY you can get on page one is a Good Thing. Gaming or hacking your way to page one is fine with you.  Unfortunately you are on a collision course with Google because they want quality bait.  If they don’t provide quality bait for the search user then that searcher will go elsewhere and Google’s ad revenue will suffer. They loose their real customer.

Google has to keep the quality of the search results high.

The value of that ad space depends on high quality search users.  Users that keep coming back and searching repeatedly and get the results they need will become a reliable product.  Metrics can be gathered as to their preferences and habit, needs and desires. This then allows Google to deliver the right audience for each ad.

What this boils down for you the online business that seeks free exposure by getting higher on the page ranking is that you have to become “quality bait”.   Frankly, Google is always trying to show everyone that will listen how to be “quality bait” and their latest attempts are called the “Panda updates”.  We will cover many of these concepts as we go through this series of articles, but for now it is important to understand where you fit in so that what you need to do to become “quality bait” will make more sense.

So, if you want to be Google’s real customer, buy ads (AdWords, AdWord Express, and Adsense). Otherwise, you need to understand the game and that is  your website is bait to attract search users that is the real Google product, that Google then sells to advertisers.

Over the last few years it has been interesting to see how many NEW websites are not  W3C compliant.  Part of the problem is the reality of SEO and the emphasis placed on the “latest great SEO technique”.  Lost is the core foundations that make the web work and SEO possible.  I was much relieved to see Google’s Panda release because a “very important leader” in the SEO world finally has made it clear that a well build website is what they want to see.

The value of building compliant websites has been well documented for many years, but apparently not widely accepted. Basically there is no way you are going to make the investment of developing websites using Web Standards, if you don’t see that value. Much has been written in the past on the value of web standards, so I don’t feel that I can add much that is new to this discussion. Following are a few sample links for your reading, if you are having problems understanding that value: (Note that he last article provides some “counter point” to the discussion so you can appreciate that it is not a simple issue.)

• Why Web Standards
• Why Web Standards do matter
• Why Web Standards Fail

But the final straw in all of this is when a major search engine basically, in my mind, says “There is a lot of junk out there and it is time that we made it clear the we want quality”.   Actually what really has happen is that Google created a monster, SEO, and that monster is about to drown the master with garbage. 

It have a quality web experience the website needs to have a quality foundation. Fortunately if you are using or planning on using the latest WordPress then you have a worldwide team of developers that have been doing a quality job right from the start.  Be careful though, because that foundation can be crippled by a poor theme. So if you are using WordPress, choose wisely.

But what if some or all of your needs fall outside a quality CMS and you need a static webpage developed or need some core code to embed in a custom dynamic site.  Even if you are not doing this coding yourself it is best to understand what this is all about and that we what we will get you started on here.

So, let’s get started..

Part I – Setting up and Developing a General Strategy

Setting Up

The first step in this process is to insure that as few road blocks as possible exist toward the goal of a W3C compliant website. The first of those road blocks is interestingly, the browser itself. (You should have seen that one coming.)

Legacy

The legacy of the browser wars is that there is still a significant number of web users are using a browser that does not fully support standards, fortunately this number is changing.   A look at the most recent stats on browser use:

www.upsdell.com/BrowserNews/stat.htm

..shows that it is hard to pin down exactly where the dominate browser use is these days. There are a couple of things that stand out from my perspective:

• There is still a significant but dwindling user base that is still using non-compliant browsers
• That usage is changing toward more complaint browsers and that is ALSO becoming significant.

What is the point?  Our primary mechanism for meeting the standards will be the use of CSS.  Each of these browsers have quirks in their support of CSS and the mix of browsers that must be supported will have a direct impact on how much work we must do to meet the standards and get the job done effectively.  During this series we will directly address techniques and strategies for supporting this wide array of browsers.

Default Style Sheet

Every browser has a default style sheet (This is our first strategy for dealing with this legacy). This style sheet is run on the incoming HTML, BEFORE  you have any say in the matter. It should be no surprise that every browser’s defaults are different. Therefore our first job is to UNDO that default browser style sheet. Fortunately, this job has already been done for us by the masters of CSS. Following are some background links to samples and articles on the concept of the CSS Reset:

• CSS Tools: Reset CSS
• YUI Library: Reset CSS
• Create the Perfect CSS Reset

These articles should be reviewed and should provide enough samples to create your own “reset” style sheet. One word of caution: Too much of a good thing is always Bad! Keep this in mind as you develop your reset style sheet, keep it spartan and simple.  The next step is “How do I use this?”

This is fairly simple. At the top of your main style sheet (and the one you always load FIRST) you would add:

/* Clear all default styles */

@import url("cssreset.css");

You now should have a level playing field from which to develop your own “default” styles for most all of your website development. At this point I can only give you an example of what I do, and hope that will give you something with which to start.  I try and cover the following areas in my “defaults”:

• Default Body styles (font, color, background)
• Default Heading (h1,h2,h3) font sizes (font, margin, padding, color)
• Default paragraph (margin, padding only)
• Default ordered and unorder list style (I leave off the bullets**)
• Default Link style (link, visited and hover)

(**Why? This is because I use lists more for menus and structured lists that usually add their own “decorations” so this gives me a starting point without having  to  “undo” something)

That is it! Every website will need to enhance either all of part of these, but it at the least should save you some typing and give you a specific place to make those changes that affect your entire website.

Development Browser

It is impossible to test every step in your development process on every possible browser.  Therefore you need to determine the best browser to use as your base of development. Using a browser that (at the time) adheres most completely to the standards should be your choice.  Currently this is generally FireFox’s latest version. Every other browser becomes some “exceptions” later on when you do cross browser testing (That is a whole other article.)  This may change in the future, but for now FireFox should be your “base browser standard”.

 General Layout Strategies – Layers

Getting the layout right is probably the hardest part because it involves visualing how various design components need to be either layered or nested to achieve the correct effect.  This part of the series will start of with a general layout strategy that involves layering of design components.  Hopefully, this will give you a good example to try out and form your own working style.

The two major road blocks in building a website using CSS often come down to  “Were do I start?” and “What is next?”.  CSS is like building with “silly puddy”, nearly every thing you do can significantly affect the rest of the page. Borders, margins, padding can make lining up the simplest things a nightmare.  The worst nightmare is to have the page nearly done and that last “thing” turns the page to mush.  (..as the computer goes flying out the window…)

You best defense in this “mushy” world is a very controlled  process that minimizes any domino effects. Generally I work in two “spacial” directions at once.

1. Back to front – View the website as layers of color, images and text stacked on top of each other.
2. Top – Left  to  right, Repeat – Start with the bottom most layer that hits the upper left corner, then:.
3. Repeat the process for each “block” – Each layer will have often have nested blocks, work those from left to right as well

The critical part is that at each step it should be viewed and tested.  To accomplish this, have your development browser open in a separate window and refresh it at every step of the process.  If you use a tool like Dreamweaver, DON’T  rely on its “design view”. This “view” will allow you to think you have it all right and at the end it is really a big mess.

A Simple Example

This is all nice in theory, but how does this really work. To make this easier to visualize we’re going to build the home page for a real website. The design is simple,  clean and most importantly, focuses on the “layer” aspect of the process, so we won’t get lost in complications at this point. Here is our target design:

Looking at the design can be overwhelming if you are fairly new to CSS, so the first thing to do is block out everything but the overall background and position of the design on the page. The key at this point is the break out of the images from the original design.  This particular design’s background was broken out as follows:

1. A background “vertical strip” showing the color gradient from top to bottom that will be repeated left to right.
2. A content background “horizonal strip” going down the main content area.
3. A header  background that includes a small trim of the top gradient of the first background.

We will first assemble these in three steps so that we can illustrate the process.  I don’t want to short change the importance of getting the various design components broken down correctly.  This requires some skill with programs like PhotoShop and most importantly, the layering abilities of these programs.  You will need that to help visualize the layers needed and to extract the proper components for your website build out.

Background – Step 1

First the basic HTML code that will be our first layer:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8" />
<title>Skin Fitness, Etc</title>
<meta name="keywords" content="" />
<link type="text/css" rel="stylesheet" href="basic.css" />
</head>
<body id="home">
<!--set background to bodybkgr.jpg-->

</div>
</body>
</html>

(Note: for the remaining code in this process I will be leaving out the doctype and head sections to only focus on the body tag sections)

Next, The CSS code:

body#home {
background: url("images/bodybkgr.jpg") 0 0 repeat-x;
}

As you can see this is really simple code and gives us the following page in our development browser:

Background – Step 2

Next is the content background that also lays out the focus of the webpage. This page will be left-right centered.

The HTML Code:

<body id="home">
<!--set background to bodybkgr.jpg-->
<div id="mainwrap">
<!--set background to contentbkgr.jpg-->

</div>
</div>
</body>

The CSS Code:

div#mainwrap {
margin:auto;
width:831px;
height:700px;
background: transparent url('images/contentbkgr.jpg') 0 0 repeat-y;
position: relative;
}

Review of the CSS:  First “margin:auto” is what centers to main page wrapper in the center. The width was determined by our header image (which we have not place yet) and the height is temporary (we will remove that later when we have some “content” in place) because we will want the content area to expand to fit any added content and not be “fixed”.  Next is our background image that is repeated in the “y” axis (up and down the page) and the last setting is the position, which requires a bit more explanation:

Every <div> that we want to be a “container” must have a position in order to “contain” other tags. A “safe” position to start with is “relative”, which means it will stack in the order that it is placed in the code. This is our “outer most” container so that may seem irrelevant but it will be containing other tags so it requires a default “position”, even if that appears to mean nothing.

So, here is what we have at this point:

 Background – Step 3

This next step provides the correct color for the upper gradient and unlike the mainwrap swatch is actually an large block that will be the background of the header and menu. For the moment we have added some <p> tags to force it to be visible (they are like the height setting in the previous layer) and will be removed when we put something in our box that is of the correct size (which will be 665px).

This brings up an important “strategy”, adding temporary content into our blocks (<div>) so that we can see what is happening at each step.  It would be tempting to just: “put everything in there that needs to be there”, but I have found that K.I.S.S. (Keep it Simple) is very important, because content can rage out of control quickly.  As a technique I will often add a dashed border to a <div> so that I can see its position better. I often use:

border:thin dashed;

…with different colors, and then removed it later.

The HTML Code:

<div id="mainwrap">
<!--set background to contentbkgr.jpg-->
<div id="contentwrap">
    <!--set background to contentbkgr2.jpg-->
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
</div>
</div>

(Note the extra <p> tags are just temporary)

The CSS Code:

div#contentwrap {
position:relative;
background:transparent url("images/contentbkgr2.jpg") 0 0 no-repeat;
}

Nothing new here but just to make no assumptions:  The background image is not a strip that is repeated but is a full image with a height of 665 px. We will be putting a header and the menu in this area and that will fill out this space. The position attribute is there for the same reason as above.

(Note that the contentwrap image is going to drop down more when we start putting stuff in that container. For now you see that strange white bar, that will be gone.)

Now we have the basic background finished and the next series of steps are:

1. Place the header block
2. Place the menu bar
3. Place the actual content block

Note: Make sure you remove the temporary height setting of the previous steps so that the page will properly move with the content that we will be adding later.

The Header  Image – Step 1

Notice at this point that we have NOT placed any images on the actual webpage. We are going to continue with this practice.  The reasons? We will analyze them further in Part II of this series. I just wanted you to note here that we are doing it this way for  specific reasons .

The HTML Code:

<div id="mainwrap">
<!--set background to contentbkgr.jpg-->
<div id="contentwrap">
<!--set background to contentbkgr2.jpg-->
<div id="homeheader">
<h1><span>SkinFitness,  Etc</span></h1>
</div>

</div>
</div>

The CSS Code:

div#homeheader {
position:relative;
background:url("images/homeheader.jpg") no-repeat;
margin:0 0 0 35px;
width:761px;
height:573px;
}

div#homeheader h1 {
float:right;
background: url("images/home_logo.jpg") no-repeat top right;
margin-top:0;
margin-right:50px;
width:261px;
height:261px;

}

The CSS is a little more complicated so let’s break it down in steps:

1. The homeheader block has the main background for the header. The 35px to the left is to account for the background margin that we don’t want to hide. The width and height account for pushing the contentwrap down so we removed the temporary <p> tags.
2. The homeheader <h1> tag  contains the logo that we float to the right (more on the wonderful world of floats later). A right margin keeps it from covering the same background margin on the right. The width and height are exactly the width and height of the image.

Now the pretty picture:

Rather amazing that so little code can produce a page that looks nearly done. This is the real beauty of CSS and web standards: Small compact pages that load fast, are easy to read and understand and provide clear information for search engines.

The Menu Bar – Step 2

In the interest of not throwing more new concepts at you in this demo, we will just use a string of <a> tags for the menu. Generally I would use a <ul> tag (un-ordered list) but that will require more explanation that we will save for another time.

The HTML Code:

<div id="contentwrap">
<!--set background to contentbkgr2.jpg-->
<div id="homeheader">
<h1><span>SkinFitness,  Etc</span></h1>
</div>

<div id="mainnavhome">
<!--just line of <a> tags for this menu-->
<a href="index.html">HOME  </a>
<a href="aboutus.html">ABOUT  </a>
<a href="services.html">SERVICES  </a>
<a href="products.html">PRODUCTS  </a>
<a href="testimonials.html">TESTIMONIALS  </a>
<a href="contact.html">CONTACT</a></div>

</div>
</div>

The CSS Code:

div#mainnavhome {
 position: relative;
 left:130px;
 top:-150px;
}

div#mainnavhome a {
 display:inline-block;
 margin: 5px 5px 5px 5px;
 padding:20px 10px 20px 10px;
 vertical-align:top;
 font-size:1.1em;
 color:#721617;
 text-decoration:none;
 font-weight: bold;
 font-family: "Trebuchet MS", Times, serif;
}

div#mainnavhome a:hover {
 text-decoration:underline;
}

A brief tour of the CSS.  The menu will live in a <div> block: mainnavhome.  It will be positioned “relative” (mostly because it needs to contain other components) and sized to match the needs of the embedded <a> tags. (You will usually have to play with this sizing as you build the menu). A negative setting of -150 to the top attribute moves the menu up into the header image. (Note that the content will also be moved up in the same manner later)  Next the <a> tag is set with a “inline-block” so that we can line them up in a single row (the natural order would have been stacked vertical down the page). We set various margins and padding to get the spacing we need.  The natural ‘underline” of an <a> tag is removed, and is then added as a “hover” attribute.

The Content Block – Step 3

We are just about done with this  process. As a reminder, we are leaving out a footer at this time so as to keep this article from becoming a book but it will just continue the same process.

The HTML Code (abbrevated here for space savings)

<div id="contentwrap">
<!--set background to contentbkgr2.jpg-->
<div id="homeheader">
<h1><span>SkinFitness,  Etc</span></h1>
</div>
<div id="mainnavhome">
<a href="index.html">HOME  </a>
<a href="aboutus.html">ABOUT  </a>
<a href="services.html">SERVICES  </a>
<a href="products.html">PRODUCTS  </a>
<a href="testimonials.html">TESTIMONIALS  </a>
<a href="contact.html">CONTACT</a></div>

<div id="homecontent">
  <p><strong>Charlene Handel, Certified Organic Esthetician
and owner of Skin Fitness,</strong> offers each client a
private consultation which includes a comprehensive skin
assessment.  From this assessment, she custom blends the
finest &amp; most pure natural ingredients to meet each client’s
specific skin needs. 
To ensure optimal results, Charlene incorporates
state-of-the-art equipment for each facial.</p>

<p><strong>
Call today to discuss your Skin Fitness needs:
760.727.0300</strong></p>

</div>
</div>

The CSS Code:

div#homecontent {
  position:relative;
  top:-150px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:1.2em;
  color:#721617;
  margin:20px 20px 0px 20px;
  padding:0px 40px 0px 25px;
  width:725px;
}

CSS Notes: Like the menu it is postioned relative with a negative top attribute to move it up under the menu and OVER the header image. The rest of the settings are for spacing and formating the text.

The website home page is basically done, at least for our purposes. Let’s reivew our goals and what was accomplished with this process:

1. The website code is SEO friendly and only contains elements that are meaningful to search engines. There are no extraneous tags or images (spacers or just pretty stuff).
2. The design is contained completely in the style sheet.
3. The website will be fast to load.
4. The website will be fast and usable on a small mobile screen (phone or similar device)

The real magic of this process is what the search engines see, and that is nice clean, well structured content.  Let’s take a peek:

As you can see after we remove the styles we have nice clean content with our website links in a prominent place.

I hope this will inspire you to dig deeper and become a CSS/Web Stardand web developer!

I encourage you to go to the announcement and start thinking about how this will help you in your SEO efforts.

http://googlewebmastercentral.blogspot.com/2011/06/introducing-schemaorg-search-engines.html

I have long been troubled by the weak “official”  support from search engines for a more structure markup schemas (i.e. Web Standards by any other name) and how the popular push in the web industry has been toward a “whatever you can get away with” attitude.   Those that did not struggle through the browser wars of the 90′s don’t realize how this attitude came to nearly cause the Internet to drowned in chaos.

The announce suggest that Google has been supporting this all along, but support has been so weak that most SEO professionals seemed to think that Web Standards are a nuisance at best. So, I’m encouraged with this announcement and hope that they will push it in the way they can push it best, by rewarding those that use standard schemas with better placement in the search engines.

So, why the  difference in operation and cost?

Let’s start with an analogy.   You want a model antique car to put on your shelf. You have two choices – You can purchase that model car complete and shrink wrapped.  Just open the box and put it on your self, or you can purchase a kit in which you need to spend hours assembling and painting.  It may be that the shrink wrap car looks more “toy like” or “common” and not quite what you want on your shelf.  The kit allows you to put extra effort in making the car look special or more “custom”. The downside of the kit is that you need to spend hours on assembly and it is very tedious and careful work.

This is the same difference you face with WPStandard vs. WPPro.

What is PayPal Website Payments Standard?

WPStandard is the shrink wrap solution. PayPal provides everything and all you have to do is create the buttons. There are a few other enhancements that require a bit more setup but the basics are pretty easy and quick. Everything revolves around “making buttons”, this is the core concept.  PayPal also supplies a “virtual’ shopping cart that you can add you logo and do some very simple colors schemes. There is no real cart in the same way that a more traditions shopping cart is designed.  This is a great start,  but like the model car there is a down side: It has limitations on how “custom” it can look.  The whole buying sequence can be “clunky” by some and often confusing to a “credit card” customer because PayPal places emphasis on their standard PayPal accounts.  PayPal did an excellent job, that is not the problem. The problem is that in creating a shrink wrap solution that is “simple” it must, by definition, have limitations.  It is the nature of the beast.

What is Website Payment Pro?

WPPro was developed to allow  developers to integrate PayPal services seamlessly into their solutions. What you get with WPPro  is a “box of parts” (in programming lingo this is called an API – Application Programming Interface) and about 4 different manuals. Each manual covers a different part of the system. They are:

• PP_WPP_IntegrationGuide – Overview of all the parts and how they integrate.
• PP_Sandbox_User_Guide – For testing your solution.
• PP_NVPAPI_DeveloperGuide – The underlying API (Application Programming Interface) used by WPPro.
• PP_ExpressCheckout_IntegrationGuide – More details about Express Checkout and how to integrate it with other payment systems.

This can be nothing short of overwhelming.  WPPro has two basic components: Direct Payment and Express Checkout.  Direct Payment allows the customer to use their credit cart and is very similar to other payment vendor solutions. Express Checkout is designed to  integrate PayPal accounts into any payment solution. At this time, our understanding is that you are required to use Express Checkout with your Direct Payment. What this means is that you can not use only the Direct Payment part of WPPro without also implimenting Express Checkout.

Do you really need to know all of that “stuff” to use WPPro?  Actually no, there are two ways you can use WPPro:

1. Plugged into a standard shopping cart.
2. As a tool for building a custom purchase system.

Next we will discuss those two options.

PayPal WPPro in a Standard Shopping Cart

In this case someone else has used the WPPro API to do a general integration into their shopping cart.  This is a good solution if  the standard shopping cart format works for your needs and the shopping cart of your choice supports WPPro (Most do, but not all, check first). Basically the only thing you need to know about WPPro is how to generate the needed settings for the shopping cart.   This can also be a challenge, so SonicWebTech as a Quick Start package can get you “up and running” for around $295.00.  Later you can have it customized to meet unique needs. It is important to select a cart that is easy to work with and you have access to the source code. SonicWebTech has some reviews of open source shopping carts here:

www.sonicwebtech.com/shoppingcartsopen.html

This link has an extensive review of 4 different shopping carts and provides a good sampling of what is available.

Our installation and customization packages are here:

www.sonicwebtech.com/shoppingcartsservices.html#cartinstalls

It is important to understand that the customization of your cart can become quite expensive.  There are some short cuts that can keep costs down, but as in all short cuts you have to compromise. Basically this would involve finding a “theme” provided by that shopping cart system that very closely matches your needs.  Make a few color changes and stop there.  Going beyond that point starts getting very expensive.  Keep in mind that you can customize these carts to a point where they nearly match your website.

WPPro as part of a Custom Purchase System

This is always going to be a more expensive route and is probably a lot more than you where expecting. It is hard to explain all of the complexity in programming a custom solution. We are often told that   “All I need is….. that should be simple, right?”

Actually, WRONG!  At this point we loose you because it is hard to understand how “simple” requires so much work and complexity.  To understand this, think of your car.  Your car appears to be very simple: sit down, turn the key, grab the steering wheel and push the accelerator. That it!  But wait, did you look under the hood?  One glance and you know this is not simple, and the first time it breaks your pocket book also knows it  is not simple, ouch!  Now go to a custom car show and ask someone what a custom car costs.  You will  hear numbers like $100k, $300k and more.  This is the same car, functionally, as the $20k car you can get from your local dealer.

Is this making a bit more sense?

Maybe some numbers will also help.   The core code that talks to PayPal and processes the needed requests, replies and error handling is about 1,000 lines of code (same as a small 17 page book).  The code that then translates that to your customer on their web browser is about 2,500 lines of code ( about 37 pages in a book).  Add the configurations files and you have about 4,000 lines of code or a 60 page book.  Think for a moment how long it would take you to write a 60 page book.

At this point the temptation is to find “someone” that will do it CHEAP. This is very similar to hiring your nephew that just had basic auto shop in high school to build that $300k custom car for you.  What will happen most often is that you will be burned.  The common stories we hear start like this: “They said they could do this for $XXX, I paid a deposit, and now they won’t return my phone calls.” or “They finished the project but there were problems, and  now they won’t return my calls.”  What happen?  My guess is that they discovered it took a lot more work than they expected and they are now cutting their losses. Sadly, the reality is that you did get what you paid for.

So, the bottom line is this: To get a quality custom solution, expect to start between $2.5k ($1,500) and $6k, for really custom solutions it could go higher.  If this number scares you or is out of your budget, then you need to go back to WPStandard until your business can support a more custom solution.

There are some unique situations where you can keep it under $1k. Generally that involves using a standard solution that is being sold as a package. SonicWebTech has solutions like this for standard donations or subscriptions. As long as you can live with a very “general” solution that will get you started.  Some examples of general solutions are here:

www.sonicwebtech.com/paypalconsult_applications.html

Is there other ways to keep my costs down?

Yes there is.  Basically you have to be willing to do a lot of preparation and clearly define and specify what you need. The more specific and detailed you are the less time is spend “consulting” and the more time is spend “building”. Consulting is not free, and you must realize that the cost of this special help can be as much as a third to half of the cost of a custom solution.  So the savings are significant.  The problem here is that you may not “know what it is that you don’t know”.   This leaves you lost and in need of more information.   You have two directions:  Google and a lot of reading, or purchase one of SonicWebTechs “Needs assessment” packages. Or, if you have the need for just ongoing assistance and not a formal structure, our general Consulting packages may be what you need.

Summarize my options.

Stay with Website Payments Standard.

This is a viable option if your business is just beginning and money is tight.  You would really like to appear more professional but the bottom line is “the bottom line”.  A major danger of small business get trapped into is the desire to grow faster than the cash flow will support.  There is nothing wrong with keeping it simple.  There are ways to “jazz it up” a bit more and a good place to start is the PayPal community help forums. There are a lot of questions and answers you can browse and search, as well as ask questions.   Of course in a pinch you can always pay a Certified PayPal Developer to help you over a difficult spot.

Use WPPro, but stick with a standard shopping cart.

You may have to make some compromizes, but it is a very good “step up” from  WPStandard. The challenge is if you have some unique way you want to sell your product or service and you want that uniqueness to stand out.  Other times this can be the perfect solution.  If it is not, you may still need to go this route until your business can afford a more unique solution. Also remember that it you choose the right shopping cart, it can be later customized to meet many of your unique needs. This is where the selection of the cart is critical. SonicWebTech has some reviews of open source shopping carts to help you make the right choice here:

www.sonicwebtech.com/shoppingcartsopen.html

Use WPPro and develop that custom solution, but make sure that you use a professional.

Professionals are not cheap, if they were they would not be in business for very long, nor will they be in business later when you need them. Select your provider like you would select your doctor. The first question should NOT be cost, if it is you should go back to WPStandard right now.  The first question is do they have the skills and how do they conduct their business.  How professional is their website (that is not cheap if done correctly), do they have demos running for you to review, are they  a Certified PayPal Developer. Look for reliability and breadth of knowledge, also review their team and make sure that these is the team you need for your business. This is a company that will become a strategic partner of your business.

The SonicWebTech Team has extensive breadth of knowledge and experience. We are proud of what we have to offer your company and invite you to review our team here:

www.sonicwebtech.com/techteam.html

Wrapping it up

Hopefully you have a better understanding of why the move from WPStandard to WPPro is such a big step. We are constantly looking for ways to make that transition easier and more affordable.  It is a challenge to create general solutions that really meet a wide range of needs.  Fortunately, if your needs fit into the traditional shopping cart format, there are some really great shopping carts that are inexpensive if you stick to the basics. We would really like to hear from you and let us know if this article answered your questions about WPStandard and WPPro.  Leave a comment, please.