En modo Diseño, seleccione el texto dentro del objeto del texto en el que desea crear el hipervínculo.
Última actualización el
21 mar. 2022
Conozca cómo crear vínculos a páginas web externas en prototipos de Adobe XD.
Cualquier texto, objeto o componente en el diseño puede vincularse a un sitio web externo o a una dirección de correo electrónico. Después de crear un hipervínculo, puede previsualizarlo y compartir las especificaciones de diseño con otros colaboradores.
Crear un hipervínculo de texto
Para crear un hipervínculo de texto a un sitio web o a una dirección de correo electrónico, realice los siguientes pasos:
En el campo Insertar URL aquí dentro de la sección Texto del Inspector de Propiedades, haga lo siguiente:
Vínculo a un sitio web seguro
Para crear un vínculo a un sitio web seguro (https), escriba la URL del sitio web. Ejemplo: https://www.adobe.com.
Vínculo a una dirección de correo electrónico
Para vincular a una dirección de correo electrónico, escriba mailto: seguido de la dirección de correo electrónico del receptor. Ejemplo: mailto:john@xyz.com.
Una vez que defina un hipervínculo de texto en modo Diseño:
- En el lienzo, el texto con el hipervínculo creado se subraya de forma predeterminada.
- Si solo se ha creado un hipervínculo a una parte del texto, cuando seleccione el objeto del texto en el lienzo, verá un guion (—) en el campo Insertar la URL aquí.
- En modo Prototipo, si se selecciona un objeto de texto que contiene hipervínculos, se mostrarán los hiperenlaces en el Inspector de Propiedades.
- Es posible editar un hipervínculo de texto en el modo Diseño o Prototipo:
Cuando publica y comparte un vínculo de especificaciones de diseño, los colaboradores pueden examinar el hipervínculo.
Crear un hipervínculo de objeto o componente
Para crear un hipervínculo de un objeto o un componentes a un sitio web o a una dirección de correo electrónico, realice los siguientes pasos:
Vínculo a un sitio web seguro
Para crear un vínculo a un sitio web seguro (https), escriba la URL del sitio web. Ejemplo: https://www.adobe.com.
Vínculo a una dirección de correo electrónico
Para vincular a una dirección de correo electrónico, escriba mailto: seguido de la dirección de correo electrónico del receptor. Ejemplo: mailto:john@xyz.com.
Para probar el hipervínculo, haga clic en Vista previa de escritorio.
Cuando haga clic en un hipervínculo, siempre se abrirá en una pestaña separada del navegador.
Cuando publica y comparte un vínculo de especificaciones de diseño, los colaboradores pueden examinar el hipervínculo.
Texto del hipervínculo en modo Diseño y Prototipo:
Además de definir un hipervínculo para el texto en modo Diseño, es posible definir un hipervínculo para su objeto de texto en el modo Prototipo. El hipervínculo definido en el modo Diseño tiene prioridad sobre el hipervínculo en el modo Prototipo. En vista previa del Escritorio o vínculo al prototipo:
- Cuando hace clic en una parte del texto que no tiene hipervínculos definidos, el hipervínculo definido en el modo Prototipo se abre.
- Si crea un hipervínculo en todo el texto dentro del objeto de Diseño, y crea un hipervínculo al objeto del texto en modo Prototipo usando Tocar activador, no funcionará el hipervínculo del modo Prototipo.
Aplicación XD:
- Cuando agrega una URL con un protocolo diferente a https o mailto o sin un protocolo, o si la URL presenta un dominio no válido, recibe una advertencia. Corregir la URL.
Vista previa y vínculo al prototipo:
- Cuando hace clic en un hipervínculo que disponga de un protocolo diferente a https o mailto o no disponga de un protocolo, o si la URL presenta un dominio no válido, la URL no se abre. Recibirá un mensaje de error que le aparecerá en la parte inferior de la pantalla.
- Cuando hace clic en un hipervínculo que dispone de un dominio válido, XD ejecuta una comprobación de seguridad en el sitio web vinculado. Si se produce un error en la comprobación de seguridad, recibe una advertencia de seguridad. Es posible elegir continuar o salir de la URL.
Más información
Vea este vídeo de 3 minutos para obtener más información sobre cómo trabajar con hipervínculos en XD.
Recursos relacionados
¿Tiene alguna pregunta o idea?
¿Tiene alguna pregunta o idea para compartir? Entre y participe en la Comunidad de Adobe XD. ¡Nos gustaría tener noticias suyas y ver sus creaciones!
Diseñar prototipos de experiencia de usuario con Adobe XD
Crea bocetos interactivos para sitios web y aplicaciones móviles.
