
Please don't use a {outline:none;} - utkarshkukreti
http://www.outlinenone.com/
======
oozcitak
I don't think it is good idea to use alternative styling for focus outlines.
People who prefer navigating with their keyboards rely on their browser's
native outline style for feedback. If you really must remove the outline, do
it for hover and active states only, and leave the focus styling to the
browser:

    
    
        a:hover, a:active { outline: none; }  /* Requires IE > 6 */
    

See Patrick Lauke's article for more tests and reading:
<http://people.opera.com/patrickl/experiments/keyboard/test>

~~~
lovskogen
Recommending default outline style is the same as recommending a default blue
link style. A designer will know how to make the focus style match the site
design.

------
pbhogan
Deriving authority for this statement form Eric Meyer is misleading. Eric
didn't say don't use outline: none, he said make sure you have focus styles.

Browser defaults are ugly and inconsistent. Ordering designers everywhere to
not override that is like telling Picasso to paint realistically because some
people find his work inaccessible.

Asking designers nicely to make sure they have elegant focus styles is both
appealing to their ability and sensibility without insulting their creativity.

~~~
jerf
Has the text changed since you posted this? You're all but quoting them in
your first paragraph, except they say it more emphatically.

------
pilif
yesterday I was in the position of having to download the driver software for
the logitech unified remote receiver in order to get my mouse working.

While I had a working keyboard, there was no way to move the mouse cursor.

I was wondering where the focus rectangle had gone and now I know. Very timely
submission indeed.

In the end, I had to temporarily plug another mouse to actually navigate to
the driver download page.

~~~
j_s
Windows Accessibility to the rescue!

Left ALT+left SHIFT+NUM LOCK: Toggles MouseKeys on and off

"Instead of using the mouse, you can use the arrow keys on your keyboard or
the numeric keypad to move the mouse."

[http://www.microsoft.com/enable/training/windowsvista/mousek...](http://www.microsoft.com/enable/training/windowsvista/mousekeys.aspx)

~~~
shubber
Right. "Mousekeys to the rescue." The painful, awkward "got it takes forever
to move the cursor... Ah! Missed!" rescue.

If Mousekeys is the solution, your problem is pretty bad.

------
wahnfrieden
I like this trend of making single-page domain names out of what would just be
a blog post advocating something with clear points and logic. They feel like
they'll have more impact when linking someone to them.

~~~
duck
I know I have seen lots of these, but I can't really remember any of them now.
I can think of <http://two.sentenc.es/>. What are some more examples?

~~~
telemachos
The winner, pehaps, for longest one-word domain name?

<http://dowebsitesneedtolookexactlythesameineverybrowser.com/>

~~~
user24
aw man, I opened this in Fx and Ch, hoping they'd done some html acrobatics
and got it displaying completely differently in each browser but, actually,
their site looks exactly the same in every browser...

~~~
telemachos
I think it's from a while back (it's Dan Cederholm's push to help people get
over that concern).

Also Firefox and Chrome almost certainly aren't _the_ browser people would be
worried about in such a case. Break out a vm and try an older version of IE.

------
StavrosK
This is why I love Opera's shift+arrow navigation. There's a large outline
that's added by Opera regardless of the style, and it's much more visually
intuitive than tabbing along.

~~~
Luyt
If I tap the Control key once, Konqueror will show tooltip letters at the side
of each link on the page; it then enters a mode in which I can press a letter
key to activate that link.

~~~
pornel
Opera has similar feature if you press / and type fragment of link label.

~~~
StavrosK
"/" searches everything, "," searches links. Both very useful.

------
xinsight
I'm sure the author means well, but I doubt this passive approach (where
everyone else has to fix the problem) combined with the irritating, holier-
than-thou tone will get much traction.

A little greasemonkey script to add outline, along with some visual examples
of would be far more effective way to advocate the issue.

~~~
Semiapies
Doing something that inconveniences or irritates people gets you griped at.

A greasemonkey script wouldn't "advocate" anything; its use would be the
(admittedly reasonable) action of someone not waiting for everyone else to get
a clue and do something right.

~~~
falldowngoboom
The browser defaults for outline are ugly, that's why so many people set
outline to none. So, some visual examples that show sexy outline stylings
seems a more reasonable approach.

The author dismisses all aesthetic concerns and loses credibility with the
aesthetically minded people he's trying to convince.

------
arnorhs
That's a pretty poor title for an article.

It's a naive to blame it on the outline property. You can do whatever you want
with the outline, just remember to make it do something else when it receives
focus.

This applies both to input boxes as well as <a> tags.

I have a default styling when I code PSDs into HTML/CSS that makes all a:focus
elements have an opacity of 0.8. It doesn't look as bad and insures that all
<a> elements will have a focus behavior.

------
gkoberger
In theory, HTML5 (in the loose, HTML+CSS+JS sense) should reduce the need for
outline:none. Before, it was necessary because any input using an image (for
rounded corners, box shadows, etc) would look horrible with it.

Now, however, a majority of common input styles can be done using CSS- which
is compatible with the browser's default outlining.

------
jsavimbi
_Usually "design vanity" or total ignorance of accessibility._

That's a pretty ignorant statement intended as fact. When designing and
developing applications with advanced functionality, it is sometimes necessary
to override the outline in favor of the intended user functionality. That is
why you can set outline to zero or none.

Just peruse jQuery and stop being a standards fascist.

