Etiqueta A | Curso de HTML | Aprende Más

Summary

En este video, se explica el uso de la etiqueta <a> en HTML para crear hipervínculos. Se detalla cómo añadir el atributo 'href' para vincular a URLs y el atributo 'target="_blank"' para abrir los enlaces en una nueva pestaña. También se enseña a navegar entre archivos HTML dentro de una estructura de carpetas, usando rutas relativas. A través de ejemplos prácticos, el video demuestra cómo vincular documentos dentro de una misma carpeta y cómo salir de ella para enlazar con archivos en otros niveles. Se enfatiza la importancia de la práctica para comprender y aplicar correctamente estos conceptos.

Takeaways

• 😀 El <a> es una etiqueta en HTML que se utiliza para definir hipervínculos, conectando páginas o documentos HTML.
• 😀 El atributo principal de la etiqueta <a> es 'href', que define la ruta del enlace o URL destino.
• 😀 Para enlazar a una página externa como Google, se usa la URL completa con el protocolo (https://).
• 😀 Si quieres que el enlace se abra en una nueva pestaña, se debe usar el atributo 'target' con el valor '_blank'.
• 😀 Los enlaces pueden apuntar a otros documentos HTML dentro de un proyecto, utilizando rutas relativas como 'html/us.html'.
• 😀 Es necesario crear archivos HTML válidos y asegurarse de que las rutas y nombres de archivo sean correctos para que los enlaces funcionen.
• 😀 Para enlazar a una página principal desde una subcarpeta, se puede utilizar '../' para salir de la carpeta actual y acceder a otros archivos.
• 😀 Si un enlace no funciona correctamente, puede ser por un problema en la ruta del archivo o si el archivo de destino no existe aún.
• 😀 La estructura de carpetas es importante para determinar cómo se construyen las rutas de los enlaces dentro de un proyecto HTML.
• 😀 La etiqueta <a> también puede utilizarse para enlazar a documentos dentro de la misma página, como se muestra al enlazar con archivos HTML internos.

Q & A

¿Qué hace el atributo 'href' en el tag <a>?

El atributo 'href' especifica la dirección de destino del enlace. Es el enlace que se abrirá cuando el usuario haga clic en el tag <a>.

¿Cómo se configura un enlace para abrirse en una nueva pestaña?

Para abrir un enlace en una nueva pestaña, se utiliza el atributo 'target' con el valor '_blank', como en <a href='URL' target='_blank'>enlace</a>.

¿Qué significa el término 'ruta relativa' en HTML?

Una ruta relativa es un tipo de dirección que se refiere a la ubicación de un archivo en relación con la ubicación actual del archivo que contiene el enlace.

¿Cómo se crea un enlace a una página externa como Google?

Para crear un enlace a una página externa como Google, se debe utilizar el atributo 'href' con la URL completa, por ejemplo: <a href='https://www.google.com'>Ir a Google</a>.

¿Cómo se enlazan dos documentos HTML dentro de la misma carpeta?

Para enlazar dos documentos HTML dentro de la misma carpeta, se utiliza la ruta relativa con el nombre del archivo, por ejemplo: <a href='archivo.html'>Enlace</a>.

¿Qué sucede si no se agrega el atributo 'target' a un enlace?

Si no se agrega el atributo 'target', el enlace se abrirá en la misma pestaña o ventana del navegador, reemplazando la página actual.

¿Cómo se puede salir de una carpeta en una estructura de directorios y enlazar al archivo 'index.html'?

Para salir de una carpeta y enlazar al archivo 'index.html' que está en el directorio superior, se utiliza '../index.html' como ruta.

¿Qué función tiene el directorio 'html' mencionado en el script?

El directorio 'html' se utiliza para almacenar múltiples documentos HTML que pueden ser enlazados entre sí dentro de la misma estructura de carpetas del proyecto.

¿Qué hace el atributo 'target' cuando se utiliza en un enlace?

El atributo 'target' especifica cómo se abrirá el enlace. Si se usa 'target=_blank', el enlace se abrirá en una nueva pestaña del navegador.

¿Qué extensión deben tener los documentos HTML para que el enlace funcione correctamente?

Los documentos HTML deben tener la extensión '.html' para que los enlaces funcionen correctamente, como en 'archivo.html'.