root navigation content

Delavy for the Web

Bilingual thinking to improve the Web

Version FrançaiseEnglish Version

A cursor for differentiate external links

vendredi 10 juillet 2009 [19:45:24]

exemple of cursor on a normal and external link

Here is a cursor to differentiate externals links of a website : clearest than a different layout, more visual than a precision in the title and less bulky than an icon next to.

Cet article existe aussi en version française.

To select the external links, no need to add rel="external". Lachlan Hunt propose a tip who work with all modern browsers. I separate it in 2 part to obtain a valid code.

I select links starting with http:// or https, and I put the cursor. Then, I rescind the rule if the link starts with the address of my personal site.

a[href^="https://"],
a[href^="http://"]{
	cursor:url("external.cur"), default;
}
a[href^="http://delavy.hyperficiel.com"]{
	cursor:pointer;
}

Here is the cursor in png (5ko), and the psd file (26ko) for those who want modify it. I don't know the license for the cursors, so I put my creation in public domain

Texts, pictures, and design : Copyright © 2008 - 2009 Delaby Pierre.
Copyleft : This is a free work, you can copy, distribute, and modify it under the terms of the Free Art License. You find a copy of this license on the site www.artlibre.org and other sites.
Icons by Mark James in Creative Commons | All Credits and Attributions.

Logz Powered : http://www.logz.org | Host by Provisoire.fr | Copyleft Licence Art Libre | Vrs ?, Vxl ? | site map