Set progress indicator
Without progress indicator
The default setting for the multi-page form is a disabled progress indicator. The user can navigate through all pages, but does not necessarily have an overview of the pages already edited and the number of pages not yet edited.
This is not absolutely necessary for a small number of pages.
- Form configuration » Tab: Advanced » Sub-tab: Layout
Group: Progress Indicator » Parameter: Show progress = “No”.
With progress indicator
The progress indicator must be enabled to be visible.
Note: For a form with many pages, it is advisable to enable the progress indicator to give the user an easier overview and a preview of the number of pages that have not yet been edited.
- Form Configuration » Tab: Advanced » Sub-Tab: Layout
Group: Progress Indicator » Parameter: Show Progress = “Yes”.
After activating the progress indicator, further parameters are available:
- Form Configuration » Tab: Advanced » Sub-Tab: Layout
Group: Progress Indicator » Parameter: Space-Saving Progress = “Yes” or “No”.
Group: Progress Indicator » Parameter: Set Custom Colors = “Yes” or “No”.
Set Custom Colors
Accessibility
Contrast ratios are important components of form accessibility.
The preset colors in Visforms support accessibility and meet international standards.
Even the individually selected colors must ensure sufficient contrast between the foreground and background colors.
Read more about this in the sections
Visforms and Accessibility
and
Creating Accessible Forms.
Default colors
Visforms has default settings for the background color and font color of the various tab types, ensuring sufficient contrast between the foreground color and the background color.
Custom colors
Note: Custom colors must ensure sufficient contrast between the foreground color and the background color.
Visforms offers the ability to individually set the background color and font color of the various tab types.
There are three different tab types:
- Tabs for all edited pages that already contain entries made by the user.
- Tabs for the active page that the user sees.
- Tabs for all empty pages that have not yet been edited.
Color selection can be done in the following two ways:
- Directly entering the RGB color value in hexadecimal notation: e.g., #006611.
- By clicking the mouse in the open color selection dialog.
The color selection dialog opens automatically when the field receives input focus via keyboard or mouse click.
The rightmost optional tab Summary contains the Summary page. Read more about this in the section Summary Page .
Space-Saving Progress
An activated progress indicator can lead to unwanted page breaks in small display sizes:
- Form Configuration » Tab: Advanced » Sub-Tab: Layout
Group: Progress Indicator » Parameter: Show progress = “Yes”.
Group: Progress Indicator » Parameter: Space-Saving Progress = “No”.
An activated progress indicator can be minimized to a minimal display of the individual steps:
- Form Configuration » Tab: Advanced » Sub-Tab: Layout
Group: Progress Indicator » Parameter: Show progress = “Yes”.
Group: Progress Indicator » Parameter: Space-Saving Progress = “Yes”.
