Layout

Use the options in the Layout tab to choose the look and feel of the survey - .

Figure 1 - The Survey Settings > Layout tab options

Survey Layout to Use

Click the down-arrow beside the field to open a drop-down list of the Survey Layouts available, and select a layout from the list to apply it to your survey. The Survey Layouts comply with web accessibility requirements.

Read more: http://www.access-board.gov/sec508/508standards.htm, http://www.w3.org/WAI, http://www.w3.org/TR/WCAG10/

Note: Easy layouts have some restrictions regarding changing the layout/design. If you are using an Easy Layout and you find that some setup options are not available, try changing to a Public layout.

Panelist Template to Use

Visible when the survey you are working on is a basic panel. Click the down-arrow beside the field to open a drop-down list of the templates available, and select one from the list to apply it to your panel. Note that you can select none (blank - default). If no template is selected, the legacy portal that might have been deployed, will be deleted during survey launch.

Include Progress Bar

This option instructs the generator to include a progress bar on the interview pages. This bar shows the respondent how much of the Survey is remaining (as a percentage). The percentage calculation is based on the entire Survey, i.e. all questions in the survey. This means that if you have conditions in the Survey, the progress bar will jump depending on the number of questions that were bypassed due to the previous answer given by the respondent. The progress bar can therefore sometimes be misleading to respondents.

Reserve a Fixed Area for Validation Error Messages on Every Page of Interview

Select this option if you wish to reserve a small fixed area for page error messages. This prevents the rest of the page from jumping up and down if the interview program displays an error message. Because this area consumes space, you may wish to uncheck this option, especially if you are creating a pop-up survey where the window size is limited.

Generate 'Error:' Prefix for Error Messages

When you have chosen a Survey Layout for your survey, the survey will be compliant with the web accessibility requirements. The only requirements that are not covered by Survey Layouts are including a prefix “Error” in front of the error messages and Insert label for ‘Other’ inputs. In this field you can activate the Generate ‘Error’ prefix for error messages, which means that the word “Error” will appear in front of all system error messages.

Customize Navigation Buttons

This feature allows you to control the look and feel of the Next and Back buttons in the survey. You can set the style attribute for the button or image, and thereby set color, borders, text color, position etc. in HTML. You can choose to use either buttons or images for navigation.

• If you select Button from the Type drop-down, you can enter into the text boxes the texts that you wish to be used in the buttons.
• If you select Image from the Type drop-down, you can enter into the text boxes the URLs to the image files that you wish to use.
• You can set different URLs/texts for each language.
• In the Style field you can enter HTML code to format the text and background of the Back, Next, and OK buttons, for example:

background-color:#e2e2e2;color:black;font-size:10px

For additional information, see: http://www.msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/input_submit.asp

If no URLs/texts are specified, Authoring will create some defaults if the Customize navigation buttons option is selected.

Note: The texts presented in the Back and Forward buttons can be edited/translated in the Survey Messages (go to Survey Messages Overview for more information).

Global button images

You can use images instead of the standard radio buttons and/or checkboxes in your Survey. The Global Button Images feature enables you to specify up to three image URLs such that the images will replace the radio buttons and/or checkboxes in the Survey under the appropriate conditions. The images defined here will be applied for all instances in the Survey, of radio buttons and/or checkboxes as specified, unless other images or "no images" are defined for specific questions. To define other or no images for specific questions, go to the Advanced WI Features tab for that specific question (go to Advanced WI Features for more information).

1. Check the box to open additional input fields as shown below.



Figure 2 - The Global Button Images input fields

2. Type or copy into the appropriate fields, the URLs and file names of the image files you wish to be used for the various instances.

You can define up to three different images for radio buttons and checkboxes;

• Default - the "standard" image that will be used while the respondent has not placed the mouse onto the image area or selected the answer option.
• MouseOver - the image that will be displayed when the respondent moves the mouse pointer over the area of the image.
• Selected - the image that will be displayed when the respondent has clicked onto the image area.

Note: To ensure the images are displayed correctly, the image files should be stored in the file library (go to File Library Overview for more information).

3. Specify the width and height, in pixels, with which the images are to be displayed.
4. Save the changes.

Set Color for Selected Cell

When the respondent selects an option in a grid, the color of the "selected" cell can be changed so that the selected option is clearly visible. Note that the selected color will apply for all grids in the Survey that are using the selected question skin. To set the color to be used for a grid cell once it has been selected by the respondent:

1. In the grid question's Preview tab, click Edit the Question Skin.

The question skin's Page Editor opens.

2. Double-click on the Question Form Inputs item to open its Properties page, then go to the Grid tab.
3. In the Grid Cell Click Color property, double-click on the color example area to open the selection chart then select a color, or type the required color code into the field.
4. Click Apply or Apply and Close as appropriate to save the property changes, then save the changes to the Question Skin.

To view the effects of your changes, go to the grid question in the Survey Tree and click the Preview tab in the Page Editor.

Note: If the Global Button Images property has been defined for the survey (on the Survey Settings > Layout tab), but you wish to use the "selected" color for a particular grid, an additional step in the process may be required depending on the type of grid you are working with.
For a 3d-grid, the Global Button Image setting will override the "selected" color, so you must go to the 3d-grid's Properties page > Advanced WI Features tab and set the Button Images property to No Images.
For a normal grid, the "selected" color will override the Global Button Image setting, so no additional action is necessary.

Cell area Click for Grid

In grids and 3D-grids, this feature allows the respondent to click in the cell area around the radio button instead of having to click exactly on the radio button itself. This simplifies the selection act for the respondent as he/she does not have to be so accurate with the mouse pointer.

The general background color of the cells is defined by the Background > Color attribute in the html style selected for the Grid Table Style property (right-click on the selected Grid Table Style and select Edit this HTML Style).

When the respondent selects an option, an image can be presented in the cell or the color of the "selected" cell can be changed so that the selected option is clearly visible - .

Figure 3 - The selected cells can be given a contrasting color so they are easily distinguishable

If the Button images feature has been set for the question, then the image will override the selected color.

Note: If the Global Button Images property has been defined (on the Survey Settings > Layout page) and you wish to use the "selected" color for just one particular 3d-grid, then in the 3d-grid question's Properties page > Advanced WI Features tab, select the No Images option for the Button Images property.

Answer Buttons

Check this option to replace all radio buttons and checkboxes in the survey with buttons. The button layout can be customized in the Question Form Input properties pane (go to Visual Components for Question Skins for more information).

Note: When using Answer buttons, Capture Order is not supported (go to General for more information).

Label Click for Single and Multi (Select by Clicking Answer Text)

This feature will enable the respondent to click the labels as well as the actual checkboxes/radio buttons for single and multi questions, thereby increasing the clickable areas and making the survey easier to answer.

Auto-next (Proceed to Next Page Automatically When Possible)

This feature will automatically take the respondent to the next page in a survey when all the questions on a page have been completed. The feature will only be applied on pages consisting of single questions (a grid is a collection of single questions, so the feature will be active for grid questions).

Press Enter to Move to Next Field

Check this box to allow the respondent to use the Enter key on his/her keyboard to move to the next field - simulating the Tab key.

Highlight Cells in Grid

Check this box if you want to highlight the cells in a grid question that fail the "Answer required" checks. This will simplify the survey for the respondent as, if he/she attempts to proceed to the next question before having selected the required number of cells in the grid, when the error message is presented any cells that have not been answered will be immediately visible to them (go to Highlighting Error Cells for more information).

Note that this also applies if an Other option is selected by the respondent but they do not enter any text into the Other field.