Enlace

La etiqueta <a> se utiliza para crear hipervínculos que permiten a los usuarios navegar entre diferentes páginas web. Cuando un usuario hace clic en un enlace, el navegador envía una solicitud al servidor para la página asociada con el enlace y muestra la respuesta en la pantalla. El atributo href ayuda a especificar la URL de la página de destino.

Atributos de enlace

target

De forma predeterminada, el enlace se abre en la misma pestaña del navegador. El atributo target permite modificar este comportamiento. Para abrir un enlace en una nueva pestaña, utiliza target="_blank".

download

El atributo download puede utilizarse con la etiqueta HTML <a> para indicar que el recurso de destino debe descargarse en lugar de mostrarse en el navegador. Cuando se usa el atributo download, el navegador solicita al usuario guardar el archivo con el nombre de archivo especificado. Por ejemplo, si necesitas crear un elemento con la siguiente funcionalidad: cuando el usuario haga clic en el enlace, el navegador descargará el archivo "myfile.pdf" desde https://example.com/ y solicitará al usuario guardarlo con el nombre myfile.pdf.

href

El atributo href se utiliza no solo para navegar a otras páginas, sino también para crear enlaces a direcciones de correo electrónico, números de teléfono y secciones específicas.

Además, el atributo href puede utilizarse para navegar a secciones específicas dentro de una página web. Para crear una etiqueta de anclaje, asigne un atributo id (un identificador único) a la sección deseada a la que queremos desplazarnos. El atributo href toma un valor que comienza con el símbolo # seguido del valor del id.

Exploremos el siguiente ejemplo, presentado en forma de CodeSandbox. Esta plataforma permite inspeccionar el código y examinar la funcionalidad del mismo.

Nota

Tómese un momento para inspeccionar la funcionalidad haciendo clic en los enlaces y observando cómo la página en vivo se desplaza a las secciones específicas. Además, preste atención a los atributos de la etiqueta a y la etiqueta h2.

Para ver el código, deslice el control deslizante en el lado izquierdo del CodeSandbox. Esto revelará el código existente dentro del editor.

Botón

La etiqueta <button> en HTML se utiliza para crear un botón clickeable que puede desencadenar una acción, como enviar un formulario, ejecutar una función de JavaScript como abrir y cerrar una ventana emergente, o alternar un menú móvil. Por defecto, el <button> tiene el atributo type, y su valor es submit. Sin embargo, a menudo es necesario especificar type="button".

Resumen

La etiqueta <a> se utiliza para crear hipervínculos a otras páginas web, documentos o recursos. En cambio, la etiqueta <button> se emplea para generar interactividad en una página web, activar un evento o realizar una acción. Es fundamental no confundir sus propósitos.