The EFF 1)Electronic Frontier Foundation and the Tor Project 2)Tor Project have developed a very useful add-on for web browsers, called HTTPS Everywhere 3)HTTPS Everywhere on eff.org.
What is HTTPS Everywhere and what does it do?
It is a web browser (Firefox, Chrome, and Opera) extension that encrypts your communications with many major websites, making your browsing more secure 4)Description of HTTPS Everywhere on eff.org. Using HTTPS with websites, your Internet usage is much safer.
HTTPS Everywhere works as follows:
- a user types “HTTP://www.hsbc.co.uk” into their browser address bar
- HTTPS Everywhere automatically checks if it knows of a HTTPS addres for this site (This comes from a list it has verified)
- if there is a secure site available it redirects the users traffic to it
- the users Internet usage is now secure and private
- if there is not a secure site available, then it allows the user to continue to the insecure site
HTTPS Everywhere advanced options: SSL Observatory
HTTPS Everywhere has a “decentralized SSL Observatory”. This detects and warns users about security vulnerabilities, such as fake HTTPS security as the users browses the Web. It is available in the preferences.
Current SSL Observatory interface
Currently the advanced options look like this:
I think these advanced options are slightly confusing, in terms of how the user interface is layed out.
There are two options with explanations:
1. Submit and check certificates signed by non-standard root CAs
2. Submit and check certificates for non-public DNS names
Each have a check box as shown. The current UI shows the explanation outside the boundary of each option.
This can lead to confusion for the user as s/he may not see the association between the explanation and the option.
Suggested SSL Observatory interface
A better way to represent this would be to reverse the order and weight of the option and the explanation, and bound them inside the option box as shown below.
Displaying it like this communicates that the explantion and the checkbox are connected. The explanation is also in smaller font, as it is secondary, the text at the checkbox is the action.
Without the action, the explanation is misleading.
I have also changed the wording of the second explanation to explain the meaning of “secret” – secret in this case means, inside a company, uknown to the public.

I hope that’s helpful. Any feedback, please leave it in the comments.
[Update] I made a mistake: HTTPS Everywhere is configured with a list of verified HTTPS addresses for websites. SC (in the comments) very quickly picked me up on it. Thanks.
> HTTPS Everywhere automatically checks if there is a HTTPS (therefore secure) site available
No, this is not how it works. It is based on user submitted rules. The only thing it checks is its database of known https websites.
Yep, my bad. Changed.
A suggest for your blog if you plan on doing more mockups.
I find it difficult to see the differences between the mockup and actual as they are so far apart.
Consider having some option to mouse over the mockups in future to show the original
I do! That’s how I earn my living, “drawing lines and boxes on a page.” 🙂
Not the first to say it.
Heh, yes that is my intention, and how I normally do mockups. Skitch from Evernote is a nice solution. There is a long and protracted story as to why I didn’t in this case. (involving SSD harddisks, reinstalls, and data cruft)