Design

Research and rationale

Our blockquote design is based on the Australian Government Design system pattern where a thick lefthand border and padding are used enhance the visual weight. The research conducted by the Digital Transformation agency indicated that this was done to address WCAG2.0 Criterion 1.4.1.

Colour

The blockquote style uses some of the same visual design patterns as the callout component for consistency, a fundamental principle of our Design Systems. The key difference with blockquotes is that they don't have a background shade, this was intentionally done so that quote would look distinct to callouts. We were also inspired by the W3C Design System that had a very similar design.

Semantics

Our blockquote was influenced by the W3C Design System which had provided best practice of the correct semantic markup and accessibility requirements. (W3C Design System, 2023).

Quotation marks

We follow the Australian Government Style Manual which states that you shouldn't use quotation marks to identify the quoted material – the formatting does that instead. Block quotes should also be coded with the HTML <blockquote> element (Digital Transformation Agency n.d.).