Una página web es un archivo HTML en el que podemos incluir, entre otras cosas, textos formateados a nuestro gusto, imágenes, enviar email, videos, ficheros, … Del mismo modo, un sitio web podrá ser considerado como el conjunto de archivos, principalmente páginas HTML e imágenes, que constituyen el contenido al que el navegante tiene acceso.
Los archivos HTML están debidamente conectados entre ellos y con el exterior de nuestro sitio por medio de enlaces hipertexto. Lo mejor del HTLM es la posibiliad que nos da para relacionar contenidos de los archivos introduciendo referencias bajo forma de enlaces que permitan un acceso rápido a la información deseada. De poco serviría en la red tener páginas aisladas a las que la gente no tiene acceso y no pueda ir de una a otra.
Antes de empezar a crear enlaces, es necesario comprender y dominar el concepto de URL. El acrónimo URL (del inglés Uniform Resource Locator) hace referencia al identificador único de cada recurso disponible en Internet. Las URL son esenciales para crear los enlaces, pero también se utilizan en otros elementos HTML como las imágenes y los formularios.
La URL de un recurso tiene dos objetivos principales:
- Identificar de forma única a ese recurso
- Permitir localizar de forma eficiente ese recurso
En primer lugar, las URL permiten que cada página HTML publicada en Internet tenga un nombre único que permita diferenciarla de las demás. De esta forma es posible crear enlaces que apunten de forma inequívoca a una determinada página.
Veamos con este ejemplo las diferentes partes que forma una URL
https://www.tutorialmonsters.com/category/webmaster/hmtl/
- Protocolo (http://): el mecanismo que debe utilizar el navegador para acceder a ese recurso. Todas las páginas web utilizan http://. Las páginas web seguras (por ejemplo las de los bancos y las de los servicios de email) utilizan https:// (se añade una letra s).
- Servidor (www.turinconenalweb.com): simplificando mucho su explicación, se trata del ordenador en el que se encuentra guardada la página que se quiere acceder. Los navegadores son capaces de obtener la dirección de cada servidor a partir de su nombre.
- Ruta (/category/webmaster/hmtl/): camino que se debe seguir, una vez que se ha llegado al servidor, para localizar el recurso específico que se quiere acceder.
Continuamos con los enlaces:
Un enlace aparece generalmente como un texto azul subrayado y cuando situamos el cursor sobre él se transforma en una mano con el dedo índice extendido. Si pulsamos sobre el enlace saltamos a otra parte del documento, a otro documento situado en cualquier lugar, o incluso se abre el programa de correo para enviar un mensaje a la dirección indicada. En el caso de las imágenes que sirvan de enlace, veremos que están delimitadas por un marco azul por defecto.
Para colocar un enlace, nos serviremos de las etiquetas <a> y </a>. Dentro de la etiqueta de apertura deberemos especificar asimismo el destino del enlace. Este destino será introducido bajo forma de atributo, el cual lleva por nombre href.
La sintaxis general de un enlace es por tanto de la forma:
[html]
<a href="destino">contenido</a>
[/html]
Siendo el contenido un texto o una imagen. Es la parte de la página que se colocará activa y donde deberemos pulsar para acceder al enlace.
Por su parte, destino será una página, un correo electrónico o un archivo.
En función del destino los enlaces son clásicamente agrupados del siguiente modo:
- Enlaces internos: los que se dirigen a otras partes dentro de la misma página.
[html]
<a href="#arriba">Subir</a>
[/html] - Enlaces locales: los que se dirigen a otras páginas del mismo sitio web.
[html]
<a href="mipagina.html#arriba">Subir</a>
[/html] - Enlaces remotos: los dirigidos hacia páginas de otros sitios web.
[html]
<a href="http://www.turinconenlaweb.com/">www.turinconenlaweb.com</a>
[/html] - Enlaces con direcciones de correo: para crear un mensaje de correo dirigido a una dirección.
[html]
<a href="mailto:info@turinconenlaweb.com">info@turinconenlaweb.com</a>
[/html] - Enlaces con archivos: para que los usuarios puedan hacer download de ficheros.
[html]
<a href="fichero.pdf">descargar PDF</a>
[/html]
CONSEJO:
Un consejo para no tener problemas con el nombre de los enlaces es evitar siempre que sea posible, seguro que siempre es posible, en los nombre de los ficheros letras acentuadas (á,é,í,ó,ú, ü,…), caracteres especiales como por ejemplo la ñ, y que muchos servidores trabajan sobre linux y distinguen mayúsculas de minúsculas (no es lo mismo que un fichero se llama mi-primera-pagina.html que lo llame Mi-Primera-Pagina.html. Y por último no dejes espacios en blanco en el nombre de los ficheros, utiliza guiones como he puesto yo hace unas líneas.
