Back to all examples

Ask a user one question at a time

ReactAngularWeb Components
<GoabLink leadingIcon="arrow-back" size="small">
        <a href="#">Back</a>
      </GoabLink>
      <GoabFormItem
        mt="xl"
        label="Are you currently in school?"
        labelSize="large"
        helpText="School includes foundational, skills and employment training, micro-credentials, post-secondary and continuing education.">
        <GoabRadioGroup name="school" ariaLabel="are you currently in school?" onChange={() => {}}>
          <GoabRadioItem value="yes" label="Yes" />
          <GoabRadioItem value="no" label="No" />
        </GoabRadioGroup>
      </GoabFormItem>
      <GoabButton type="submit" mt="2xl">
        Save and continue
      </GoabButton>

Ask a user one question at a time.

When to use

Use this pattern when:

  • Building a public-facing form for citizens
  • You want to reduce cognitive load by focusing on one question
  • The question requires careful consideration from the user
  • Following the one-question-per-page pattern for government services

Considerations

  • Include a back link to allow users to navigate to previous questions
  • Use a large label size to make the question prominent
  • Provide help text when the question may need clarification
  • Use a clear call-to-action button to progress