Build: a quotation with a source

Present a long quotation with blockquote, a cite attribute and visible attribution.

Official sourceWHATWG HTML — blockquoteReviewed: 2026-08-26

STEP 1 · LEARN

How it works

Present a long quotation with blockquote, a cite attribute and visible attribution. Semantic structure should describe meaning, not visual appearance.

Correct example

<figure><blockquote cite="https://example.org/interview"><p>The web is for everyone.</p></blockquote><figcaption>— <cite>Author interview</cite></figcaption></figure>

blockquote represents the extended quotation, cite stores the source address in a machine-processable form, and figcaption gives readers visible attribution. figure groups them into one unit.

Common mistake

<figure><blockquote cite=""><p>The web is for everyone.</p></blockquote><figcaption>Author</figcaption></figure>

The cite attribute is empty and the visible attribution does not use the cite element, so the source is not fully described.

STEP 2 · APPLY

Your exercise

Complete the example. Present a long quotation with blockquote, a cite attribute and visible attribution.

index.htmlHTML

Safe resultisolated

The draft stays only in this browser.HTML and CSS allowed · scripts and network blocked

STEP 4 · CHECK

What needs to pass

0%not checked

The quotation uses blockquote with a non-empty cite URL.
The quotation has visible text.
Visible attribution uses cite.

Explain the solution logic

Add the real URL to the blockquote cite attribute and put the work title or author name in a cite element inside figcaption.

How it works

Your exercise

Write and see the result

What needs to pass