Beyond the
Padlock
New Ideas in
Browser Security UI
Johnathan Nightingale
Human Shield
Mozilla Corporation
johnath@mozilla.com

why are you here?

maybe you’re a
security geek

or a visual designer

maybe you just like
Firefoxes
(Who doesn’t?)

you’re someone who
cares about security UI

you’re someone who
cares about security UI
and how we can make it
better

why am I here?

human
who am i
shield?

usability security
coding

usability security
coding

why do we care?

because the internet is
not a safe place

because the internet is
not a safe place

because the internet is
not a safe place

because the threats are
changing
“Technology such as cloned part-
robot humans used by organised
crime gangs pose the greatest
future challenge to police, along
with online scamming.”
Australian Federal Police (AFP)
Commissioner Mick Keelty

because most existing
UI is sparse...
(A padlock. We’ll come back to this.)

...incomprehensible...

...and maybe not too
carefully designed.
\"Over the kitchen table, she said she could
only remember four figures, so because of
her, four figures became the world
standard,\" he laughs.
John Shepherd-Barron, Inventor of the ATM, on PIN length

because we can do
better

the plan
• Security UI in 5 Easy Steps
• The Padlock: A Cautionary Tale
• Larry: More better?
• Thinking About the Future
• Your turn

five rules for security UI

Be Meaningful
Use clear language and concepts.
Avoid ambiguity.

Be Relevant
Focus on what matters to your
users, not your compiler.

Be Robust
Don’t build user trust around indicators
that can be easily subverted.

Be Available
Don’t disappear when your users need you most.

Be Brave
Sometimes you have to make the call on
your users’ behalf.

Meaningful
Relevant
Robust
Available
Brave
Handy Mnemonic... MRRAB?

applying the rules

the
padlock

it’s ubiquitous
we’ve got one
so does microsoft
safari too
opera has 3 kinds

it’s ubiquitous
we’ve got one
so does microsoft
safari too
opera has 3 kinds

it’s really ubiquitous

it’s really ubiquitous

but is it good UI?

Remember MRRAB
Meaningful - ?

Remember MRRAB
Meaningful - Not really.
Relevant - ?

Remember MRRAB
Meaningful - Not really.
Relevant - Fairly.
Robust - ?

Remember MRRAB
Meaningful - Not really.
Relevant - Fairly.
Robust - Barely.
Available - ?

Remember MRRAB
Meaningful - Not really.
Relevant - Fairly.
Robust - Barely.
Available - Only when you don’t need it.
Brave - ?

Remember MRRAB
Meaningful - Not really.
Relevant - Fairly.
Robust - Barely.
Available - Only when you don’t need it.
Brave - Sure.
C-

doing better
an identity indicator in primary chrome

identity
Let’s stop talking about safety, since we
were never any good at that anyhow.
Let’s talk about what we can know.
It’s valuable, in and of itself, to know
who you’re dealing with online.

EV
There is a new breed of SSL Certificate now
called “Extended Validation.”
The identity information in these certificates is
vetted in a standardized, robust way.
Hooray.
http://www.cabforum.org/

meet larry

in Firefox 3, Larry will
indicate identity
(* Mockups change. Don’t over-report.)

even on non-EV sites,
Larry will be around
(* Mockups change.
Don’t over-report.)

MRRAB?

Meaningful - Identity, period.
Relevant - Knowing identity matters.
Robust - EV Certificates are hard to fake.
Available - Larry is always around.
Brave - Killing the padlock is scary stuff.

A+++!
Meaningful - Identity, period.
Relevant - Knowing identity matters.
Robust - EV Certificates are hard to fake.
Available - Larry is always around.
Brave - Killing the padlock is scary stuff.

B?
Meaningful - Identity, period.
Relevant - Knowing identity matters.
Robust - EV Certificates are hard to fake.
Available - Larry is always around.
Brave - Killing the padlock is scary stuff.

more to think about
Larry vs. padlock is hardly the
only security UI that matters

malware protection

secondary information

security warnings

private browsing

password manager

W3C WSC
Web Security Context Working Group
http://www.w3.org/2006/WSC/
Software Companies
Standards Bodies
Professional Organizations
Certificate Authorities
Academics

recommendations being
considered
Safe Browsing Whitelist
Browser Lock Down
Personally Identifiable Information Bar
Page Security Scoring
Identity Indicator in Primary Chrome ☺

we
also
throw
some
crazier
ideas
around

can we make better use
of past actions?
“You’ve been to this site before”
“Nothing’s changed since the last time
you were here”
“You’re sending a password to a site you’ve
never visited”

how about social networks?
“7 of your Facebook friends have purchased
things from this site”
“Your grandchild who knows computers
says this site is fine.”
“This site has 25 unresolved complaints
according to BBB, and a reseller rating of 6.2”

can we stop phishing
with tech smarts?
Secure Remote Password
Protocol
Let the browser handle
password generation
Watch for credit card numbers
going out on the wire

and don’t forget...
It has to work for internationalization.
It has to work for accessibility.
It has to work for mobile.

bedtime reading
Peter Gutmann
Phishing Tips and Techniques
http://www.cs.auckland.ac.nz/~pgut001/pubs/phishing.pdf
Rachna Dhamija
Why Phishing Works
http://people.deas.harvard.edu/~rachna/papers/
why_phishing_works.pdf
W3C WSC’s Shared Bookmarks
http://www.w3.org/2006/WSC/wiki/SharedBookmarks

your turn

credits
• Security Geek - http://flickr.com/photos/oblivion/351874401/
• Mountain Lion - http://flickr.com/photos/ekai/457004988/
• Red Panda - http://flickr.com/photos/takenzen/184693555
• Phishing/Malware stats - http://apwg.com/reports/apwg_report_may_2007.pdf
• Robot Clones Quote - http://www.theage.com.au/news/national/top-cop-predicts-
robot-crimewave/2007/07/06/1183351416078.html
• Robot - http://www.sxc.hu/photo/502945
• Shepherd-Barron on ATM Pins - http://news.bbc.co.uk/2/hi/business/6230194.stm
• Traffic Tree - http://flickr.com/photos/oobrien/7597395/
• Freddy the Fox - http://flickr.com/photos/roblee/207435086/
• Squity the Goose - http://flickr.com/photos/59547396@N00/63778062
• No Road Markings - http://flickr.com/photos/lwr/498246175/
• Brave Kitten - http://flickr.com/photos/malingering/69853302/
• Passport Agent (Larry) - http://www.aiga.org/content.cfm/symbol-signs
• Footprints - http://www.sxc.hu/photo/573584
• Paper Men - http://www.sxc.hu/photo/431214
• No Fishing - http://www.sxc.hu/photo/791573
• Cell Phone - http://www.sxc.hu/photo/175602
• Microphone - http://www.sxc.hu/photo/793650