Should you remove the border on clicked links

Firstly, dotted borders on clicked links are there for a reason – For accessibility and usability. They may not look pretty on your newly designed website but some folk rely on them to get around the web. Therefore only remove if strictly necessary.

Here what they look like:

The selector and declaration you need to insert in your stylesheet is:

*:focus {outline: 0;}

A better way to do is to only use this on certain elements. For example Safari adds an ugly blue box on form text field elements to highlight that you’re in a certain field.

Great on the majority of forms and you should probably think about keeping them but for fields such as your search box then you can add text to this, which will highlight when tabbed on.

So you can remove it from this. To do this include the following in your text field style.:

outline: 0;

Have a go for yourself – first, tab your way around your website and notice how easy it is to know what link you’re currently on. Now, add the focus selector to your stylesheet and try to navigate around your site now… Almost impossible, right? As with anything, web-wise, you have to know when you can and can’t do something and when it will affect your site users.