Dlink, personaliza tus enlaces con mini-iconos de forma automática

A través de un pequeño fichero Javascript podremos personalizar el aspecto de los enlaces de nuestra página web o blog  añadiendo un pequeño icono que los identifique como enlaces externos, internos, e-mail, punto de ancla, fichero de audio o video, flash, etc. Los iconos son imágenes .PNG sin fondo, de forma que podremos usarlos en cualquier sitio sin importar el color o background.

Para utilizarlo, podremos importar el javascript directamente desde la web del autor, por lo que siempre lo tendremos actualizado, aunque yo prefiero descargarlo y subirlo a mi FTP (por motivos de seguridad). Basta con asignar la clase class=”dlink” a cualquier contenedor (div, p, table, etc) de nuestra web donde queremos que los enlaces se vean afectados por los nuevos estilos. En caso de que no deseemos aplicar el estilo a algún enlace, tendremos que asignarle  la clase class=”no_dlink”.

Dlink, personaliza tus enlaces con mini-iconos automáticamente

Automáticamente, el script detectará qué tipo de enlace es: externo, interno, dirección de correo, punto de ancla, un tipo de archivo determinado, etc., y seleccionará el icono que le corresponda. Por ejemplo, si es un enlace interno, aprovechará el favicon de nuestra web en caso de que lo tengamos, si no, utilizará un icono de la Tierra; para los enlaces de punto de ancla, obviamente, el icono es un ancla.

En caso de que decidamos descargar el javascript y subirlo a nuestro FTP, tendremos que bajarnos también los iconos y subirlos a una carpeta llamda ../gfx o bien modificar el código y cambiar las rutas relativas a absolutas que apunten a la web del autor.

Esta utilidad podríamos desarrollarla fácilmente con jQuery, sin embargo, el script Dlink ocupa menos de 1kb y no necesita importar ninguna libreria javascript.

Más info | http://oopstudios.com/dlink/index.html
Fuente | http://www.visual-blast.com

Etiquetas:

Suscríbete a nuestro Feed para recibir las últimas novedades de diseño web, diseño gráfico y programación

1 Comentario hasta el momento »

  1. 5 formas sencillas de mejorar el aspecto de los links - The n4gash, Blog sobre Diseño gráfico y web, programación, internet, posicionamiento web y SEO dijo

    22 de Enero del 2009 a las 21:56

    […] mí, las más interesantes son las de incluir un pequeño icono junto al enlace con CSS (en la Wikipedia lo usan y lo cierto es que es muy descriptivo) y el que ya he comentado de […]

Comentarios RSS · TrackBack URI

Dejanos tu Comentario

Nombre: (Requerido)

E-Mail: (Requerido)

Sitio WEB:

Comentario:

What is 12 + 8 ?
Please leave these two fields as-is: