In this article
The look and feel of the CATI survey can be based on the standard public templates provided by Forsta or they may be completely custom built from a blank canvas. The public templates provided by Forsta come in both non-responsive and responsive formats. The responsive templates are recommended as they will likely provide a better experience for web survey respondents taking surveys on devices with smaller screens such as phones or tablets. The methods used to customize non-responsive and responsive templates are quite different, refer to the separate Professional Authoring documentation for details.
There are minor differences in the template between CATI and CAWI because the CATI mode provides additional features to facilitate keyboard entry.
Answer Code Display
Answer codes are displayed so that the interviewer can provide answers by using the keyboard. Keyboard inputs for categorical questions must be applied using the answer input area at the bottom of the interviewer screen. There is a CATI specific survey setting that determines whether or not the answer codes should be displayed. It is recommended to show them because interviewers can usually work more efficiently by entering answers via the keyboard than with the mouse.
Keyboard efficiency tips: Almost every button/action in the interviewer console has a keyboard shortcut available (see the list of the CATI Console toolbar hot keys in the CATI Supervisor documentation for more information). When entering responses for multiple choice questions the answer codes may be supplied in the form of a comma separated list e.g. 2,4,5,7 (then press enter to apply all selections in one go). It is also recommended to make use of default and refused answer properties where applicable as this can also speed up the time it takes to input such answers.
Active Question Indicator
A vertical colored bar is displayed so the interviewer can see which question their keyboard inputs will be applied to. This feature is most useful when there are multiple questions on a survey page. You can change the highlight color for an active question indicator.
This feature uses CSS tables to apply formatting to appropriate survey layout elements. CSS formatting is applied to cells which contain data related to an active question (or sub-question). Each element is formatted by a specified class. Class properties specify the width and color of the cell border and the background color of a cell. Note that different CSS classes apply for each layout type due to differences in how the rendering functions with responsive and non-responsive layouts .
Below are examples of how these classes can be specified in either layout type.
Nonresponsive layout CSS code Example
Figure 1 - Example of a page with CSS highlighting applied (non-responsive layout)
The example above shows that the first question on the current page is active and highlighted (both the background and the left cell border are highlighted) plus the sub-question and answer options are highlighted.
The code example below applies this formatting. You can add this code on the Custom CSS tab when you design a survey question in the Survey Design mode in the Authoring module.
The following classes are supported:
- .cati-current-question-container - applies style to the cell that contains ALL question data;
- .cati-current-subquestion-container - applies style to the cell that contains sub-question answer option;
- .cati-current-subquestion-container-parent - applies style to the cell that contains sub-question name.
Figure 2 - CSS code used to highlight a question for the non-responsive layout
It is up to the survey author to decide how the style is to look. Ensure all survey page elements are visible.
Responsive Layout CSS Code Example
Figure 3 - Example of a page with CSS highlighting applied (responsive layout)
The example above shows that the first question on the survey page is active (the left cell border is highlighted) and the sub-question is highlighted.
Figure 4 - CSS code used to highlight a question for the responsive layout
The following classes are supported:
- .cf-question.cf-question--current-cati - applies style to the cell that contains ALL question data;
- .cf-grid-layout__row--current-cati - applies style to the cell that contains sub-question data.
Note that CSS used with a responsive layout does not contain classes that are applied to cells containing sub-question answer options.
It is up to the survey author to decide how the style is to look. Ensure all survey page elements are visible.