The checkout process in cs-cart 2.0 has major design flaws. Not just the checkout process, but the registration/checkout process. Registration is confusing as well.
Conversion rates from google adwords drop from 12% to 6% when switching from my own custom shopping cart to cs-cart 2.0.
I’ve had many customers call me to place an order instead of ordering it online because they were too confused.
I don’t think it matters if it’s onepage checkout or the 3 steps checkout.
The checkout process needs to be easy and provide a lot of hand-holding to the customer. Need detail feedback if there is an error.
I know a lot of newer shopping carts like the one-page checkout because it’s suppose to be easier and support to have higher conversion rates.
However, the main problem with the one-page checkout on many shopping cart is it’s over-reliance on ajax and javascript. This tends to leads to many potential issues with different browsers.
Anyway, here’s some common issues I have with the checkout process
Security. Customer ask how do they know if my website is secure since there is no padlock on the webpage. Had to explain the whole SSL and https, but they still don’t understand because they want a padlock on the page.
Easy fix: Just add a padlock with the word “secure page” on the checkout process.
Billing info before shipping info. Why? I don’t get this. It’s not just cs-cart that does this. It doesn’t make any sense. Maybe it’s because of e-products that don’t required to be shipped? Still, shipping info should be before billing information. With e-products, just skip the shipping info section.
Shipping address and shipment options should be before billing/payment information.
Reason why shipping should before billing:
customers are wary about entering their billing/payment info online. They might be more comfortable providing their billing/payment info to a 3rd party such as paypal or google checkout.
customers want to check out the total including shipping options before entering their billing/payment info. I know there is an option to check shipping cost before the checkout process, but customers tend to miss it. Asking for billing information before shipping address and presenting the shipment options scares customers away too soon.
different payment options. You don’t need billing info for check payment, or even paypal and google checkout. Billing information should only be ask after selecting the payment option and only for the payment option credit card.
Three step checkout process has no order summary! I had to add it to the final step “place order”. Customers are not going to place order if they don’t know exactly what they are placing an order for and what the total is. Add the order summary to the 3rd step “place order”.
Credit card expiration date. Suggest select dropdown menus instead of input textbox. Month should list something like: Jan (01), Feb (02), Mar (03) and so forth. Year should be like: 2009, 2010, 2011, and so forth up to 10 years.
CVV2. What is CVV2 customers ask.
Easy fix: Just add an image of what the CVV2 is.
Credit card payment failure. Needs more detail feedback. Make it more obvious. Some don’t even know their credit card was declined or they don’t know why it was declined.
Easy fix: Payment status such as SUCCESS and FAIL is in big font. SUCCESS in caps and green. FAIL in caps and red. Large font for payment status and make it stand out. On FAIL, suggest to customer to make sure their credit card number is correct and the expiration date is correct. Often it’s the expiration date that is wrong.
As for common issue with the registration process
Registration process relies too much on the ajax notice box which often goes unnoticed.
Customers don’t know that they are register ever they had registered. The ajax notice box that tells them they are registered goes unnoticed. Make it more obvious.
Registration looks like a login screen. Customers called in saying they don’t know their password or to complain about why we ask for their email password. We have selected the email address as the login, so “User account info” ask for email then password. Customers are confused. Make it more obvious. Maybe mention “create an account”, “choose a password you would like to use”.
For all the reasons above, I went back to 1.3.5. I added some of my own modifications that you discussed on both 1.3.5 and 2.0, but still had better success on 1.3.5. My conversion rates tanked with 2.0.
See my last post on bugtracker #1223 titled “Country”
I too am having a tough time with the layout and function of the checkout.
Asking for the password first? How damn confusing is that? I havent found a way to move this down below the email address, it is too intertwined with the way the code is set up.
Our conversion rates have hit rock bottom, and I’m trying to be patient with this cart, but its getting very difficult at this point. I’m thinking of rolling back to our old cart, because this is not acceptable if we want to remain in business.
This cart offers so many things in features, but none of that matters when the customers experiences are not desireable.
Missing things include a real manufacturer field instead of using variants, the ability to add extra fields (yes, snorocked did a good job of pointing out how to manually do this in one of the forum posts, but this doesnt add it to the import/export fields in the available fields list), Product details tabs… most websites you go to that have products listed, have a double tab… one for product description, one for the product specifications.
The ajax “page is loading” thing is really annoying… in some instances, it hangs on that indefinitely even if the page has loaded.
We gave up google adwords, because the customer would come to the site and leave again… why bother?
I kind of agree with you on the billing/shipping address, but we did a different work around for that. we disabled everything in contact information on the profile fields except of course email and password, so the customer only has to fill in the billing address, and unless they click on “ship to a different address” it automatically assumes the shipping is the same as the billing… BUT this causes another problem… if you disable the contact info, then in the orders list there is no name, just the order number, total amount of the order and the date- apparently it retrieves the name of the customer from the contact info… we reported this as a bug, so we’ll see if that gets fixed in 2.0.9 -Speaking of which, I haven’t read anywhere when the planned release of 2.0.9 is due to be out.
This cart could be really great if some of the smaller items that make a HUGE difference in the conversion rate were fixed. Never mind the ease of operation on the backend, the front end it what matters most to making a buck in the store.
The CVV thing is a minor annoyance, along with the drop-down that should be in the CC expiration date… minor, but not so minor when the customer is already starting to wonder if he/she should finish the order or shop elsewhere by this time in the checkout.
Asking for the password first? How damn confusing is that? I havent found a way to move this down below the email address, it is too intertwined with the way the code is set up.[/quote]
This can be changed fairly easily.
This is what I did for 1 page checkout:
I did this by changing skins/your-skin/customer/views/checkout/components/checkout_steps.tpl
I also use the emails as the usernames so I added a note for people to realize this. I did this by changing skins/your-skin/customer/views/profiles/components/profiles_account.tpl
I added:
Your e-mail address with be used as your username. Please provide a password for easy future shopping.
After:
```php
{$lang.username}:
{/if}
```
As for the ajax problem, I agree the little notification is lame. I actually disabled all of my ajax and I don't have that notification nearly as often now.
[quote name=‘glyndon’]I agree with the ajax notification issue.
I have a wide screen and the notification box is nowhere near the page for the customer and admin areas. It is too easy to miss.
It would be much better if it was:
Either embedded within the page area of whatever action the customer is carrying out or at the very least right in the center of the page.
Made bigger.
You have the option of how long the box stays open for.[/QUOTE]
We did precisely two of these things:
Position and placement of the notice div (the notices are divs within a container) are easily remedied through style sheets without touching a bit of code.
We forced all error messages to persist until manually closed. The nice thing about notifications is that this is annoying - i.e. even when you reload the page, if you have not closed the notice it still remains smack dab in the center.
I agree that with the AJAX implementation, many things happen on the cart that require highlighting. Visual queues with a mini “Ok/Undo” bubbles are good in these types of situations. I think the notification system is great, but I also believe that in the interest of context-sensitive help, they should be able to appear near the components that are causing a problem - even with an arrow saying “here’s the problem” or “here’s the change”.
For example, when I add products to the cart, it would make sense that this notification would appear to the right of the mini-cart/total area - notifications are good, but notifications that tell you where to look on the screen are better.
This would be a simple matter of figuring out where the important real estate is in each page/block, and putting notification divs in those local areas that can be populated with an extra parameter - or use the default notification container.
Thanks for the tip on how to rearrange the email password order… I looked for something a little more obvious when trying to track this down and passed over this… Thanks for the tip, its worked great!
what is also quite confusing for customers is that you have to save the shipping address before you can process to payments I guess this should rather be called continue
Billing info should be tied with the payment info. If credit card payment is selected, then billing info is shown. Otherwise, it doesn’t really need to be.
Another issue with the billing info before shipping info:
When credit card payment fails, you are given the opportunity to pay again on the confirmation page if you turn on “repay”.
Although the customer can re-enter the credit card number or enter a new credit card number, they are not able to update the billing info associated with the credit card.
This is awful. Sometimes if their credit card fails, they might want to use another credit card that might have a different billing address, maybe because it’s the new/old address, their parents address, or the business address.
So being able to update billing info on the “Repay” section is important.
So it’s another example why it’s a good reason the ask for shipping information first. Group the billing info with the credit card info since they go together.
[quote name=‘hykit’]The checkout process in cs-cart 2.0 has major design flaws. Not just the checkout process, but the registration/checkout process. Registration is confusing as well.
Conversion rates from google adwords drop from 12% to 6% when switching from my own custom shopping cart to cs-cart 2.0.
I’ve had many customers call me to place an order instead of ordering it online because they were too confused.
I don’t think it matters if it’s onepage checkout or the 3 steps checkout.
The checkout process needs to be easy and provide a lot of hand-holding to the customer. Need detail feedback if there is an error.
I know a lot of newer shopping carts like the one-page checkout because it’s suppose to be easier and support to have higher conversion rates.
However, the main problem with the one-page checkout on many shopping cart is it’s over-reliance on ajax and javascript. This tends to leads to many potential issues with different browsers.
Anyway, here’s some common issues I have with the checkout process
Security. Customer ask how do they know if my website is secure since there is no padlock on the webpage. Had to explain the whole SSL and https, but they still don’t understand because they want a padlock on the page.
Easy fix: Just add a padlock with the word “secure page” on the checkout process.
Billing info before shipping info. Why? I don’t get this. It’s not just cs-cart that does this. It doesn’t make any sense. Maybe it’s because of e-products that don’t required to be shipped? Still, shipping info should be before billing information. With e-products, just skip the shipping info section.
Shipping address and shipment options should be before billing/payment information.
Reason why shipping should before billing:
customers are wary about entering their billing/payment info online. They might be more comfortable providing their billing/payment info to a 3rd party such as paypal or google checkout.
customers want to check out the total including shipping options before entering their billing/payment info. I know there is an option to check shipping cost before the checkout process, but customers tend to miss it. Asking for billing information before shipping address and presenting the shipment options scares customers away too soon.
different payment options. You don’t need billing info for check payment, or even paypal and google checkout. Billing information should only be ask after selecting the payment option and only for the payment option credit card.
Three step checkout process has no order summary! I had to add it to the final step “place order”. Customers are not going to place order if they don’t know exactly what they are placing an order for and what the total is. Add the order summary to the 3rd step “place order”.
Credit card expiration date. Suggest select dropdown menus instead of input textbox. Month should list something like: Jan (01), Feb (02), Mar (03) and so forth. Year should be like: 2009, 2010, 2011, and so forth up to 10 years.
CVV2. What is CVV2 customers ask.
Easy fix: Just add an image of what the CVV2 is.
Credit card payment failure. Needs more detail feedback. Make it more obvious. Some don’t even know their credit card was declined or they don’t know why it was declined.
Easy fix: Payment status such as SUCCESS and FAIL is in big font. SUCCESS in caps and green. FAIL in caps and red. Large font for payment status and make it stand out. On FAIL, suggest to customer to make sure their credit card number is correct and the expiration date is correct. Often it’s the expiration date that is wrong.
As for common issue with the registration process
Registration process relies too much on the ajax notice box which often goes unnoticed.
Customers don’t know that they are register ever they had registered. The ajax notice box that tells them they are registered goes unnoticed. Make it more obvious.
Registration looks like a login screen. Customers called in saying they don’t know their password or to complain about why we ask for their email password. We have selected the email address as the login, so “User account info” ask for email then password. Customers are confused. Make it more obvious. Maybe mention “create an account”, “choose a password you would like to use”.[/QUOTE]
I have to agree with your summary (checkout). At the end of day, it’s about the sale. When a customer looses faith in this process then our work is diminished. It has to be rock solid and it isn’t right now. I too am rolling back as I can’t waste any more time on bugged out software with 2.07. 1.35 was tough enough but at least sales are generated.
When credit card payment fails, you are given the opportunity to pay again on the confirmation page if you turn on “repay”.
Although the customer can re-enter the credit card number or enter a new credit card number, they are not able to update the billing info associated with the credit card.
This is awful.
[/QUOTE]
I did not realize this was how the system works! No wonder I have frustrated customers… they see the failure notice on their card because they entered the wrong mailing address - the payment gateway message tells them their address was not verified as the correct billing address… and yet it is impossible to change it!
The rare customer goes back in and redoes the order all over again, but most just dump it.
This is a SERIOUS flaw - why offer the repay option at all? My customers have a hard time deciding what their “billing address” is anyways - since they don’t expect to receive a ‘bill’ in the mail this becomes arbitrary.
Perhaps it is necessary to retool headings in the languages to make things more explicit for my audience.
Does anyone know if there have been any improvements or suggestions made for the registration process and how to make it clearer that the customer has finished registering.
Every single person I tried to register an account on my site but one all got confused with the Registration process, with them not seeing the small AJAX popup and kept hitting Save, Continue etc thinking it had not worked.
Is there a way to make a central popup occur, or even better make it divert to the home page once successfully registered.
Also, before I do a bug report, can anyone else confirm you cannot change the AJAX popup time anymore with latest version, have set mine from 5 seconds to 90 to 0, refreshed all caches, used different computers and still not change.
[quote name=‘eagleeyed’]Does anyone know if there have been any improvements or suggestions made for the registration process and how to make it clearer that the customer has finished registering.
Every single person I tried to register an account on my site but one all got confused with the Registration process, with them not seeing the small AJAX popup and kept hitting Save, Continue etc thinking it had not worked.
Is there a way to make a central popup occur, or even better make it divert to the home page once successfully registered.
Also, before I do a bug report, can anyone else confirm you cannot change the AJAX popup time anymore with latest version, have set mine from 5 seconds to 90 to 0, refreshed all caches, used different computers and still not change.[/QUOTE]
The “Notice displaying time (to turn off the autohide function enter 0)” in Appearance settings controls only the product notification that pops up when adding an item to the cart.
To increase the general notification display time see the following thread:
The profile registration could use some work - there have been several comments over the past week or so. Post your suggestion in the UserVoice system (the ‘Ideas’ link at the top of the page) so that other can vote for it and also add their comments/suggestions. The developers are using this system to plan for future improvements and have already selected a few for inclusion in 2.1
[quote name=‘jobosales’]The “Notice displaying time (to turn off the autohide function enter 0)” in Appearance settings controls only the product notification that pops up when adding an item to the cart.
Plus whole thread …[/QUOTE]
Thanks heaps Jobosales/Bob, amazing help. I will also submit through the ideas panel (will check first to see if someone else has done something of course).
Thanks again for pointing me in the right direction for the pop-ups.