En esta segunda clase del segundo modulo de HTML desde cero, vamos a aprender a crear enlaces en nuestra página web. Dichos enlaces los vamos a crear con la etiqueta <a> y que además lleva etiqueta de cierre.
Aunque normalmente, los menos diestros en esto de la navegar por la red, estarán acostumbrados a ver enlaces en forma de texto, podemos verlos en muchos otros casos. También puede ser que un enlace sea una imágen, un párrafo, este colocado en una ventana emergente (pop up) o incluso en un vídeo. Nosotros vamos a ver la forma más básica de crear un enlace.
Vamos a empezar por conocer su sintaxis que es la siguiente:
<p><a href="url o enlace de destino">Ejemplo de texto</a></p>
Como podéis ver, nada complicado y aunque con un elemento <a> podemos hacer muchas otras cosas, las veremos más adelante ya que no vamos a necesitarlas por el momento. Soporta el atributo
href que además es imprescindible para su correcto funcionamiento. El atributo href contiene la url que enlaza al sitio que nosotros indiquemos.Sabiendo todo esto, vamos a jugar con la etiqueta <a>, a través de unos ejemplos que os van a ayudar a entender mejor todo esto.
Crear un enlace a una página de tu sitio web
El atributo
href sige los mismos principios de referencia que hemos aprendido en la clase Insertar imágenes en nuestra página web. Si ambos archivos se encuentran en la misma ubicación, simplemente se pone el nombre del archivo<p><a href="contacto.html">Página de contacto</a></p>
Crear un enlace a una página externa
La url siempre debe ser exacta incluyendo el protocolo
http:// o https://.<p><a href="http://www.rafabasa.com/">Rafa Basa</a><p>
Ejemplo hacer que una imágen sea un enlace
Ya que este sistema es muy utilizado y esta muy extendido vamos a ver como crear un enlace que sea una imagen.
<a href="https://www.blancapalomatriana.es"><img src="images/restaurante.jpg" alt="Texto descriptivo"></a>
Conclusiones
No he colgado ninguna imagen de como se vería el enlace, copiad alguno de los códigos en vuestro Sublime Tex y abrid el archivo .html en el navegador. Esto os servirá de practica y veréis como se muestra un enlace con los estilos por defecto que le asignan los diferentes navegadores. Hemos aprendido a crear enlaces en nuestra web con unos sencillos ejemplos y esta clase nos va a servir de puente para la siguiente que será algo más compleja.
Nada más por ahora y os recuerdo que justo debajo, tenéis el listado de las clases que llevamos hasta la fecha. Me gustaría que compartieses esta publicación con tus amigos, nos regales un me gusta en la página de Facebook y si te apetece únete a la comunidad de Facebook.
0 Comentarios