Checkout usability
 

I've done a fair bit of editing to the checkout process e.g. getting rid of side menus, created a progress bar etc but I stil feel there is more I can do. At the moment I have the header (logo, speed bar) at the top and wondering if I should create a "checkout header" that basically omits the speed bar.

I'm in two minds though as I see a few people with, for example, Jons EzCheckout yet they've kept their store header during the checkout sequence. The usability books I've read and Amazon itself seem to suggest to get rid of any unneeded distractions...in fact Amazon definitely seems to want to drive you forwards during the checkout sequence as you can't click on the previous steps as you can with EzCheckout.

What's the general consensus?

Thanks

Dan

I usually remove both side menus and any links in the header, although I usually keep the header graphics for consistency sake. I always hate how hard it is to go back to shopping at Amazon, so I usualy give at least a link to get back to the store when they are in the checkout process.

Thanks Balinor, my thinking too...I can cover the link back to the store with the continue shopping button.

Dan

Yes, consistency is a good point - you don't want people thinking they have gone off to a different site and perhaps being worried that someone else is going to take their money - especially when you have changed the site by losing the side navs etc.

What I sometimes do as well though, is continue the if statements into the head template and swap out buttons and images that are distracting and replace them with things that may not click and are more helpful to the customer.

It depends on the design and selling methods - you may still want to encourage people to buy more by increasing the quantity and a graphic in the head to say free shipping over x amount may do this. As an example.

Re: Checkout usability
 

can you explain what files you modified to slim douwn your cart?

I've done a fair bit of editing by following various posts on this forum. Looking over my own instructions (quite general!) this is what I found concerning getting rid of the side menus:


Bear in mind these alterations were made when the cart was version 3.5.4, it's now 4.0.12.

I also used this thread to create a progress bar and show/hide different bits based on what stage of the checkout a user is at:

http://forum.x-cart.com/viewtopic.php?t=19568

Hope this helps!

Dan

I've customized the checkout process with the CSS Template I've created, it is similar to what most others do, but has a few aspects to it that I think make the checkout easier, although I do agree it should always be a 3 step process, never more or less. I was rather limited as I did NOT want to modify any PHP files in doing this.

Both the left and right menu's are removed, as most others do to prevent confusion. I've also added a CSS Progress bar, which replaces the search field, this may be bad asumption on my part as it may prevent some upselling but I felt It may do more damage than good as far as the customer NOT converting.

I've also made the proper buttons to "continue" highlighted with another CSS box around the buttons like the "Checkout" button in view cart as well as the Register "Submit" button on the Anonymous Checkout along with splitting this page into a 75% width register form area and 25% width existing customer login form area, which I've seen most others do.

Most of the customizations went into the view cart area where I tried to make it as uniform and usuable as possible.

DEMO:
:arrow: http://www.cart-lab.com/demo_4x/home.php?skin=cssskin

It seems X-Cart is in the right direction and hopefully the fast lane checkout mod will be refined over time to allow as many configurations as possible, as I don't think there is one solid way of defaulting a checkout process so that it works in all industries.

Anyhow, just my 2cents. :wink:

Like Dan I have altered the checkout process as much as possible, and implemented about every mod in these forums. I have spent many hours trying to make it as Б─≤idiotБ─≥ proof as possible. Last week I uploaded the new checkout to my site and my orders this weekend were up about 300%. I donБ─≥t know if it is the checkout process, or maybe just a natural growth of my site, but IБ─≥m pretty sure it was the checkout. :)

I did a Google search for the top ecommerce sites, and tried to make the checkout as close to the Б─≤big boysБ─≥ as possible, while still working within x-cart. I know that this has been beat to death, but I think the biggest problem with the x-cart checkout is too cluttered. I like BoomerБ─≥s CSS template, because it takes a lot of the fluff out of the checkout (pictures, descriptions, multiple invoices, login, etc)

Overstock has one page, name cc and done, some sites have multiple pages but everything is labeled and clear as possible. Half the time I was lost on my own site with the x-cart default checkout.

My favorite error message:

Б─°Your form is filled with errors!Б─²

Just a few things I did that I think helped the checkout.

Removed everything but the header
Removed, pictures, description and compacted the cart.php page down.
Login or Register on the same page
Edit the cart so you only need to enter your name once.
Put graphics on the select payment method page (every other site I looked at had this).
Moved the credit card info to the top of the page with the submit button.

Basically, so it is click, click, click, done.

Just my opinion, but it seemed to work pretty well.

Re: Checkout usability
 

How would I go about removing the links in the speedbar or removing it altogether on the checkout page only?