Creating a Block Quote

In printed publications, a rough rule of thumb is that any quote extending more than four lines should be formatted as a block quote. A Web page, of course, is of indeterminate width and length, so this rule cannot be directly applied, since what might occupy four lines in one instance might occupy two lines in another instance. Generally, however, any extended quotation can benefit from being formatted as a block quote. The example file already contains an extended quotation that you can practice on. Format the quoted material included in the example file as a block quote (see Figure 3.19):

<!--Start quote
<blockquote>
<p>I'd peel away the flakes of shell carefully (the outside
of the egg was very hot), finally exposing the shimmering
white, then, with the spoon, break through to the molten yolk
within. At last, putting down the spoon, I'd reach for the
toast fingers and start dipping. As I savored the rich yolk
and salty butter dripping from the toast, Mom let me dawdle
and daydream, a rare luxury reserved for weekend
mornings.(1)</p>
</blockquote>
End quote-->
<p><strong>Notes:</strong></p>

Figure 3.19: An extended quotation can be formatted as a block quote, separated from surrounding text and indented in from both margins.

You will notice that the quotation is nested inside of a P (Paragraph) element, which is then nested inside of the BLOCKQUOTE element. HTML 3.2 and earlier versions of HTML allowed nesting either text or block elements inside of BLOCKQUOTE elements. In HTML 4, however, text can't be legally nested directly inside a BLOCKQUOTE element—block quote text must be nested inside of one or more block elements. Another consideration is that always nesting block quote content within P elements (or other block elements) will guarantee consistent results when using styles to further specify how block quote content is to be displayed.

It has been fairly common practice on the Web to use the BLOCKQUOTE element as a formatting device to indent text and other elements that are not quotations in from the margins. This is to be discouraged—the HTML 4.01 specification specifically discourages it by deprecating this particular usage of the BLOCKQUOTE element. One of the primary reasons for this is that non-visual user agents cannot distinguish between a BLOCKQUOTE element used to specify a block quotation and a BLOCKQUOTE element used as a formatting device, thus posing a potential accessibility barrier for individuals who cannot see a page's content, but must rely upon a user agent's description of it.