Usar el elemento Web de Heroes

Ofrece el foco y el interés visual para tu página con el elemento Web del héroe. Puede mostrar hasta cinco elementos en el elemento Web de Hero y usar imágenes atractivas, texto y vínculos para llamar la atención sobre cada uno. El elemento web Imagen prominente se incluye de forma predeterminada en sitios de comunicación, pero también se puede agregar el elemento web Imagen prominente a otras páginas.

Notas: 

  • Algunas funcionalidades se introducen gradualmente en organizaciones que han optado por el programa de versión dirigido. Esto significa que es posible que todavía no pueda ver esta característica o que la vea con un aspecto diferente a como se describe en los artículos de ayuda.

  • Debe tener permisos de edición para crear páginas. Si es propietario pero no puede Agregar una página, es posible que el administrador haya desactivado la posibilidad de hacerlo.

Contenido

El elemento Web de Hero en sitios de comunicación: tema y escaparate

Al crear un sitio de comunicación, el elemento Web de Hero se incluye de forma predeterminada en la página. Se ha rellenado con imágenes, texto y vínculos predeterminados para mostrar sus propias imágenes, texto, páginas, vínculos o documentos.

Cuando selecciona un tema para el tipo de sitio de comunicación que desea, el héroe predeterminado es un diseño en mosaico con cinco mosaicos (que puede cambiar de uno a cinco):

Elemento Web de Hero en un sitio de comunicación

Cuando selecciona escaparate para el tipo de sitio de comunicación que desea, el héroe predeterminado es un diseño vertical con tres capas (que puede cambiar de una a cinco capas):

Imagen de Showcase

Puede cambiar el diseño del elemento Web de la imagen principal de una cuadrícula a una vertical mediante el botón Editar elemento web Botón de edición del elemento Web y puede cambiar los vínculos, las imágenes y el texto de cada mosaico o capa con el botón editar detalles Editar detalles de cada mosaico o capa.

Botones de edición de Heroes

1. botón Editar elemento Web

2. botón Editar detalles

Cambiar el diseño del elemento Web de Hero

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Su explorador no admite vídeo. Instale Microsoft Silverlight, Adobe Flash Player o Internet Explorer 9.
  1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior derecha de la página.

  2. Haga clic en el botón Editar elemento web Botón de edición del elemento Web a la izquierda y seleccione el tipo de diseño que desee: puede seleccionar hasta 5 mosaicos (como el de un sitio de temas) o hasta 5 capas (como en un sitio de Showcase).

    Opciones de diseño de héroe Opciones de diseño de héroe

Cambiar la imagen, el texto y los vínculos de cada mosaico o capa

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Su explorador no admite vídeo. Instale Microsoft Silverlight, Adobe Flash Player o Internet Explorer 9.
  1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior derecha de la página.

  2. Haga clic en editar detalles Editar detalles en la parte inferior derecha del mosaico o la capa que desee cambiar.

  3. En el cuadro de herramientas, haga clic en cambiary, a continuación, elija una ubicación desde la que obtener el vínculo:

    Imagen de las opciones del selector de archivos.
    • Recientes: Si ha abierto recientemente imágenes, páginas o documentos, los encontrará en la lista.

    • Búsqueda web: puede buscar imágenes de Bing que usen la licencia creativa común. Usted es el responsable de revisar las licencias de una imagen antes de insertarla en la página. SharePoint Online.

    • Su organización: Si su organización ha especificado un conjunto de activos aprobados, podrá elegir entre los que figuran aquí.  Si es un administrador de SharePoint y desea obtener información sobre cómo crear una biblioteca de activos para su organización, consulte crear una biblioteca de activosde la organización.

    • Onedrive: puede obtener un vínculo a un documento o una imagen que haya almacenado en OneDrive. SharePoint Online.

    • Sitio: puede obtener un vínculo a un documento, una imagen o una página de un sitio que especifique.

    • Cargar: puede cargar un documento o una imagen desde un dispositivo personal.

    • Desde un vínculo: escriba un vínculo para la página, documento o imagen de OneDrive para la empresa o SharePoint Online.

  4. Seleccione la imagen, la página o el documento y haga clic en abrir.

  5. En el cuadro de herramientas, en imagen, seleccione solo imágenes o colores personalizados (solo está disponible elcolor para el diseño mosaicos y el color corresponde al color del tema del sitio).

    La opción selección automática selecciona automáticamente una imagen de la página o documento con el que se está vinculando, si está disponible.

  6. Escriba el texto alternativo de la imagen.

  7. En Opciones:

    • Puede mostrar una llamada a vínculo de acción cambiando el botón de alternancia a . Después, agrega la llamada al texto de acción (por ejemplo, "más información"). El vínculo llamar a la acción está disponible para cada capa en un diseño superpuesto, pero solo para el azulejo más grande en un diseño en mosaico.

    • En el caso de un diseño superpuesto, también puede mostrar un título de tema para cada capa cambiando el encabezado de título de tema a . Después, agregue el texto del encabezadode su tema.

Cambiar el punto focal de una imagen

En SharePoint Online, puede cambiar el punto focal en una imagen seleccionada en el elemento Web de Hero para obtener la parte más importante de la imagen en el marco.

  1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior derecha de la página.

  2. Haga clic en establecer punto focal Botón establecer punto focal en la barra de herramientas de la parte inferior de la imagen principal que desee cambiar.

  3. Arrastre el punto focal hasta el lugar de la imagen que desee.

    Punto focal

Reordenar mosaicos o capas

Puede reordenar mosaicos o capas moviéndolos a la posición que desee.

  1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior derecha de la página.

  2. Haga clic y mantenga presionado el botón mover elemento y, a continuación, arrastre el mosaico o la capa donde desee.

    Mover elemento de Hero

Colocar el elemento Web de Hero en una columna

El elemento Web de Hero está diseñado para ocupar todo el ancho de la página. Si prefiere que el elemento Web de Hero no ocupara todo el ancho, puedes agregarlo a una columna que no sea de ancho completo.

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Su explorador no admite vídeo. Instale Microsoft Silverlight, Adobe Flash Player o Internet Explorer 9.
  1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.

  2. Mantenga el mouse sobre el elemento Web del héroe y haga clic en el signo + situado en el círculo a la izquierda del elemento Web.

  3. En diseño de sección, seleccione una columna.

    Una columna
  4. En el lado izquierdo del elemento Web, use el botón mover elemento Web para arrastrar el elemento Web Hero a la columna que acaba de agregar.

    Botón mover elemento Web

    Moviendo el héroe

Agregar un elemento Web de Hero vacío a una página

Puede Agregar un elemento Web de Hero a una página de un sitio de grupo o un sitio de comunicación . Para ello, realice lo siguiente:

  1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior derecha de la página.

  2. En la página, mueva el mouse por encima o por debajo de un elemento Web existente y verá una línea con un +de círculo, como este:

    Signo más para agregar elementos web a una página

    Haga clic en +y, a continuación, elija el elemento Web de Hero .

    Elemento Web de Hero en estado vacío
  3. Haga clic en el botón de edición del elemento Web Botón de edición del elemento Web y seleccione el tipo de diseño que desee: puede usar una cuadrícula de 1 a 5 mosaicos o de 1 a 5 capas verticales.

  4. Haga clic en seleccionar vínculo para cada mosaico que desee cambiar.

  5. Para cada mosaico, en el cuadro de herramientas, haga clic en seleccionary, a continuación, elija una ubicación desde la que obtener el vínculo:

    En el cuadro de herramientas, haga clic en cambiary, a continuación, elija una ubicación desde la que obtener el vínculo:

    Imagen de las opciones del selector de archivos.
    • Recientes: Si ha abierto recientemente imágenes, páginas o documentos, los encontrará en la lista.

    • Búsqueda web: puede buscar imágenes de Bing que usen la licencia creativa común. Usted es el responsable de revisar las licencias de una imagen antes de insertarla en la página. SharePoint Online.

    • Su organización: Si su organización ha especificado un conjunto de activos aprobados, podrá elegir entre los que figuran aquí.  Si es un administrador de SharePoint y desea obtener información sobre cómo crear una biblioteca de activos para su organización, consulte crear una biblioteca de activosde la organización.

    • Onedrive: puede obtener un vínculo a un documento o una imagen que haya almacenado en OneDrive. SharePoint Online.

    • Sitio: puede obtener un vínculo a un documento, una imagen o una página de un sitio que especifique.

    • Cargar: puede cargar un documento o una imagen desde un dispositivo personal.

    • Desde un vínculo: escriba un vínculo para la página, documento o imagen de OneDrive para la empresa o SharePoint Online.

  6. Seleccione la imagen, la página o el documento y haga clic en abrir.

  7. En el cuadro de herramientas, en imagen, seleccione solo una imagen o colorpersonalizado . La opción selección automática selecciona automáticamente una imagen de la página o documento con el que se está vinculando, si está disponible. El color solo está disponible para el diseño mosaicos y el color corresponde al color del tema del sitio.

  8. Escriba el texto alternativo de la imagen.

  9. En Opciones (soloSharePoint Online ):

    • Puede mostrar una llamada a vínculo de acción cambiando el botón de alternancia a . Después, agrega la llamada al texto de acción (por ejemplo, "más información"). El vínculo llamar a la acción está disponible para cada capa en un diseño superpuesto, pero solo para el azulejo más grande en un diseño en mosaico.

    • En el caso de un diseño superpuesto, también puede mostrar un título de tema para cada capa cambiando el encabezado de título de tema a . Después, agregue el texto del encabezadode su tema.

Escala de la imagen en el elemento Web de Hero

Para elegir imágenes de tamaño óptimo para el elemento Web de Hero, tenga en cuenta lo siguiente:

  • El elemento Web está diseñado para ajustar el ancho de la pantalla en un diseño de sangrado completo.

  • En el diseño mosaicos , el alto del elemento Web se escala para seguir una relación de aspecto de 8:3 y las imágenes dentro del elemento Web escalan a una relación de aspecto de 4:3.

  • En el diseño capas , una capa individual escala a una relación de aspecto de 8:3, y las imágenes dentro de cada capa escalan a una relación de aspecto cercana a 9:16.

Nota: Puede Agregar un vínculo a un vídeo o cargar un vídeo al elemento Web del héroe. Sin embargo, los vídeos no se pueden reproducir en el elemento Web. Los usuarios pueden hacer clic en el vínculo del vídeo y hacerse con el reproductor de vídeo o el origen del vínculo para ver el vídeo.

Nota:  Esta página se ha traducido mediante un sistema automático y es posible que contenga imprecisiones o errores gramaticales. Nuestro objetivo es que este contenido le resulte útil. ¿Podría decirnos si la información le resultó útil? Aquí puede consultar el artículo en inglés.

Ampliar sus conocimientos de Office
Explorar los cursos
Obtener nuevas características primero
Únase a los participantes de Office Insider

¿Le ha sido útil esta información?

¡Gracias por sus comentarios!

Gracias por sus comentarios. Quizá le interese ponerse en contacto con uno de nuestros agentes de soporte de Office.

×