Questionnaire appearance

Page structure and templates

In its simplest form, the CallWeb page (see the example on this page) is a vertical construction that includes the following pieces:

  • a header, controlled by the # Header instruction
  • an optional horizontal series of buttons, controlled by the # Button order top instruction
  • the body of the page, that contains the questions
  • an horizontal series of buttons, controlled by the # Button order bottom instruction
  • a footer, controlled by the # Footer instruction

This linear structure and the related pound instructions allow for the creation of a wide variety of questionnaire looks and for the creation of custom pages. While remaining simple, this structure is constraining: it can only be vertically oriented and the integration of visual elements from other sites like corporate Web sites is arduous and limited. The # Template instruction shatters these constraints imposed by the vertical construction of the questionnaire.

Template-controlled page structure

The # Template instruction offers a second page composition method. It identifies an HTML file from which the questionnaire page is built. For example, the HTML file could be a copy of a typical Web page from an organisation or templates of the Government of Canada Common Look and Feel Standards for the Internet standard. In that HTML page, the CallWeb designer places markers that CallWeb substitutes for portions of questionnaire pages. The existing markers are as follows:

MarkerCorresponding contentNotes
&*HEADERPage header controlled by the # Header instructionThis maker does not need to be at the top of the page.
&*BUTTONSTOPHorizontal series of buttons controlled by the # Button order top instructionThis maker does not need to be at the top of the page.
&*BODYQuestions displayedThis maker does not need to be in the middle of the page.
&*BUTTONSBOTTOMHorizontal series of buttons controlled by several pound instructionsThis maker does not need to be at the bottom of the page.
&*FOOTERPage footer controlled by the # Footer instructionThis maker does not need to be at the bottom of the page.
&*BUTTONSH:... (note the colon)Horizontal series of buttons selected from the list of letters that follows the colon. Eligible letters are: [B]ack, [N]ext, [U]nlock, [L]anguage, [T]hermometer, [S]top. For example, &*BUTTONSH:BN displays a Previous page button and a Next page putton, in that orderThis marker, like the others, can be anywhere on the page.
&*BUTTONSV:... (note the colon)Vertical series of buttons selected from the list of letters that follows the colon. Eligible letters are: [B]ack, [N]ext, [U]nlock, [L]anguage, [T]hermometer, [S]top. For example, &*BUTTONSV:BN displays a Previous page button and a Next page putton, in that orderThis marker, like the others, can be anywhere on the page.

These markers can be placed anywhere in the HTML template page. This could allow, for example, to have a Previous page button on the left side of the page and a Next page button on the right side. None of the markers is mandatory and all can be repeated (e.g., there can be several &*BUTTONSH:...)

Technical note: the template page must be built taking into account that the questionnaire is produced from the root directory of the CallWeb instance. Therefore, links to objects (e.g., images, styles, hyperlinks) must be relative to the root directory (which is most flexible) or must be absolute (which is simplest).

Questionnaire appearance

Page structure and templates

In its simplest form, the CallWeb page (see the example on this page) is a vertical construction that includes the following pieces:

  • a header, controlled by the # Header instruction
  • an optional horizontal series of buttons, controlled by the # Button order top instruction
  • the body of the page, that contains the questions
  • an horizontal series of buttons, controlled by the # Button order bottom instruction
  • a footer, controlled by the # Footer instruction

This linear structure and the related pound instructions allow for the creation of a wide variety of questionnaire looks and for the creation of custom pages. While remaining simple, this structure is constraining: it can only be vertically oriented and the integration of visual elements from other sites like corporate Web sites is arduous and limited. The # Template instruction shatters these constraints imposed by the vertical construction of the questionnaire.

Template-controlled page structure

The # Template instruction offers a second page composition method. It identifies an HTML file from which the questionnaire page is built. For example, the HTML file could be a copy of a typical Web page from an organisation or templates of the Government of Canada Common Look and Feel Standards for the Internet standard. In that HTML page, the CallWeb designer places markers that CallWeb substitutes for portions of questionnaire pages. The existing markers are as follows:

MarkerCorresponding contentNotes
&*HEADERPage header controlled by the # Header instructionThis maker does not need to be at the top of the page.
&*BUTTONSTOPHorizontal series of buttons controlled by the # Button order top instructionThis maker does not need to be at the top of the page.
&*BODYQuestions displayedThis maker does not need to be in the middle of the page.
&*BUTTONSBOTTOMHorizontal series of buttons controlled by several pound instructionsThis maker does not need to be at the bottom of the page.
&*FOOTERPage footer controlled by the # Footer instructionThis maker does not need to be at the bottom of the page.
&*BUTTONSH:... (note the colon)Horizontal series of buttons selected from the list of letters that follows the colon. Eligible letters are: [B]ack, [N]ext, [U]nlock, [L]anguage, [T]hermometer, [S]top. For example, &*BUTTONSH:BN displays a Previous page button and a Next page putton, in that orderThis marker, like the others, can be anywhere on the page.
&*BUTTONSV:... (note the colon)Vertical series of buttons selected from the list of letters that follows the colon. Eligible letters are: [B]ack, [N]ext, [U]nlock, [L]anguage, [T]hermometer, [S]top. For example, &*BUTTONSV:BN displays a Previous page button and a Next page putton, in that orderThis marker, like the others, can be anywhere on the page.

These markers can be placed anywhere in the HTML template page. This could allow, for example, to have a Previous page button on the left side of the page and a Next page button on the right side. None of the markers is mandatory and all can be repeated (e.g., there can be several &*BUTTONSH:...)

Technical note: the template page must be built taking into account that the questionnaire is produced from the root directory of the CallWeb instance. Therefore, links to objects (e.g., images, styles, hyperlinks) must be relative to the root directory (which is most flexible) or must be absolute (which is simplest).