DISEÑO
WEB
III-Informática – Lic. Olvin García
Enlaces o
hipervícunlos en html
La incorporación del hipertexto en el lenguaje HTML permitió crear
documentos interactivos, estos proporcionan información adicional
cuando se solicita. El elemento principal del hipertexto es el
“hiperenlace”, también llamado “enlace web” o simplemente
“enlace”. Los enlaces se utilizan para establecer relaciones entre
dos recursos (páginas web, imágenes, documentos, archivos, etc.)
Etiqueta para enlaces o hipervínculos
<a href=“Dirección de la página o archivo”>Nombre del enlace</a>
La etiqueta <a> que significa ancla, es la que permite el uso de
enlaces.
El atributo href permite colocar la ubicación del archivo o de la página
web.
Dentro de la etiqueta <a></a> irá el nombre que queramos ponerle al
hipervínculo o enlace.
Tipos de enlaces o
hipervínculos
Definición Ejemplo
Enlaces Absolutos Son enlaces que están escritos de <a href:”[Link]
forma completa, permite localizar
la ubicación del archivo o de la
página de mejor forma.
Enlaces relativos Son enlaces que prescinden u <a href:”practicas/practica#[Link]”>Hola Mundo</a>
omiten alguna parte de su
dirección para hacerlo más breve
Enlaces internos Son enlaces que permiten <a name:”Datos Personales”>Datos</a>
acceder a partes de la página
dentro de la misma página web.
O
<a href:”#DatosPersonales”>Datos</a>
Enlaces externos Son enlaces que permiten <a href:”[Link]
acceder a otras páginas web que
se encuentran en otros sitios o
ubicaciones.
Atributos de la etiqueta
a)Download
<a></a>
Este atributo, indica descargar a los navegadores una URL en lugar de
navegar hacia ella, por lo que el usuario será dirigido para salvarla como
un archivo local. Si el atributo tiene un valor, éste se utilizará como
nombre de archivo por defecto en el mensaje Guardar que se abre
cuando el usuario hace clic en el enlace (sin embargo, el usuario puede
cambiar el nombre antes de guardar el archivo). No hay restricciones
sobre los valores permitidos, aunque: / y: \ se convertirán en guiones
bajos (underscores), lo que evitará sugerencias de ruta específicas. Se
debe tener en cuenta que la mayoría de los sistemas de archivos tienen
limitaciones con respecto a los símbolos de puntuación admitidos en los
nombres de archivo, por lo que los navegadores ajustarán los nombres de
los archivos en consecuencia.
Atributos de la etiqueta
<a></a>
b) href
Contiene una URL o un fragmento de URL al cual apunta el enlace. Un
fragmento de URL es un nombre ("name") precedido por el símbolo de
número (#), el cual especifíca una ubicación interna objetivo (un ID (en-
US) de un elemento HTML) dentro del actual documento. Las URLs no
están restringidas sólo a documentos de internet basados en HTTP, sin
embargo pueden utilizar cualquier protocolo soportado por el navegador.
Por ejemplo, file:, ftp:, and mailto: funcionan en la mayoría de los
navegadores.
Atributos de la etiqueta
<a></a>
c) hreflang
Este atributo indica el lenguaje humano del recurso al que se enlaza. Este es
únicamente informativo, sin ninguna funcionalidad incorporada. Los
valores permitidos están determinados por la norma de lenguaje
internacional BCP47.
Atributos de la etiqueta
d) target <a></a>
Especifica en donde desplegar la URL enlazada. Es un nombre (name of), o
palabra clave (keyword for), un contexto de navegación (browsing
context): una pestaña, ventana, o <iframe>. Las siguientes palabras
clave (keywords) tienen significado especial:
_self: Carga la URL en el mismo contexto de navegación que el actual. Este
es el comportamiento por defecto.
_blank: Carga la URL en un nuevo contexto de navegación. Usualmente es
una pestaña, sin embargo, los usuarios pueden configurar los
navegadores para utilizar una ventana nueva en lugar de la pestaña.
_parent: Carga la URL en el contexto de navegación padre (parent) del
actual. Si no existe el padre, este se comporta del mismo modo que _self.
_top: Carga la URL en el contexto más alto de navegación (el cual es un
ancestro del actual, y no tiene padre (parent)). Si no hay padre (parent),
este se comporta del mismo modo que _self.
Atributos de la etiqueta
<a></a>
e) type
Especifica el tipo de medio (media type) en la forma de MIME type (en-US)
para la URL enlazada. Esto es únicamente informativo, sin ninguna
funcionalidad incorporada.
Tarea-Diseño
Web I
● Investigar el funcionamiento las hojas de estilos en cascadas o CSS.
● La investigación debe incluir:
Los atributos más utilizados en CSS.(Mostrar ejemplos del uso de cada
atributo)
Qué son los selectores y los tipos de selectores que existen.(Mostrar
ejemplos del uso de cada selector)
Métodos de como relacionar HTML y CSS.(Mostrar ejemplos de cómo se
realiza la relación)
• Realizar el trabajo a mano o en computadora, en hojas blancas, con
portada, sin errores ortográficos.
• Fecha de entrega: miércoles 8 de mayo del 2024
• Valor: 25%
