Blockquote visibility

[musyc]

Title:
Blockquote visibility

Area:
Site scemes

Summary:
Blockquotes are difficult to visually identify in site-scheme pages.

Description:
Currently, site-scheme comment pages display blockquotes with a small indent (15px by my browser). In most instances, this indent is unnoticeable, leading viewers to not even realize that a blockquote exists in the post, especially if they are linked to an entry directly rather than viewing it on their reading page. This can become a problem when posters attempt to quote material from other posters or blogs - the current behavior does not immediately make it obvious the statements were quotes from a different person. (I've been horribly lost in several meta/essay posts until I managed to see the tiny indent.) I'd like to see a much larger indent or some sort of visual identifier (thin border, slightly different color to background?) on blockquotes.

Poll #5018 Blockquote visibility

Open to: Registered Users, detailed results viewable to: All, participants: 55

View Respondents

This suggestion:

View Answers

Should be implemented as-is.
46 (83.6%)

Should be implemented with changes. (please comment)
3 (5.5%)

Shouldn't be implemented.
1 (1.8%)

(I have no opinion)
5 (9.1%)

(Other: please comment)
0 (0.0%)

Comments

[melannen]

I really, really hate blockquotes with borders or different background styles, but a bigger indent (or a ruled line down the left margin) would be nice, yes please!

[fyreharper]

This. Except I'd nix the left-margin line as well, and just go with the bigger indent (I apparently don't read things with blockquotes here, since I'm not sure what the current indent looks like, but I find the quotes-in-boxes thing on other sites aesthetically displeasing/somewhat jarring).

Trying to see what this looks like...

[ninetydegrees]

Musyc said:

Currently, site-scheme comment pages display blockquotes with a small indent (15px by my browser). In most instances, this indent is unnoticeable, leading viewers to not even realize that a blockquote exists in the post, especially if they are linked to an entry directly rather than viewing it on their reading page.

[ninetydegrees]

Yep, bigger indent but no border, please.

[kerravonsen]

+1

[kyrielle]

+1

Re: Trying to see what this looks like...

[sofiaviolet]

In the inbox, this shows with absolutely zero indent. That also needs fixing.

Re: Trying to see what this looks like...

[twisted_times]

I'd like to see a bigger indent; whether that comes with or without a left side vertical bar or not is a matter of personal taste to which I'm rather indifferent.

[faithofone]

I voted "with changes".

I agree that blockquotes are hard to distinguish in their current style, however, I don't think that the suggested ways of styling would be the wisest option.

My preferred course of action would be to remove any custom styling on the blockquote element entirely, so that the browser's default action is restored. I haven't used every browser out there, but all the ones I've used distinguish blockquotes clearly all by themselves.

Alternately, I'd like to suggest something along the lines of what's explained in this article: http://www.monc.se/kitchen/129/rendering-quotes-with-css

[denise]

For cross-browser compatability, we actually strip all styling with a CSS reset before adding it all back, so leaving the browser default in place isn't an option!

[faithofone]

So that Dw looks as close to exactly the same in each browser as it can?

[denise]

Yeah, exactly. There are a lot of various little browser quirks.

[faithofone]

I spend so much of my life trying to fix the stupidity that is the way Internet Explorer renders elements. I've even served different content based upon the user agent, and it is just a nightmare. The idea of just saying "screw it, let me just redo this from the start the way I want!" has never occurred to me. From a designer's approach, I kind of like it.

But as regards to my vote... Then I vote to increase the margin size to somewhere in the 4em to 6em range.

[fu]

If you haven't seen it already, check out Eric Meyer's reset.css

:)

[faithofone]

slick! thanks for the link