Enlaces e hipervínculos son los elementos más distintivos de HTML; Por esta razón, éstas fueron la razón del desarrollo del HTML, porque su propósito era vincular información a diferentes fuentes. Un hipervínculo es, de hecho, un campo de documento, y al realizar una acción (como hacer clic en él o colocarlo en el ratón), nos redirecciona a otra área de ese documento u otro documento.
Inicialmente, el hipervínculo es invisible, y lo que vemos son los elementos que incorporamos en el contenido; por ejemplo, texto, imagen, objetos, etc.
<a>
Definición: Este elemento se utiliza para establecer el origen o el propósito del hipervínculo.
Apariencia: Se requieren etiquetas para cerrar y abrir.
Atributos: % attrs, charset, type, name, href, hreflang, rel, rev, accesskey, form, coords, tabindex, onfocus, onblur.
- name: nombre de un ancla o marcador; Ese es precisamente el propósito del vínculo.
- href: para determinar el URI de destino del hipervínculo.
- acceskey: nombra una sola clave para acceder al hipervínculo.
- shape: establece la forma de la imagen del hipervínculo.
- coords: Ajusta donde la imagen aparecerá en la pantalla.
- target: establece el marco de destino (por si acaso, la ventana actual será el marco de destino).
Valores posibles: _blank, _self, _parent, _top.
- tabindex: establece un orden.
Así que se puede incluir en un párrafo, una lista, etc. Además, <a> también puede incluir otros elementos de línea, excepto ellos mismos. El nombre y los atributos href están en contra; es decir, tenemos que originarnos con <a href>, o apuntar con <a name>.
Anclas
Vamos a ver cómo se utilizan los hipervínculos, a través de 3 situaciones: el propósito en la misma página, el propósito en la página de otro servidor y el propósito en otro servidor.
Objetivo en la misma página:
Inserte el marcador en el objetivo: <a name="X"> </a>
Insertar hipervínculo originalmente: <a href="#X">
Traola debe utilizarse como "#", lo que significa que la expresión es un marcador de posición dentro del documento.
Ejemplo:
<body>
<h1>Lenguaje de marcas </h1>
<ul>
<li> <a href="#H"> HTML </a> </li>
<li> <a href="#X"> XHTML </a> </li>
</ul>
<a name="H"></a>
<h2>HTML</h2>
<p>HTML (HyperText Markup Language)
</p>
<a name="X"></a>
<h2>XHTML</h2>
<p>XHTML (Extensible HyperText Markup Language)
</p>
…
</body>
También se puede utilizar como marcador de posición (el elemento de página existente) en lugar de crear un nuevo marcador. En el ejemplo, usamos id.
Por ejemplo: <h2 id = "X"> XHTML </h2>
El resultado es el mismo que el marcador <a name>.
Ejercicio11:
Crea una pagina con dos enlaces (Ejercicio11.html):
Inserta un enlace en la primera lista de módulos creada en un ejercicio9 y otro en la lista de diccionario creada en el anterior ejercicio.
Crear marcadores para todas las definiciones creadas. <a name="X"> </a>
El hipervínculo se creará de la siguiente manera: <a href="Ejercicio11a.html#X">
En este caso no necesitamos marcadores; En su lugar, debemos especificar el URI completo de la página de destino.
Ejemplo:
<ul>
<li> <a href="http://www.w3.org/TR/html401/"> HTML </a> </ li>
<li> <a href="http://www.w3.org/TR/xhtml1/"> XHTML </a> </ li>
<li> <a href="http://www.wapforum.org"> WML </a> </ li>
</ ul>
Estructura completa de URI (Uniform Resource Identifier):
· Protocolo: hay muchos; Por ejemplo: file, ftp, http, https, imap, ldap, mailto, news, snmp, telnet, xmpp, etc.
· Parte jerárquica: dominio, subdominio, carpeta, subcarpeta, recurso, puerto y barra (/) para nivel jerárquico. (Si el puerto es 80, no está indicado)
· Aplicación: $ _GET variables, que se pasan al recurso. (Los PHP se utilizan en sitios web dinámicos o similares)
· Parte: espacio de recursos dentro del documento.
Características de URIs:
· La sección jerárquica y el (sub) dominio no detectan letras mayusculas; por lo que el navegador los convierte en letras minúsculas.
· Las URL (Uniform Resource Locator) tienen las dos primeras partes (protocolo, parte jerárquica), pero no tienen las siguientes partes.
Ejemplos:
ftp://ftp.rediris.es
http://www.w3c.org
http://www.garceta.es/catalogo/area.php?ID_CO=CF&ID_AR=INFCF
http://www.w3.org/TR/REC-html40/struct/links.html#h-12. 1. 1
http://www.example.com/ruta/?pagina=2#final