how to offset quotes

Quotes must be separated from text that is not quoted in print, audio, and video. In print, think of this as being done by the quotation mark. In audio and video, we think of using the clip of the source speaking.

However, it is important to make quotes as accessible as possible to the widest range of audiences.

In audio and video, ensure that when quoting a another person, the reporter or broadcaster should say the word quote prior to the quoted material and end the quoted material with the word unquote. This helps specifically delineate where the quoted material begins and ends.

In text, to make a quote visible to both those using screen readers and also visual readers, make sure quotes are offset by the proper HTML tags. Instead of using the quotation mark, use the <q> tag.

Examples:

• <q>It was a long day of debates,</q> Sen. Lawrence said.
  This will render as:
  It was a long day of debates, Sen. Lawrence said.
• <q>We are going to take this all the way to the Supreme Court,</q> he said.
  This will render as:
  We are going to take this all the way to the Supreme Court, he said.
• <q>We opened the center to all who need it,</q> the organizer said.
  This will render as:
  We opened the center to all who need it, the organizer said.

For a pullout quotes and blockquotes within an article, use the <blockquote> tagging.

Examples:
<blockquote>We're so excited to receive this award for dog training. We started training service dogs 10 years ago as a side project, and never thought it would become a full-fledged organization. Now we're the largest trainer in the tristate area with more than 300 foster-trainers. It's overwhelming, really.</blockquote>

This would render this as the following when using the <blockquote> tag.

We’re so excited to receive this award for dog training. We started training service dogs 10 years ago as a side project, and never thought it would become a full-fledged organization. Now we’re the largest trainer in the tristate area with more than 300 foster-trainers. It’s overwhelming, really.

← Return to Accessibility