Just-clicked link colors

August 14, 2012 12:39 AM

Weirdness in the color of just-clicked links on an iPad.

When I click a link on my iPad (iOS 5.1.1, Safari) then hit the back button, I find that the color of the link text has changed from yellow to white. This makes it look like it's just bolded text, not a link. It's only after I refresh the page that the color changes to the lighter yellow of a link that has already been visited.

It happens whether I set my preferences to open links in a new window or not, and I notice that it happens on MeFi, AskMe, MeTa, Music and Podcast, but it doesn't happen on Projects, IRL or Jobs. It also doesn't happen when I use the Plain theme. IRL and Jobs appear to use a similar color scheme to the Plain theme. Projects is the only page that uses the Yellow(link)-White(hover)-Light Yellow(visited) color scheme that does complete the transition to light yellow without a manual refresh.

On several occasions I've clicked a link in a thread, gone back to read more of the thread, then had a really difficult time finding the link again because it didn't look like a link anymore. It's not really a big deal, and I am willing to consider the possibility that it's just me.

posted by Balonious Assault to Bugs at 12:39 AM (29 comments total)

It's not just you - it is a minor annoyance for me as well.
posted by Devils Rancher at 4:35 AM on August 14, 2012

Yep. Same here. I put in the file with "won't play flash": iPad, the Downsides.
posted by likeso at 4:58 AM on August 14, 2012

Huh. iPhone, too, apparently. I never noticed before.
posted by Night_owl at 6:37 AM on August 14, 2012

Yep. Same here. I put in the file with "won't play flash": iPad, the Downsides.

I have that same "won't play flash" file, but I put mine in "iPad, the Upsides" directory.

I turned Flash off on all my desktops as well and I don't miss it at all. My computers run faster, better, and cooler. I'm told if I need to see something that Chrome has Flash baked in, but I never remember this to try it when I think there might be something non-sucky made in Flash.

I'm guessing pb can fix the CSS for the iPad.
posted by cjorgensen at 6:59 AM on August 14, 2012

Huh, I just noticed this for the first time a day or two ago and was very confused, having not knowingly seen it before. I wonder if something changed recently?
posted by phunniemee at 7:06 AM on August 14, 2012

There are three different link colors: not-visited, visited, and active. The active color comes into play when you click on a link: it changes color for the duration of the click. This just gives you a little visual feedback about what you're clicking on.

For whatever reason, taps seem to be fuzzier than clicks and mobile safari doesn't know the duration of your click. So when you start your tap the color changes like it should, but then doesn't change back when your tap is finished.

I just learned about a CSS property called -webkit-tap-highlight-color which might fix this up. I'm guessing we can remove the standard active color and set a tap color to help with this. I'll need to test it a bit and see if that's true.
posted by pb (staff) at 7:11 AM on August 14, 2012

No, I was wrong. The active link color is what's currently under you pointer, not what you just clicked. So as you hover over links, the color changes to let you know that's what you're about to click on. So yeah, hovering is different with a touch device and probably not needed.

I'll try removing the active link color from iOS devices and setting a tap color.
posted by pb (staff) at 7:17 AM on August 14, 2012

Yeah, I've seen quite a few things broken around the web on iPads by the hover state. There's some new hosted forum software package called Huddler that I've seen sites using that require two taps on every link because the first only registers as a hover.
posted by Devils Rancher at 7:37 AM on August 14, 2012

Yeah, I'd always assumed this was the active color getting swapped in for a tap event, Mobile Safari jumping over to a new tab/page, and the old tab/page getting cached as a snapshot complete with that link dressing, so that when you come back without an induced refresh you get that frozen I AM AN ACTIVE LINK! thing going on.
posted by cortex (staff) at 7:51 AM on August 14, 2012

Just to note that the Projects page doesn't appear to have the same issue, in case there is something different in the code there.
posted by Balonious Assault at 7:53 AM on August 14, 2012 [1 favorite]

Pretty sure MetaFilter's colour discrimination is against state, federal and international law. I have a dream: a dream where links are not judged on the colour of their text, but on the content of their contents. A dream where white links, yellow links and light-yellow links play together on a touch-screen, and I play with them. Until a giant finger descends from the clouds and presses me on the head, and then I also change colour. Then, as the massive finger slowly ascends to the firmament, I look up and I think to myself: Man. Do you EVER clean under your fingernails? It is GROSS under there.

And that's what the links must think of us.
posted by the quidnunc kid at 8:13 AM on August 14, 2012

For the record, there are four link colors: "A link becomes active when you click on it. A link is hovered when the mouse moves over it."

This is what happens when I post to MetaTalk before coffee.
posted by pb (staff) at 8:31 AM on August 14, 2012 [2 favorites]

People are starving in Africa.

Starving.
posted by kbanas at 8:35 AM on August 14, 2012

FINE I'LL FINISH MY BEETS
posted by cortex (staff) at 8:36 AM on August 14, 2012

I know you will. For they are Foo.
posted by likeso at 8:42 AM on August 14, 2012

THERE ARE FOUR LINK COLOURS
posted by ODiV at 8:49 AM on August 14, 2012 [2 favorites]

Speaking of mobile site issues, on Chrome in Android 4.1, the site is only displaying the desktop version with no Mobile link presented. I know this setup is a bit of an outlier now, but it was working yesterday.
posted by Burhanistan at 8:53 AM on August 14, 2012

THERE ARE FOUR LINK COLOURS

WEB HAS 4 CORNER SIMULTANEOUS 4-DAY LINK COLOR
posted by quonsar II: smock fishpants and the temple of foon at 9:10 AM on August 14, 2012 [1 favorite]

Burhanistan, have you tried clearing out your MetaFilter cookies? You might have the mobile override cookie set.
posted by pb (staff) at 9:55 AM on August 14, 2012

Oh, crap. Sorry, I had the "Request Desktop site" setting checked. It works like it should now, thanks.
posted by Burhanistan at 9:57 AM on August 14, 2012

Just-clicked links should look better now when you use the back button on iOS devices.
posted by pb (staff) at 1:48 PM on August 14, 2012

Looks great! They're now the visited color for me. Works when set to open links in new tab, too. Thanks!
posted by Devils Rancher at 2:22 PM on August 14, 2012

Looks great here, too, in all circumstances. Thanks!
posted by Balonious Assault at 6:32 PM on August 14, 2012

Site looks nicer now, starving people aside. Thanks!
posted by Blazecock Pileon at 6:55 PM on August 14, 2012

Let me know if pb develops some web code that manages to help feed the starving people in Africa.

That is what you're concerned about, right? That pb make web code that feeds starving people?
posted by hippybear at 9:45 PM on August 14, 2012 [1 favorite]

WEB HAS 4 CORNER SIMULTANEOUS 4-DAY LINK COLOR

AND THE FOUR CORNERS WERE NAMED THUSLY: CYAN MAGENTA YELLOW AND KNUT
posted by a humble nudibranch at 11:54 PM on August 14, 2012 [2 favorites]

knut?
posted by likeso at 4:19 AM on August 15, 2012

See, told you pb could fix it. I have faith! He could probably make Flash work on the iPad as well, but then I would be mad.
posted by cjorgensen at 6:47 AM on August 15, 2012

For the record, there are four link colors: "A link becomes active when you click on it. A link is hovered when the mouse moves over it."

The big problem, of course, is that "hover" is meaningless without a pointer to hover. You need a pointer with a remote interface (like a mouse) so that you know where it is, but with a touch interface, you don't need to know where your finger is -- between vision and proprioception, you already know this.

Basically, there's no pointer, and no way for the device to know where your are about to touch.
posted by eriko at 6:57 AM on August 17, 2012