Multi Page Forms

Sometimes your forms are on multiple pages. Like this is not like mind blowing stuff. It happens all the time, especially with complex forms. And you want to inform the user pretty directly. Now this is like minor stuff, but in the aggregate, I think it's pretty useful. So there are a couple of ways to do that. The easiest one, again, just putting it into the page title.

title, say step two or four shipping address, and then you can just add your shipping address.

And then you know that there are two steps ahead of you and you know, one step behind

you.

Perfect.

But there are, and you can also add it into the heading.

Also great.

You can use a progress element in HTML, which can be useful.

And sometimes, now, because this is a graphical element, you have to have an alternative text to write.

And you can do that with, like, step one of circa seven in this case.

And put that into the progress element.

and that is then announced as the label for this element. And why is circa7 in here? Now, you would

use progress if you don't know the steps. You know, there might be a selection at some point

where you jump over a step where you're not sure, you know, oh, this whole page is not applicable

to you so we will just not show it to you um and for a visual user um these um what do we call them

like a progress uh elements like these these progress meters um they are a little bit fuzzy

you know if you're here or here you don't say like oh i probably have another like five steps

to the end you don't you don't say that you say like oh yeah i'm you know i'm not halfway and

then you're at some point you're halfway through and then you're like three quarters through and

if if one of this is skipped it's not like oh i'm now completely i don't know what's going on

it's just like oh this progress was quicker um and if you want to have alternative text for that

you basically want to put the circa in here uh and uh maybe even add like oh we skipped one step

or something like that, but you don't have to do that. But yeah, and then you have like

the finished progress with value seven of the max, which is seven. You can style them.

And then you can have these step by step indicators, which are broken in this version of the page,

which is interesting. So in this case, we have the billing address here. We are currently at

the shipping address. Then we review the order, the payment and finish the purchase. So five steps

here. And basically what that does is that you have this link at the bottom and then you have

the triangles and you see where you are on the progress. And I think this is a very nice

thing to do, especially because you can, because this is a link, you can get back to where you've been. So it's basically just links. And it says here completed. So you have that information as well or current in here.