Make blockquotes inside blockquotes better distinguishable

Question

Given the nature of this site, it happens that one wants to quote something that contains a blockquote itself, e.g., as an example sentence. For example:

A run-on sentence is something like this:

I came I saw I conquered.

As you can see, the quote inside the quote is only distinguishable from its surrounding through the faint dotted line and the small indentation. Regular quotes are much easier to distinguish due to the difference of the background colour. By contrast, on most other Stack Exchanges, quotes are also marked by a vertical bar and thus double quotes can be distinguished sufficiently easily.

A makeshift alternative that some users resort to is using code blocks, but this has several disadvantages like a monospace font and no automatic line wrapping. (See this answer for examples; it does not really work here on Meta due to the desaturisation.)

I thus propose that the site design is changed to make double quotes easily recognisable as such.

Answer 1

You could solve this problem fairly easily by putting your example sentence in italics.

A run-on sentence is something like this:

I came I saw I conquered.

If desired, you can also increase the indent by inserting   a few times:

A run-on sentence is something like this:

      I came I saw I conquered.

---

I think either of those options would be much better than your "makeshift alternative" of using backticks and putting the text into an ugly, monospaced font:

A run-on sentence is something like this:
I came I saw I conquered.

---

You wrote:

this has several disadvantages like a monospace font and no automatic line wrapping.

If the sentence is longer than a few words, I think “no automatic line wrapping” is a deal-breaker on a site like this one. In my mind, that example you point to is a good one to illustrate what not to do. It should probably be edited and cleaned up, not pointed to as exemplary:

_{O R I G I N A L}

_{IMPROVED VERSION}

Answer 2

I'd like to suggest a change to the CSS to make nested quotes more distinguishable:

blockquote {
    border: 1px dotted rgba(151,151,151,0.43);
    background: linear-gradient(rgba(248, 237, 218, 0.5),rgba(248, 237, 218, 0.5));
    }

Currently, the border is only specified for the top and bottom, but it's more obvious if it surrounds the quote. It helps to mark the increased indent of nested quotes.

The background is specified with a transparency, so that cumulative blockquotes accumulate the transparency and become progressively darker:

It's subtle, but it only needs to be subtle.

linear-gradient is not universally supported, but there are browser-specific versions of that directive. Even if it isn't supported, border is universal, and it can be preceded by a straight background-color directive which will be acted on if it's not superseded by the later gradient.

Answer 3

I agree. I was just editing a question like this, and while I think the current embedded block quotes look better than code blocks, they are very subtle and could benefit from being made more obvious.

Italicization only works for example sentences. It can't always be used (for example, it looks bad in extended quote blocks), so it is not a general solution.

I think the indentation for block quotes embedded in other block quotes should be made larger, so that the quoted text is more clearly set of from the rest. The current indentation is minuscule, and the only other marker is the light dotted lines.

Examples

I'll borrow J.R.'s examples.

Original:

J.R.'s Improved version (currently possible):

What I think would be the best version:

Answer 4

The design changes for enabling responsive design included unifying the formatting on quotes network-wide, which solved this issue.

Answer 5

Yet another option is to use superscript (sup and /sup) tags for the internal quotations, which produces text that looks like this:

Subject area and disciplines

Subject areas like biology, sociology, engineering, women's studies and psychology are common nouns and don't normally take a capital letter.

^{The University of Ottawa has programs in an array of disciplines, from mathematics and medicine to chemistry and criminology.}

The same applies to broader areas:

^{Professor Doesitall has published extensively in the humanities, pure and applied sciences and arts.}

This approach has the advantage of enabling you to retain italics that may have appeared in the original quotation as distinct italics—although admittedly you could use roman (reverse italics) to serve the same purpose if you adopted J.R.'s all-italic default formatting for internal quotations.

The difference in type size, working in combination with the (regrettably skimpy) extra indentation, makes the internal quotations very easy to recognize. I have used this approach several times in answers of mine that contain embedded quotes within a quotation block.