Ejemplo de Cómo Abrir Una Nueva Ventana Con HTML

Inicio » HTML » Cómo abrir una nueva ventana con HTML

Al trabajar con HTML, a veces necesitamos abrir una nueva ventana o pestaña en el navegador. Este comportamiento es especialmente útil cuando quieres que los usuarios accedan a otra página web, sin necesariamente abandonar la página actual. En este artículo, aprenderás cómo abrir una nueva ventana con HTML.

Los Enlaces en HTML

Para comenzar, es importante recordar que los enlaces en HTML se crean utilizando la etiqueta <a>. Los enlaces son una parte fundamental de la web, ya que permiten a los usuarios navegar entre diferentes páginas y recursos.

La etiqueta <a> tiene un atributo llamado href que especifica el destino del enlace. Este destino puede ser una página web, un archivo para descargar, una dirección de correo electrónico y más.

<a href="https://www.ejemplode.com">Visita nuestro sitio web</a>

Abrir un Enlace en una Nueva Ventana

Para abrir un enlace en una nueva ventana o pestaña, necesitas utilizar el atributo target en la etiqueta <a>. El atributo target puede tener varios valores, pero para abrir un enlace en una nueva ventana, debes utilizar el valor _blank.

<a href="https://www.ejemplode.com" target="_blank">Visita nuestro sitio web</a>

Con este código, cuando hagas clic en el enlace, se abrirá https://www.ejemplode.com en una nueva ventana o pestaña, dependiendo de la configuración de tu navegador.

El Atributo rel en HTML y su Importancia para el SEO

En el mundo del SEO (Search Engine Optimization), es crucial entender cómo los motores de búsqueda interpretan las relaciones entre las páginas web. Aquí es donde entra en juego el atributo rel en HTML.

El atributo rel define la relación que existe entre el recurso actual y el objeto enlazado. En otras palabras, especifica la relación entre la página actual y la página a la que se está enlazando. Este atributo puede ser utilizado con diferentes elementos de HTML, aunque es más comúnmente asociado con la etiqueta <a> y <link>.

En términos de SEO, algunos de los valores más comunes para el atributo rel incluyen nofollow, sponsored, y ugc.

Nofollow

rel="nofollow" es una forma de decirle a los motores de búsqueda que no sigan el enlace. Esto puede ser útil cuando estás enlazando a una página web en la que no confías completamente, o cuando no quieres que tu página pase su "autoridad" a la página enlazada.

Sponsored

rel="sponsored" es una indicación para los motores de búsqueda de que el enlace es parte de una publicidad, un patrocinio o cualquier otra compensación de acuerdos.

UGC

rel="ugc" se utiliza para indicar que el enlace proviene de contenido generado por el usuario. Es especialmente útil en comentarios de blogs o foros donde los usuarios pueden publicar enlaces.

Consideraciones de Seguridad

Es importante mencionar que, por razones de seguridad, se recomienda añadir el atributo rel con el valor noopener noreferrer cuando uses target="_blank". Esto es para prevenir algunos ataques de phishing que pueden suceder al abrir enlaces en una nueva pestaña.

<a href="https://www.ejemplo.com" target="_blank" rel="noopener noreferrer">Visita nuestro sitio web</a>

Con este atributo, estás asegurando que la nueva página no tenga acceso a la página que la abrió mediante el objeto window.opener, previniendo potenciales problemas de seguridad.

Ejemplo de HTML con liga que se abre en una nueva ventana

<!DOCTYPE html>
<html>
<head>
<title>Liga en nueva página</title>
</head>
<body>
<a href="https://www.ejemplo.com" target="_blank">Visita nuestro sitio web</a>
</body>
</html>

¿Cómo citar? & Del Moral, M. (s.f.). Ejemplo de Cómo Abrir Una Nueva Ventana Con HTML.Ejemplo de. Recuperado el 26 de Septiembre de 2023 de https://www.ejemplode.com/17-html/528-ejemplo_de_como_abrir_una_nueva_ventana_con_html.html

Escrito por:
Mauricio del Moral Durán
Mauricio del Moral, fundador y creador de Ejemplo de, es un experto en enseñanza y un apasionado del ámbito educativo desde el año 2007. Ha dedicado una considerable parte de su vida profesional al estudio y al desarrollo de contenidos educativos en formatos digitales de alta calidad. Poseedor de una Licenciatura en Ciencias de la Comunicación, Mauricio es egresado de la prestigiosa Universidad Intercontinental.
Última modificación: 2023-05-15

Últimos 10 comentarios

  1. gracias muchas gracias justo lo ke buscaba i lo encontreeee
    Por Pablo 2009-10-29 a las 14:46:11
  2. Gracias!!! Gracias!!! Gracias!!! Gracias!!! Gracias!!! Gracias!!!
    Por Arely Pedraza 2009-09-29 a las 14:48:29

Deja un comentario


Acepto la política de privacidad.