Creando enlaces

En este capítulo aprenderemos a crear enlaces o los también llamados links, estos son muy fáciles de crear, no nos tomara mucho tiempo así que a darle duro.

La etiqueta a usar cuando hablamos de enlaces es :

<a> </a>

Para acostumbrarnos a los códigos vamos a hacer todo desde la pestaña CÓDIGO claro esta que se nos haría mas fácil hacerlo desde la pestaña DISEÑO pero no aprenderíamos nada de html así que no hagan berrinche je.

Nos ubicamos después de el código de nuestra imagen y cambiamos de reglón ya saben que se hace como la etiqueta , luego en otra línea ponemos el siguiente texto: " página creada con ayuda de Axside."

Como son buenos chicos me enlazaran a mi verdad, así que editamos esa oración para poner un enlace en “Axside”, el código seria así:

página creada con ayuda de <a href="http://www.axside.com">axside</a>

Como vemos la etiqueta <a va seguida de el código href=””, dentro de las comillas la dirección a direccionar, fácil no? Que si? Jaa ahora te complico mas… Como hacer ahora para cuando la persona le de click a tu link aparezca la nueva dirección en otra ventana y no en la misma de donde le dieron click. Eso se logra poniendo dentro de nuestra etiqueta de enlace esto: target=”_blank”. Pero ese no es el único target posible acá les dejo 3 mas que pueden probar y reemplazar a su gusto.

"_blank" = Muestra la dirección en una nueva página
"_parent" = Muestra la dirección en la página que lo invocó.
"_self" = Muestra la dirección en la misma ventana. (por omisión)
"_top" = Muestra la dirección en la ventana actual usando todo el espacio.

Echo esto vamos a la pestaña Diseño y vemos que el texto donde pusimos el link ah cambiado y hasta esta subrayado ohhhhhhh!! el modo de cómo se ven los link se pueden modificar y de echo que los modificaremos en unos temas después, le damos a F12 para ver como esta quedando en nuestro navegador, como verán al darle click al link nos direcciona a la página principal de Axside.

Echo esto ahora vamos a ponerle un link a nuestra imagen, los pasos son relativamente los mismos, muy sencillo, apto para todas las edades jeje, en la pestaña Diseño señalamos a nuestra imagen y vamos inmediatamente a la pestaña código y vemos que todo el código referente a nuestra imagen esta señalado también, perfecto ahora solo tenemos que encerrar a ese código entre la etiqueta de enlaces <a> y </a>, vamos se que pueden..
Si todo les fue bien se que pusieron el código así:

Como ven el código de nuestra imagen esta encerrado entre nuestra etiqueta a y href=”” nos dice a donde nos dirigirá el link.

Nuestro código Final nos quedo así:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
</head>

<body>
“Este es el primer texto de nuestra página!!” 
Segundo parrafo, pueden poner lo que ustedes quieran 
Wow tanto codigo, aprendiendo ahora a cambiar de linea.. 
Y wualaaa ya esta! 
 
<a href="www.axside.com" ><img src="imagenes/objeto1.jpg" alt="texto alternativo" width="150" height="150" border="0" longdesc="Descripción larga"></a> 
página creada con ayuda de <a href="http://www.axside.com" target="_blank">Axside</a>
</body>
</html>

Pero ahora si prepárense que el próximo tema hablamos de Estilos css que es lo mejor de lo mejor en la creación de páginas web, vamos!

<<<<< Anterior Siguiente >>>>>