Making links with color and icons from favicon

Recently I came across an interesting JS library for making links in the text. The idea may not be new ... but in general this scheme seems to me interesting and user-friendly.



The bottom line is that the favicon of the site to which it leads is added to the link by the script. Also, different types of links are highlighted in different colors.
')


If more, then links in the text are made out:

• Different color (style), depending on where the link leads ... internal link, link to a subdomain, external, anchor or link to an email address. The user can immediately see where he goes, without pointing to the link.
• Also, depending on the type, an icon is added in front of the link:
  - For internal links and subdomains - pre-set picture. Or the file type icon if the link leads to a file.
  - For external links - favicon icon of the site where the link goes. The link host is favicon, if it is not there - the picture is by default. If favicon is recognizable, then the destination site is immediately clear. For example, search in Yandex or in google
  - For links to a file, the corresponding file icon. There is an array with a set of extensions and their corresponding icons. It works, of course, only with a direct link to the file.
  - For mail links and anchors, too, their own icons.
  

Script
Example

To use it, simply enable the js file on the page:

1. < script type ="text/javascript" src ="http://oopstudios.com/dlink/dlink.js" ></ script >

And add the necessary text to the block with the class “dlink”:

1. < div class = "dlink" >
2. your <a href = "#"> link < / a > text ...
3. </ div >

Styles for links of different types:

1. a.internal {color: # D47700;}
2. a.external {color: # 0074D4;}
3. a.subdomain {color: # D43500;}
4. a.email {color: # 00B235;}

In principle, it is easy to write something similar for yourself or modify this script by adding pictures for different types of links on your site. For example, links to news or user profile.
I thought it was probably easier to do such a thing on the server, but there is a problem that when checking for the presence of a favicon on an external resource, the answer can be quite long. In this regard, the implementation on the client does not cause any problems.