First link in post footer - very distracting

I’m finding the new styling introduced into the emails for the first footer link very distracting, too distracting from reading the actual post content.

In GMail it’s the 2nd most prominent thing on screen, after the big-ass red compose button:

Introduced here:
https://github.com/discourse/discourse/commit/006bb063717f7bf9439db1d12e5e3b78d3e02f47

##I would like to suggest changing the style…

##From

background-color:#006699;color:#fff;padding:4px 6px;

##To
color: #6E6E6E; padding: 4px 6px; background-color: #F5F5F5; border: 1px solid #dcdcdc; border: 1px solid rgba(0,0,0,0.1); border-radius: 2px;


1 Like

I dunno @DeanMarkTaylor all I feel you did there is normalize it to GMail’s button style, which will depend which mail client one is using, etc.

There’s been some discussion about this in private emails, from people who get paid a lot of money to be UX experts, for whatever that’s worth.

I’ll summarize:

gray is a poor choice for a hyperlink. I actually thought there wasn’t a link to the topic, when this is the most important place for me to go… is this default, or our custom?

“Too noisy” means there isn’t a clear call to action. What is the most important call?

Links in the content don’t need to be bold and link colored. The name doesn’t either. The link to the content, in order to encourage conversation, is the key CTA and as such deserves the strongest visibility.

Why is it bad to make people only look at the simple most important link in the email?

The related change is that it used to read like this:

To respond, visit http://discourse.example.com/t/blah-blah-title

Which is indeed a bigger target, still grey though, but a giant-ass, fully spelled out grey hyperlink. So we changed it to

To respond visit the topic.

I definitely agree that we need to make the primary call to action clear in the email. Particularly since these are responses directly to you, in some form (quoted you, mentioned you, replied to your post), not just random posts we’re alerting you about.

I don’t think it’s that terribly different than this:

What’s the primary call to action there? The email should normalize on Discourse’s button style, not GMail’s button style. Heck if anything we should add the reply arrow glyph, too…

1 Like

I simply picked a style which is within the content area:

  • far more obvious than the grey text - so as you know it’s an action
  • but not so distracting that it makes me personally have a hard time reading the content.

The blue is way too loud.

Try it grey with black text - but for me it needs changing.

1 Like

Its the same age old problem.

I am fine with this blue styling for the first 2 emails I ever get from any Discourse instance in the world. After that the styling suggested by @DeanMarkTaylor is significantly less annoying to me. And I can find the link every time when I look at it.

So the question is… who are we optimising for.

  • The person who get the first response ever from Discourse
  • General users of Discourse that got more than 5 emails.

The correct thing to do here is an A/B test, that is what really was recommended by the UX ninjas.

  • Add a tracking link like ?open_from_email to the end of the “visit the topic”
  • 50% of emails go out in grey styling
  • 50% go out with the blue styling
  • See if there is a significant change in “visiting topic from email” on either.
5 Likes

You are also forgetting those who use mailing list mode, whom have little interest in visiting.

Styling should absolutely be suppressed for mailing list mode users, provided email in is configured

The answer in that case is to vary styling by user trust level, if it’s a fatigue issue based on user experience / volume of emails.

I’m curious why this is “distracting”

But this is “not distracting”

Since that seems rather subjective to me.

I find your other row of buttons also distracting - I don’t see anything like that in emails though.

Context is important.

End-of-post styling on the site is heavily suppressed, its only end-of-topic styling that is loud.

That blue only shows up at end of topic, emails are a per-post thing.

So is the primary call to action… we had a highly paid career UX expert who told us she literally had no idea where to go to respond to a notification email.

That’s very bad. Profoundly bad. Dire, even.

Great - but did she suggest and test a big-ass blue styled button?

Sure, but its unfair, we went from very hard to see to “completely in your face”, from volume 0 to 10 without even stopping at volume 5.

2 Likes

I just don’t agree with either of you, sorry. I think it’s no different visually than the reply button at the bottom of the topic, which is exactly the same call to action. Does that go to “eleven”? Doubtful since it’s been that way for years…

I think a clear call to action in notification emails is hugely important, and visually it’s about the same as the reply to topic button.

Sometimes I think there’s a knee jerk rejection of change. Like the rejection of pink hearts, etc.

I can agree that

  1. Maybe less urgent style for longer term TL2+ users, they presumably know how things work now
  2. Certainly less urgent style for mailing list mode users

Just for full context:

Facebook go with volume 11.

I think LinkedIn do something similar. I personally don’t like it, but will give it a few weeks and see if my brain eventually blocks it out.

1 Like

Stick a button styled to 11 in the bottom of the email after the context posts…
… but right after the new post content hits me hard.

1 Like

I can support turning it down for TL2 and absolutely for mailing list people. These are sensible changes.

But there really is no downside to

  • super MEGA clear call to action in email
  • similar to existing “reply to topic” call to action style we already use

Just ask anyone starting a new Discourse instance what their priorities are with regards to user engagement…

I’d suggest the first link (“visit the topic”) of the last footer be this new style…
… and that any in-between be of lighter grey variety.

Currently it’s the first link of the first footer
… to my mind the call to action should be at the bottom of the email if you have gotten that far.

1 Like

I don’t get emails since I’m here every day. And the button doesn’t bother me at all anyway.

But I do remember the “old days” and believe me, it could be worse.

3 Likes

Hmm, in light of the big blue button, is the text “To respond,” needed at all? Especially if you can not respond via email. By removing it you would align the button to the left which will look a bit more visually pleasing.

(the more I think about it, this is the thing that was really bothering me most, there is a button in the middle of a sentence)

3 Likes

Hi folks,

I’m going to try to avoid a giant lesson on gestalt design nor talk about AB test results. Let’s talk about GOALS and STRATEGIES.

GOAL: Discourse (and their clients) wants people to visit the discussion site and post a smart reply.

DATA:
A person finds the button distracting. Does it interfere with reading? Does it render the message unusable? Is this a common problem? How many people does it affect? Does it affect the business’s ability to thrive?

A person can’t find the link to respond. Does it interfere with reading? Does it render the message unusable? Is this a common problem? How many people does it affect? Does it affect the business’s ability to thrive?

We could stop right now by saying that annoying < conversion.

However, let’s say we want a super elegant product, because Jeff. :slight_smile:

Let’s discuss STRATEGY to make sure the email is both readable and converts.

  1. Change is always distracting. The question is, is the button distracting because it’s new, or is it inherently problematic.

  2. The very best thing to do would be a run a multivariate test with a variety of approaches to the CTA design. As a CEO I knew used to say, “If we are going to argue with opinions, my opinion wins.” Better to use data to make decisions, when possible.

  3. If no data, then look at people you know that do have data. Facebook is a pretty good choice. Amazon has a giant yellow button. Most people place the critical CTA in a large button.

  4. Finally, ask yourself “what else is on the page?” Sometimes pages feel busy and overwhelming because there are too many items competing for our attention. It can help to reduce that visual clutter, and have only one very clear CTA. The original post had bright blue for a link inside the post, and subtle gray for the key CTA. Simply flipping them might have worked. (I say might because I’d prefer data. In lieu of data, though, I’d bet it would work.)

Contrast is what makes things “pop” and get noticed, and thus clicked. So by reducing unimportant link’s contrast, and increasing important links contract, you increase click through.

You can use

  • Color
  • Size
  • Shape (i.e. button)

and more…
Design! It’s what makes people click!

tl;dr make everything except the key CTA bold or underlined gray, and make that CTA Blue, or better yet, a button. But only if you want people to VISIT THE SITE.

4 Likes