Registration form

Hi,

I did UX (user experience) on my website with a sample of 10 people.
The most have disorder in understanding the registration form.

2 thinks :

1 - The steps are not clear.
People do not understand really that a registration with steps.
To begin, It would make sense that's tab step complete change color (hope it's clear in english)

2 - On the 1st page of the registration form, we see the intro picture, steps and a part of the form. That's great.
But when we clik on "next button" to go to the step 2, 3,4 ... all the time the page position is below the Steps tab.
This disturbs the user.

Did you have solution about this 2 points ?

Regards

1 - The steps are not clear.
People do not understand really that a registration with steps.
To begin, It would make sense that's tab step complete change color (hope it's clear in english)

It does. The active step becomes blue. See the below.

2 - On the 1st page of the registration form, we see the intro picture, steps and a part of the form. That's great.
But when we clik on "next button" to go to the step 2, 3,4 ... all the time the page position is below the Steps tab.
This disturbs the user.

That's supposed to happen. It repositions where the step form begins. If the page was really long on 1 step, but short on the next and we didn't do the reposition then your screen would be at the bottom or in the middle of nowhere.

krileon wrote:

1 - The steps are not clear.
People do not understand really that a registration with steps.
To begin, It would make sense that's tab step complete change color (hope it's clear in english)

It does. The active step becomes blue. See the below.

Yes that's what I have too. But look at the first tab "subscription" it passed but is still in white (like the tabs Portrait and Fields). It should be blue (or grey) to explain this step is completed.

2 - On the 1st page of the registration form, we see the intro picture, steps and a part of the form. That's great.
But when we clik on "next button" to go to the step 2, 3,4 ... all the time the page position is below the Steps tab.
This disturbs the user.
That's supposed to happen. It repositions where the step form begins. If the page was really long on 1 step, but short on the next and we didn't do the reposition then your screen would be at the bottom or in the middle of nowhere.

Yes that's the problem, we don't see the titles of steps, but just below them, this disturbs users.
How to raise/elevate few pixels to see the titles tabs?

Yes that's what I have too. But look at the first tab "subscription" it passed but is still in white (like the tabs Portrait and Fields). It should be blue (or grey) to explain this step is completed.

It's flat out not colored at all. Bootstrap doesn't have a middle-state for the tab coloring beyond marking it disabled, which it's not (and still wouldn't be grey). If you want it grey you'll need to add custom CSS for it to do so.

Yes that's the problem, we don't see the titles of steps, but just below them, this disturbs users. How to raise/elevate few pixels to see the titles tabs?

Can't because that's where the #HASH anchor is. The HTML is formatted how Bootstrap expects.