Sobre enlaces o links (1): lo básico


Vamos a ver todo lo referido a los enlaces o links; cómo crear un enlace simple, una imagen que sirva de enlace, efectos (hover, visited,etc) y otros...Claro que veremos todo esto poco a poco.

Hoy hablaremos de algunas cosas simples pero muy básicas.

► Para crear un enlace (que podremos usar an algún menú, entrada o en la sidebar) deberemos de usar la etiqueta anchor ( <a> </a> ) y el atributo href; bueno dejándonos de tecnisismos, para crear un enlace deberemos de poner lo siguiente:

<a href="URL">EL-NOMBRE-DEL-ENLACE</a>

Ejemplo: Diversas & Variadas

► Esa es la base, usaremos esta "estructura " cada vez que querramos agregar un enlace...¿Y qué pasa si queremos que en vez de texto sea una imagen la que nos sirva de enlace? Es otra pregunta frecuente que me hacen; parece que debería de haber algún "script especial", pero no es así.
Debemos usar la estructura anterior, pero sustituir el texto por una imagen de esta forma:

<a href="URL"><img src="URL-DE-LA-IMAGEN"></a>

Ejemplo:



► Y si queremos que el enlace se abra en una nueva página? Solo agregaremos a nuestra estructura base el atributo target, no importa si el enlace será con texto o con imagen, de la siguiente forma:

<a href="URL" target="_blank">EL-NOMBRE-DEL-ENLACE</a>

Ejemplos en texto e imagen:

Diversas & Variadas



► También, si queremos podemos usar texto e imagen al mismo tiempo en un enlace...Y ya deben de saber cómo hacerlo, pero de todas formas pongo como quedaría la estructura.

<a href="URL">EL-NOMBRE-DEL-ENLACE<img src="URL-DE-LA-IMAGEN"></a>

Diversas & Variadas

► Creo que éso sería todo por hoy, lo básico, hay todavía mucho que hablar sobre los enlaces y muchas formas de personalizarlos. Pero antes de irme, los dejo con la estructura de un enlace a correo electrónico:

<a href="mailto:aquitucorreo@electrónico">EL-NOMBRE-DEL-ENLACE</a>

Ejemplo:

Contacto

8 opinaron:

squirrel

Muy buen post, me gustó mucho y es muy útil

Besos

Responder
Adrián Aratan

Hay mucho que aprender sobre los blogs; la verdad, no sabí como crear un enlace; ahora con este post, aprendí a hacer un enlace :)

Responder
La inquisidora

Agradecerte la visita a mi blog. Muy buen post.

Responder
Jéssica YK

» squirrel: gracias

» Adrián Aratan: me alegra que te haya servido.

» La inquisidora: gracias a ti también por tu visita.

S@lu2

Responder
Micaela

Hola! Quisiera saber como hago para ponerle descripción a los links, cuando pongo el mouse encima del link se vea un texto, x ejemplo sobre una imagen de facebook poner: Búscanos en facebook.
Gracias!

Responder
Jéssica YK

» Micaela:
Para colocar descripción en los links mira esta entrada.

S@lu2

Responder
Micaela

Mil gracias! No sabia como buscarlo, porque no sabia como se llama!!
Sos genial!
Beso enorme!

Responder
Jéssica YK

» Micaela:
Me alegra que la entrada te haya sido útil.

S@lu2

Responder

Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"

Gracias por participar en el blog.

inicio