magibrain: A radiation symbol. It appears to be a little bit on fire. (Default)
magibrain ([personal profile] magibrain) wrote in [site community profile] dw_suggestions2011-12-29 03:54 pm

Spoiler DW-tag

Title:
Spoiler DW-tag

Area:
DW custom tags

Summary:
Add a tag to easily add spoilertext to a post.

Description:
I suggest a [spoiler][/spoiler] tag which would automatically generate spoilertext (often black text on a black background, so that a user can choose to highlight it to read it), with a hidden-from-screen-display but screen-reader-accessible (possibly using WebAIM's hidden content trick - http://webaim.org/techniques/css/invisiblecontent/ ) link to skip the spoilered content. The rough format I've been using in my posts is this (brackets flattened because preview didn't like < and > codes):

[a href="#skip_spoiler_1" style="width:1px; height:1px; position:absolute; left:-10000px;"]skip spoiler[/a][span style="color:#000; background-color:#000;"]SPOILERS SPOILERS SPOILERS[/blockquote][a name="skip_spoiler_1" /]

It seems that the following code:

[spoiler]SPOILERS SPOILERS SPOILERS[/spoiler]

would be much cleaner, and guarantee accessibility for people using spoilertext who might not otherwise consider screenreaders.

As for drawbacks... I'm not sure how many people actually use spoilertext on a regular basis, I don't know if color choice would be controversial, I'm not entirely happy with the disparallel between functionality for sighted and screenreader-using folk (where people reading visually have to take action to see the spoilered content, but people using a screenreader have to take action to *avoid* being spoilered), the outputted HTML is still a little bloated, the trick to not display the skip link is a kludge (because screenreaders have erratic handling of both visibility:hidden and display:none), and I imagine it would get extremely ugly if used on a large patch of text. But it'd be cool to hear discussion on any/all points. :)

Poll #9002 Spoiler DW-tag
Open to: Registered Users, detailed results viewable to: All, participants: 101


This suggestion:

View Answers

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

Should be implemented with changes. (please comment)
22 (21.8%)

Shouldn't be implemented.
10 (9.9%)

(I have no opinion)
22 (21.8%)

(Other: please comment)
1 (1.0%)

cheyinka: An image of a Metroid from the NES game Metroid (NES Metroid)

[personal profile] cheyinka 2012-01-06 08:05 pm (UTC)(link)
"Cuts don't stay cut when the entry page is opened" is expected behavior for me as well as being what I want to happen, and I don't think that should be a problem that Dreamwidth fixes, because I don't think it's a problem and fixing it would cause me problems.

If the problem is "we need spoiler tags that are both accessible and easily invoked", I think it's better to have a new tag; it could work exactly like a cut tag, except that going directly to an entry page wouldn't unfold the spoiler tags, and spoiler tags could be used in comments. (Or it could be totally unrelated to how cut tags work, but I like the idea of being able to hide images as well as text, and a repurposed and renamed cut tag could do just that.)
green_knight: (Bee)

[personal profile] green_knight 2012-01-07 01:17 pm (UTC)(link)
I'd prefer it to extend the cut tag behaviour, for the simple reason that I'm crossposting to LJ, and accidentally leaving content completely uncut would not be a great idea.

I like the idea of adding an 'autoexpand' flag to cut texts, because I often make posts where I ask people about their immediate reactions to something - and then add my own reaction in a separate post, so it won't influence their reaction. Being able to do that in one post - with cuts that stay closed even on the posts's page - would be awesome.

Hm. 'autoexpand=none' for cut tags that stay cut, 'autoexpand=rlist' for cuts that get closed on the reading list and expanded in posts (standard behaviour), 'autoexpand=all' for content that I want people to see on their first encounter, but which is long enough they might wish to hide it? (I sometimes choose not to use cut tags because I want to make it harder to skip posts. So sue me.)
cheyinka: A glowing blue sheep with green eyes (electric sheep)

[personal profile] cheyinka 2012-01-07 10:12 pm (UTC)(link)
Well, if it gets a new name, like <mask text="fishcakes">, the crossposter could be smart enough to convert both <cut> and <mask> to <lj-cut>.