1483207 - [UX] "Continue..." button on TLS security error screen can be misleading

Status: RESOLVED FIXED

(Firefox :: Security, defect, P2)

Description

[u580221]

Attachment: uifail.png

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0
Build ID: 20180813220525

Steps to reproduce:

Disclaimer: this ticket is just my subjective opinion of this dialog, others may feel differently. Therefore, maybe it might be useful to do a UI survey or something if you disagree

The "Continue..." button on TLS security error screen is IMHO a major, super frustrating mislabel (see attached screenshot). I've used OpenSSL myself, I know how crypto works, _and my first reaction on this screen is that I don't know what to click to find out what is going on at all_.

"Learn more..." -> first guess, sounds interes-... no, it's a stupid web page with zero info.
"Go back?" -> no, tell me what's going on!
"Continue..." -> certainly NOT, I'm not an idiot, I want to know what's going on first before I go to the page!

Of course, "Continue..." totally doesn't mean that, _but that's what the button text suggests_. The button text should NOT even remotely suggest I'll directly end up on the malicious page, because then even knowledgeable people will be afraid to click and end up super frustrated with the dialog until they finally dare to click it - and this will train users to click buttons that seem to do a bad, mislabeled thing despite their guts, in case others are also so grossly mislabeled.

TL;DR: it's good to make sure the average user doesn't accidentally browse that page. However, "Details..." or something would do just fine, because the actual go to page is then again hidden under tech details and near impossible for anyone to click on accident. Naming it "Continue..." is just a major overshoot that even confuses security-aware people, which IMHO is a really bad thing to do

Steps to reproduce:
1. Visit page with TLS error (invalid cert, ...)


Actual results:

Dialog pops up with no button for infos, except one that _suggests it will open up the malicious page right away_ (which is not what I want to do BEFORE knowing details, obviously)


Expected results:

There is an obvious button to click to see what's actually going on that is NOT suggesting to open up the page right away, leading me into an attacker's hands

Comment 1

[Johann Hofmann [:johannh]]

Thank you for sharing your experience. 

I would say that the "Continue" label tends to confuse experts more than beginners, since the latter would rather move the error out of their way (or escape the site), which is what we're trying to cater for, if I'm not mistaken.

However, we will certainly take this and other feedback and consider whether this label is really the best we can do here.

Comment 2

[u580221]

Ok. It makes sense from someone's perspective who WANTS to visit the site, so I understand where you're coming from. But the UI seems to suggest that is completely married to the intention to see details. However, for a wary person, those are the exact OPPOSITE.

Therefore, I think the UI assumption that a person who wants to see the details is also one that is about to consider visiting the page is the main problem here, and should be removed. The easiest way to do that is with a new, separate "View Details" button, that doesn't require users to go to this click path using "Continue..." which may be exactly what they want to do as you describe, or exactly the opposite as it was for me (in which case this is highly confusing).

Comment 3

[u580221]

Sorry, I worded that horribly. Basically, it works perfectly for pro-active people (who want to consider going there, and then review the implications before taking the final step) but is completely unfitting for wary people (who want to see the details first, before they risk even possibly going there, and therefore might consider "Continue..." intimidating when unfamiliar with the UI).

Comment 4

[Meridel [:meridel]]

Thank you for the feedback. We had quite a bit of discussion about this button copy in designing the new pages. 

I recommend we try "More..." as the new button copy. It's less technical than the original "Advanced" and covers what the user will find in the next screen (more information and ability to take action and add an exception. 

The copy for the "Learn more..." link above the button should actually be "Learn more about website certificates." David, do we need to file a separate issue about this?

If "More..." still confuses people, then we should revert to the original "Advanced..."

Comment 5

[u580221]

I can only speak for myself of course, but that sounds good to me! Way less misleading than "Continue..." for sure.

Comment 6

[Dana Keeler (she/her) (use needinfo) [:keeler] (on leave)]

(In reply to Meridel from comment #4)
...
> The copy for the "Learn more..." link above the button should actually be
> "Learn more about website certificates." David, do we need to file a
> separate issue about this?

I think it probably makes sense to update both at the same time, so we can handle both in this bug.

Comment 7

[Johann Hofmann [:johannh]]

(In reply to Meridel from comment #4)
> Thank you for the feedback. We had quite a bit of discussion about this
> button copy in designing the new pages. 
> 
> I recommend we try "More..." as the new button copy. It's less technical
> than the original "Advanced" and covers what the user will find in the next
> screen (more information and ability to take action and add an exception. 
> 
> The copy for the "Learn more..." link above the button should actually be
> "Learn more about website certificates." David, do we need to file a
> separate issue about this?

This is not as easy since we have several different learn more links and would need different labels for them. Let's file a new bug for this.

Trisha, would you like to update the label to "More..." in this bug?

Comment 8

[Trisha Gupta [:trisha]]

Attachment: bug1480038.patch

Comment 9

[Johann Hofmann [:johannh]]

Comment on attachment 9001930 [details] [diff] [review]
bug1480038.patch

Review of attachment 9001930 [details] [diff] [review]:
-----------------------------------------------------------------

Thanks!

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/e8538f8a0523
Update the 'Continue...' label in new cert-error pages. r=johannh

Comment 11

[Daniel Varga [:dvarga]]

https://hg.mozilla.org/mozilla-central/rev/e8538f8a0523