Site identity UI updates

Stephen Horlander

49

Starting with Firefox 14 beta we are refreshing the site identity UI for desktop.

Goals for this design are:

  • Reduce redundancy in main UI by only having one favicon that lives in the tab
  • Increase security by removing the ability for websites to spoof the favicon
  • (Re) Introduce a consistent encryption indicator
  • Streamline the URL bar and its contents for Australis
  • Have a consistent location for accessing the identity panel
  • Retain the drag target for bookmarks

Note: These changes apply to all platforms

The globe indicates a regular site and serves as a consistent drag target and access point for the identity panel.

For sites with SSL encryption we re-added the lock icon and show “https”.

Sites that have an EV (Extended Validation) Certificate have a green lock icon and include the name of the site owner.

Additional next steps for improving security UI include:

  • A streamlined and more easily readable identity panel
  • Exposing more information about your relationship with the site e.g. how many times have you been there
  • Notifying you if you are submitting sensitive data over unencrypted connections
  • Notifying you if you are submitting data to a site for the first time

 

49 responses

Post a comment

  1. Pseudonymous Coward wrote on :

    How about some UX for telling me, “Hey, you’ve been on this HTTPS site before, but I’ll be damned if the certificate hasn’t changed?”

    Reply

    1. Jennifer Morrow wrote on :

      Actually, we’re working on some solutions to the HTTPS/certification problems now. Thanks!

      Reply

    2. kdjfcgnskghkdfgsd wrote on :

      until they are able to implement something like that there is an extension called certificate patrol that has a similar functionality

      Reply

  2. Henry Story wrote on ::

    Would it be possible to add information showing the user what Identity he was using on that site, in such a way that he could point and click to change identity on the web site? This could merge TLS client certificate and simple cookie identification.

    See the bug report https://bugzilla.mozilla.org/show_bug.cgi?id=396441
    And also the presentation for the w3c Identity in the Browser workshop

    http://bblfish.net/blog/2011/05/25/

    I think there are strong arguments that there are legal requirements for the user to see what identity he is using when going to a web site.

    Reply

  3. Pingback from Firefox 14 Beta promises improved security » on ::

    [...] to give users more control over their browsing experience. The new beta channel release sees the site identity indicator updated to better convey the security of and verify the identify of a web site in the “Awesome [...]

    Reply

  4. S€Th wrote on :

    al usarlo con los temas de firefox no muestra el “mundo” q debería aparecer por defecto, sino una “hoja”, ni en los sitios cifrados. Habra que esperar a que los desarrolladores de los temas los actualicen.

    Reply

  5. Roy wrote on :

    Start supporting TLS 1.1 and TLS 1.2, and telling exactly what protocol is being used at that moment in the info box would be nice to (like: Protocol: TLS 1.2 / Key Exchange: 521 ecdhe / Public key: 383 ecdsa /Symmetric encryption: AES 128 / Hash used: sha256)… this would help more technical people like me to understand if my web sites is being delivered securely, and if other web sites I go to, are really safe or not (at connection level).

    Reply

  6. Pingback from Firefox 14 Beta 8: el navegador de Mozilla cuenta con nueva versión no final on ::

    [...] – La barra de direcciones ahora completa automáticamente las URL escritas – Se mejora el gestor de identidades de sitios, para prevenir el spoofing de conexiones SSL con favicons – Se implementa la API de bloqueo de [...]

    Reply

  7. Abena wrote on ::

    This site is not showing the favicon?? It is a trusted site. I built it!! What can be done to display the favicon

    Thanks in advance.

    Reply

    1. Eric wrote on :

      They mean a trusted secure site that uses https, this is not abous malicious websites etc.
      And which Icon do you want to show the lock?

      Reply

    2. Roger wrote on ::

      What happened to the favicon by the URL in Firefox 14.0?
      All that is there now is a basically useless, B/W globe on any site.
      The favicons still show up in the Bookmarks fine. I have made and installed several favicons and like to see my handywork when on those sites.
      At least give us the option to restore favicons to their rightful place.
      The information that space is supposed to supply, used to work just fine at the bottom of the page. Are you sure this isn’t just change for change sake? As far as I am concerned, this change is a step backward. A loss of information.
      Spoofed favicons? How often does that happen? The site info is in the URL anyway. I think you are reaching here.

      Reply

  8. Pingback from » Firefox 14 Beta promises to jack up web browser security | The midPhase Blog on ::

    [...] suffered a security breach that compromised over 6 million passwords, the new robust version of Firefox browser 14 Beta is a welcome [...]

    Reply

  9. Jaroslav Matura wrote on :

    I really hat…don’t like disappearance of the favicon. People like images, so why remove them?

    Reply

    1. BACON wrote on :

      The favicon is still displayed on the tab itself.

      Reply

      1. r-bin wrote on :

        But if I don’t use the tabs?

        Reply

      2. Paul wrote on ::

        Agree with JM – the favicon is hard to spot (not sure if I’ll “get used to it” or not – but since it is in a different part of the window, and varies, depending on which tab I’m in, I suspect it will not be so obvious – especially in a busy session with many tabs, some of which — including the current one — may well be scrolled off to one side).

        Re Bacon – even if not scrolled to the side, the favicon will not show while any of the page remains unloaded – you just get the spinning “still loading” icon instead.

        Not sure how big a deal this is, but branding types and webmasters won’t like it.

        Still, it’s good to try new things sometimes – even if it turns out the old way was better, or further improvements are needed…

        Reply

  10. crater0083 wrote on :

    I hate the gray icon, this is better:
    http://userstyles.org/styles/59403/firefox-operalike-text-field

    Reply

    1. CrlyWrly wrote on :

      @crater0083 – I agree! – but a lot of bother having to use Stylish add on just to get this simple effect.

      I thought FF was supposed to be good for accessibility then they come out with all this tiny, grey on grey stuff in the UI.

      It’s obviously not a good idea to just provide colour indicators but if you have to use a computer a lot and your eyes are not as young as they once were it really doesn’t help to have things more difficult to notice than they have to be.

      I suppose if this version doesn’t crash or freeze quite so much I’ll forgive them – otherwise I will be hopping back to SeaMonkey and Thunderbird again to see what they are like these days.

      Reply

    2. Mace wrote on :

      I agree. i would recommend not upgrading until you get what you want

      Reply

  11. guanxi wrote on :

    If the favicon is the image of a lock, won’t that confuse users and be a tool for social engineering? I doubt many users would know or remember that a lock in the URL field is secure, but a lock on the tab is not. (I suspect many users pay no attention to either!)

    I thought that was the reason the security UI eliminated the lock icon years ago in favor of the blue/green panels.

    Reply

    1. Larrikin wrote on :

      Seems like changing the color of the awesome bar would have been a much better solution than removing the favicon from a familiar place.

      Reply

  12. Peter wrote on :

    Are you serious with these GREY https urls? Why not green when a site accessed via https ???

    Reply

    1. Simon wrote on :

      I agree, the gray https isn’t a good idea: you have to look closely to see the difference with the non secured connection.. If the difference with EV has to be pointed out, then use blue for security without EV, but not gray.

      Reply

  13. Chuck Anderson wrote on :

    Will there be a configuration parameter or chrome hack that will allow me to get favicons back? I’m guessing not – but holding out hope.

    I’ve never even seen a “spoofed” icon, and FF already has icons that let me know if a site is secure or not.

    I do not and never will use tabs on top, so the favicon on the tab, which may be on the opposite side of the browser window from the location bar icon, is not redundant. With several tabs in the tab bar, which one belongs to the site I am on?

    I think Mozilla should create a separate “browser-for-dummies” version for people that feel they need this kind of hand holding – or like constant change – and let the rest of us have a consistent web browsing tool to use.

    Reply

  14. Ache wrote on :

    Why you guys always do all your design for the light themes only? On any dark Win7 aero theme your globe and lock displayed as gray on gray when the address bar is out of focus. In other words – almost invisible.

    Reply

  15. Johan wrote on :

    I hope this can be disabled? I found it always very convenient to be able to see in the glimpse of an eye whether a site is secure or not. If the difference is now such a microscopic icon, it gets as annoying as it is in IE to discover that the connection is encrypted or that it is not. Some hidden pref maybe?

    This stuff looks like it will only look good on the Mac and maybe some Linux distros, so what am I going to do as a Windows user?

    Reply

  16. koralock wrote on :

    Why did you remove the blue / green box with domain name showed in https connection? That was very nice and simple to use and understand (and click for detail) and unique.

    This looks disgusting, inconspicuous and it looks similar to google chrome ! I dont like it and i dont understand why you imitate it, when you have a better design.

    I hope it will be back without any plugin … (setting in preferences / about:config is acceptable).

    Reply

  17. Mathew wrote on :

    Hi,

    why would u change the old way with the blue info bar in the url telling the user that there is an ssl connection?
    http://support.mozilla.org/en-US/kb/how-do-i-tell-if-my-connection-is-secure

    For a normal user, it is much more obvious, if there is a color change to the blue ssl icon if they visit an ssl site.
    With the new globe to padlock system, nobody will ever notice that there is an ssl connection.
    So why mozilla, this change? It want come to my mind..

    Is there a way to in FF14 to go back to the good old blue ssl info?

    Reply

    1. Chris wrote on :

      I second this.

      Blue bars showing domain and green bars showing company were a nice and established way to easily transport information on ssl status.

      Now w/ favicons nearly gone and just a lock icon or a lock icon and a nearly not to decipher company name on ev ssl certificates, it is one step back.

      And it is a step backwards that is surely not a ui improvement but a deterioration.

      Please bring back the color ssl bars for ssl certificates in blue and ev ssl certificates in green.

      Reply

  18. MITM wrote on :

    How can man-in-the-middle, e.g., proxy, connections be detected? Various proxy devices (Cisco Ironport, for example) return a valid certificate to the browser, but decrypt the SSL traffic for inspection; they then re-encrypt to the target site.

    Reply

  19. BAPR wrote on :

    Better control of sites that use self-signed certificates would be greatly appreciated. I perform a lot of testing on VM’s from multiple vendors and all of them come with self signed certificates out of the box for their web GUI’s. The ability to add an exception is very hit or miss. Due to this I use Chrome because it allows me to acknowledge the issue but then will connect me to the site without issue. It seems that Firefox is attempting to “dumb down” the capability. Perhaps some type of setting in about:config that allows the user to toggle this protection on/off. Most engineers I know have similar problems with self signed certs from OEMs

    Reply

  20. Mark wrote on :

    I agree with some of the posts above: the gray globe and lock are dull, and the standalone lock is a regression from the blue panel for SSL sites. Heck, even Navigator 2.0 had a shiny gold aura around the lock icon for SSL sites!

    Reply

  21. DLX wrote on :

    It was much easier to perceive wether the page was secured or not in FF13. Furthermore the new light blue skin for the header bar is a bad choice. Grayscale would be much more neutral and leave the coloring to the web designers…

    Reply

  22. ws wrote on :

    It sucks. Plain and simple. Favicons have a point, they are not useless. Bring them back please.

    Reply

  23. David Bund wrote on :

    This is exceedingly poor from a useability standpoint. Favicons are missing (except on tabs), and tiny, gray icons replace them, now the sole visual feedback regarding security. You’ve got to be kidding! Fortunately, the Padlock extension still works — at least you didn’t ‘update’ that.

    I’m not a big fan of Chrome but I find myself using it more and more. Why not, if in the main FF is merely going to copy it?

    Reply

  24. Rob Scott wrote on ::

    Firefox 14.0.1 is not displaying iframes – is this related to this?

    Iframes of https pages – work
    Iframes of http pages – don’t work.

    We use similar embed code in our websites to that Google uses for YouTube. YouTube embeds – work; our embeds – don’t work.

    Do we have to change all embed code (and tell all users to change theirs) to https in order for them to work in Firefox 14.0.1?

    Reply

  25. taglife wrote on ::

    Your pictures are Wrong~!!!
    https://www.mozilla.org/en-US/firefox/fx/
    This website does not supply ownership information.
    So it will not have 4 kinds Site Identity~!!!

    Reply

  26. exciting wrote on :

    Cant wait for these changes!

    - A streamlined and more easily readable identity panel
    - Exposing more information about your relationship with the site e.g. how many times have you been there
    - Notifying you if you are submitting sensitive data over unencrypted connections
    - Notifying you if you are submitting data to a site for the first time

    Reply

  27. AmmokK wrote on :

    I want Favicons back!
    And why the symbols changed as well? I liked the old symbols. The new stuff is all so grey & white aka boring!
    Let me decide what i want and don´t just change everything :/

    Reply

  28. Alan wrote on :

    I want my favicons back, and I want the identity info for secure sites.

    Its fine to change things up, but don’t lock the rest of us out of having it the way we liked it too.

    Reply

  29. Barry Buchbinder wrote on :

    For what it’s worth, now that 14 is out, I miss having the favicon in the location bar in addition to having it on the tab. I’d be happy with an option (or addon?) that gives the user the ability to add it back.

    Reply

  30. Peter wrote on :

    Will the grey https url change back to green after the 2012 olympics?

    Reply

  31. Peter wrote on :

    Pls Google (ff employer) change back the annoying grey https URLs to green. This is very misleading. It is easier to manipulate the traffic with ssl strip, MITM etc. Olympic is over, terror threat is over, pls change it back to GREEN! pls pls pls! People won’t change to chrome just because you put these little tricky annoying changes into Firefox browser, but this is very annoying. It’s absolutely no sense! Thank You

    Reply

  32. 依云 wrote on ::

    Hate this ugly useless icon VERY MUCH! I’m trying my best to get my pretty-looking favicons back!

    Reply

  33. Karen wrote on :

    I agree. After some 15-20 years of using browsers I am tired of having to familiarise myself with changes every few months. Give us a break. Will everyone on the internet just stop changing things for the sake of it?

    Reply

  34. Pingback from Google goes private in new Firefox « Nop-arti3319 on ::

    [...] also affects your security. This tweak makes it easier to see the “verified secure”lock icon to the left of your location bar.If you’re using OS X 10.7 Lion, you’ll now get native [...]

    Reply

  35. Pingback from Mozilla Releases Firefox 14.0.1 « Tech Helper on ::

    [...] have a green icon and display the name of the site owner. Mozilla has posted examples in a separate blog post. This version also fixes some known security vulnerabilities in previous version of Firefox. [...]

    Reply

  36. Rene wrote on :

    Please, dear developers, change the color of secured sites (with high encryption standards) back to the color green! The grey lock is only barely visible under many darker configurations (Ubuntu, …) and it is very hard to detect changes in the security status, e.g., when browsing a site or switching tabs. I like to surf the web securely, not always watch out on a small icon whether something has changed. In my opinion, this is a clear setback in both functionality and security of Firefox and, to be honest, I don’t know who initiated this change, but he or she was clearly… let’s say… mislead, to be nice. So, *please*, change the default behavior back! (Or at least give us an option to toggle the behavior.)

    Thank you very much!
    Best regards
    René

    Reply

  37. Funka! wrote on :

    I would love (and certainly miss) the glaring indicator when you are on an HTTPS page that is “partially encrypted” to bring your attention to the matter instead of quietly ignoring this fact. When something like this is broken (broken because the expectation is that a page served over HTTPS should actually be 100% secure) it would be really nice to be made aware of it, instead of quietly not saying anything about it. (And no, in my opinion, the “lack” of something is not saying anything and is hardly brought to anyone’s attention.)
    In fact, there used to be an add-on called Padlock which would bring back this old behavior, but alas, doesn’t work anymore in FF 18 or so onward.

    Reply

Post Your Comment