Alt text on m.xkcd should not be initially hidden using JS

Need the mods or admins to do something for you? Post here. Read the "About" post first.

Moderators: Magistrates, Prelates, Moderators General

Alt text on m.xkcd should not be initially hidden using JS

Postby marnanel » Fri Feb 24, 2012 9:18 am UTC

On m.xkcd.com, the alt text is hidden and revealed using JavaScript. The text starts out visible, but is immediately hidden when the page loads, using window.onload.

The trouble with this is that on a slow connection (such as the ones you sometimes get with mobile devices!) the page is displayed when only partly rendered. Since the HTML hasn't loaded, window.onload hasn't fired, so the alt-text is still visible. Indeed, since the image probably hasn't loaded either, it's likely to be the only thing visible.

I think the alt text should have style="display:none" set explicitly, to be modified later by the JS.
marnanel
 
Posts: 8
Joined: Wed Jun 06, 2007 12:07 pm UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby Роберт » Fri Feb 24, 2012 5:10 pm UTC

marnanel wrote:On m.xkcd.com, the alt text is hidden and revealed using JavaScript. The text starts out visible, but is immediately hidden when the page loads, using window.onload.

The trouble with this is that on a slow connection (such as the ones you sometimes get with mobile devices!) the page is displayed when only partly rendered. Since the HTML hasn't loaded, window.onload hasn't fired, so the alt-text is still visible. Indeed, since the image probably hasn't loaded either, it's likely to be the only thing visible.

I think the alt text should have style="display:none" set explicitly, to be modified later by the JS.

Another issues is that some people have JavaScript disabled. We would need to think about how the current system works for them (they can see the alt text but it's not hidden) and how the proposed modification would work: (they can see the alt text without viewing source or enabling JS?)
The Great Hippo wrote:[T]he way we treat suspected terrorists genuinely terrifies me.
Роберт
 
Posts: 4301
Joined: Wed May 14, 2008 1:56 am UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby davean » Sat Feb 25, 2012 2:58 am UTC

Yes, many mobile devices don't support JS. I couldn't find any way to make it reliably accessible with a default hidden.

Suggestions welcome.
User avatar
davean
Site Ninja
 
Posts: 2438
Joined: Sat Apr 08, 2006 7:50 am UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby bittyx » Sun Feb 26, 2012 12:30 pm UTC

I'm not sure how supported CSS is with mobile devices, but there's a pure CSS solution for this. Do something like:
Code: Select all
<style type="text/css">

.alt-text {display: none;}

.alt-text-btn:focus + .alt-text,
.alt-text-btn:hover + .alt-text,
.alt-text-btn:active + .alt-text
{ display: block; }

</style>

...

<div class="alt-text-btn">SHOW ALT TEXT</div>
<div class="alt-text">Alt text</div>


or something like that. You get the gist.
bittyx
 
Posts: 181
Joined: Tue Sep 25, 2007 9:10 pm UTC
Location: Belgrade, Serbia

Re: Alt text on m.xkcd should not be initially hidden using

Postby chridd » Sun Feb 26, 2012 8:07 pm UTC

davean wrote:Yes, many mobile devices don't support JS. I couldn't find any way to make it reliably accessible with a default hidden.

Suggestions welcome.
What about using a URL parameter, so m.xkcd.com/123/ (with alt-text hidden without JavaScript) would have a link to, say, m.xkcd.com/123/?alt=true which would always show the alt text?
~ chri d. d.
mittfh wrote:I wish this post was very quotable...
User avatar
chridd
 
Posts: 479
Joined: Tue Aug 19, 2008 10:07 am UTC
Location: ...Earth, I guess?

Re: Alt text on m.xkcd should not be initially hidden using

Postby davean » Mon Feb 27, 2012 12:22 am UTC

bittyx wrote:I'm not sure how supported CSS is with mobile devices, but there's a pure CSS solution for this. Do something like:
Code: Select all
<style type="text/css">

.alt-text {display: none;}

.alt-text-btn:focus + .alt-text,
.alt-text-btn:hover + .alt-text,
.alt-text-btn:active + .alt-text
{ display: block; }

</style>

...

<div class="alt-text-btn">SHOW ALT TEXT</div>
<div class="alt-text">Alt text</div>


or something like that. You get the gist.



Absolutely not at all in the concerned devices?
User avatar
davean
Site Ninja
 
Posts: 2438
Joined: Sat Apr 08, 2006 7:50 am UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby bittyx » Mon Feb 27, 2012 3:34 pm UTC

I dunno, I have a relatively old mobile phone, with an old version of Opera Mobile that doesn't run javascript (or at least not in my experience), but does display pages correctly styled. Hence the idea. But I agree it was a long shot in more than one way. I guess chridd's solution pretty much stomps over my suggestion in terms of compatibility anyway; though if CSS isn't supported at all, like you say, you don't really have a way of hiding it anyway, except for actually not outputting it at all.

Though I have to wonder, which devices have an advanced enough display that you can use it to read xkcd (or other comics) comfortably, while at the same time not supporting javascript, and not having the option to install a javascript-capable browser?
bittyx
 
Posts: 181
Joined: Tue Sep 25, 2007 9:10 pm UTC
Location: Belgrade, Serbia

Re: Alt text on m.xkcd should not be initially hidden using

Postby Red Hal » Tue Feb 28, 2012 9:28 am UTC

chridd wrote:
davean wrote:Yes, many mobile devices don't support JS. I couldn't find any way to make it reliably accessible with a default hidden.

Suggestions welcome.
What about using a URL parameter, so m.xkcd.com/123/ (with alt-text hidden without JavaScript) would have a link to, say, m.xkcd.com/123/?alt=true which would always show the alt text?
Thumbs up for this or a variant of it. To keep transfer sizes down it could be a plain text file accessible at "m.xkcd.com/123/titletext" or similar. It would be clunky, but would provide an almost-guaranteed solution.
Lost Greatest Silent Baby X Y Z. "There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain..."
User avatar
Red Hal
Magically Delicious
 
Posts: 1433
Joined: Wed Nov 28, 2007 2:42 pm UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby davean » Thu Mar 01, 2012 3:14 pm UTC

Red Hal wrote:
chridd wrote:
davean wrote:Yes, many mobile devices don't support JS. I couldn't find any way to make it reliably accessible with a default hidden.

Suggestions welcome.
What about using a URL parameter, so m.xkcd.com/123/ (with alt-text hidden without JavaScript) would have a link to, say, m.xkcd.com/123/?alt=true which would always show the alt text?
Thumbs up for this or a variant of it. To keep transfer sizes down it could be a plain text file accessible at "m.xkcd.com/123/titletext" or similar. It would be clunky, but would provide an almost-guaranteed solution.


We did that initially and people hated the experience - particularly the load lag being five to ten seconds on many devices - too long for people to keep their interest.
User avatar
davean
Site Ninja
 
Posts: 2438
Joined: Sat Apr 08, 2006 7:50 am UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby Red Hal » Fri Mar 02, 2012 2:38 pm UTC

In which case it gets messy. You could try testing for javascript and browser type and deliver the content appropriately with kludgy link to a text file as a last resort/unknown device, but that's extra work for vanishingly little return. If you don't mind my asking, can you give examples of the devices that are having problems?

In the case of a Lynx browser, for example, the problem solves itself as someone visiting the site won't be able to see the image anyway ...
Lost Greatest Silent Baby X Y Z. "There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain..."
User avatar
Red Hal
Magically Delicious
 
Posts: 1433
Joined: Wed Nov 28, 2007 2:42 pm UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby Ubik » Fri Mar 02, 2012 2:55 pm UTC

A possible solution could be to have the alt-text in a noscript element and a piece of JavaScript that does some DOM manipulation to insert an toggleable hidden element with the alt-text in it into the page for those who have JavaScript working. The DOM manipulation part would at least move the duplicated alt-text into the JavaScript portion of the page so that the page as just HTML wouldn't look odd. (The text in noscript element can't be accessed via JavaScript in various browsers, so it can't be just toggled to be visible with JavaScript, also noscript isn't allowed - and doesn't necessarily work either - in head element in current standards so people without JavaScript could have their own CSS rules.)
User avatar
Ubik
 
Posts: 928
Joined: Thu Oct 18, 2007 3:43 pm UTC

Re: Alt text on m.xkcd should not be initially hidden using

Postby davean » Fri Mar 02, 2012 7:14 pm UTC

Ubik wrote:A possible solution could be to have the alt-text in a noscript element and a piece of JavaScript that does some DOM manipulation to insert an toggleable hidden element with the alt-text in it into the page for those who have JavaScript working. The DOM manipulation part would at least move the duplicated alt-text into the JavaScript portion of the page so that the page as just HTML wouldn't look odd. (The text in noscript element can't be accessed via JavaScript in various browsers, so it can't be just toggled to be visible with JavaScript, also noscript isn't allowed - and doesn't necessarily work either - in head element in current standards so people without JavaScript could have their own CSS rules.)


Hum, interesting.
User avatar
davean
Site Ninja
 
Posts: 2438
Joined: Sat Apr 08, 2006 7:50 am UTC


Return to Site/Forum issues

Who is online

Users browsing this forum: No registered users and 1 guest