Ventana Estilo de las Filas

Paso 4 - Páginas > Opciones de la Barra de Herramientas y Rejilla >

Ventana Estilo de las Filas

Previous pageReturn to chapter overviewNext page

Mediante las opciones de esta ventana, que se abre con el botäon Estilo de las Filas que hay en la barra de herramientas de la Rejilla de maquetación ofrecida en la ventana Creación de la página, se puede definir el aspecto gráfico de una Fila, es decir de una franja horizontal ocupada por un grupo de Objetos situados en una Página.

La ventana Estilo de las Filas ofrece:

una Rejilla que retoma la configuración de la Página, tal como se la ha definido en la ventana Creación de la página;
la lista de las opciones disponibles.

Basta seleccionar la Fila en la que se quiere trabajar y utilizar las opciones disponibles para definir su aspecto. La Fila seleccionada se vuelve de color azul y el número que la identifica queda realzado en negrita.

Al lado de cada Fila se muestra una bolita que puede estar llena o vacía en función de si el aspecto de la Fila ya ha sido definido o no.

Es posible vincular entre sí varias Filas consecutivas para que estén caracterizadas por el mismo aspecto gráfico. Puede suceder también que, como consecuencia de cómo estén dispuestos los Objetos en la Rejilla o de cómo hayan sido ordenados en el caso de tratarse de un Sitio web Adaptable, algunas Filas se unan automáticamente. Para más información, ver Cómo trabajar el Aspecto de las Filas.

Una vez seleccionada la Fila o el grupo de Filas en que se quiere trabajar, se puede comenzar definiendo el tipo de Fondo del sitio que se quiere establecer eligiendo entre:

De colores: el fondo de la Fila se colorea con un solo color.

Degradado: el fondo de la Fila se rellena con un degradado del cual se pueden definir los colores de inicio y final y la dirección del degradado.

Imagen: el fondo de la Fila se crea mediante la importación de una imagen.

Vídeo: como fondo de la Fila se emplea un vídeo.

Según el tipo de Fondo, es posible modificar diferentes opciones del recuadro Ajustes. Las opciones que pueden estar disponibles son las siguientes:

Color: especifica el color para usar como relleno del fondo.
Color inicial / Color final: especifican los colores de inicio y final que se desea utilizar para dar forma a un degradado.
Difusión: establece si en el degradado debe predominar el color inicial o el color final, definiendo el espacio (en %) en el que debe producirse la transición del primero al segundo.
Dirección: define el tipo de degradado que se debe aplicar, eligiendo entre desde Arriba, desde Abajo, desde la Izquierdao desde la Derecha.
Archivo local en PC: selecciona el archivo gráfico (.JPG, .GIF, .PNG.) de la imagen que se utilizará como fondo. La imagen puede buscarse bien en la Librería online a la que se accede mediante el botón bien en las carpetas locales por medio del botón Seleccionar archivo.
Repetir: especifica si la imagen añadida como fondo debe repetirse o no. La imagen se puede repetir solo en sentido horizontal, solo en sentido vertical o en ambos sentidos, de modo que ocupe todo el espacio disponible. Además es posible hacer que la imagen se adapte, es decir, que se redimensione de modo que cubra todo el fondo.
Alineación: especifica cómo debe estar alineada la imagen introducida como fondo respecto al área ocupada por la Fila.
Opacidad: define el grado de opacidad del color/del difuminado/de la imagen de fondo aplicados. Para valores tendientes a 0 disminuye la opacidad y el fondo de la Fila se vuelve más transparente, dejando ver el fondo de la Página.
Tipo de vídeo: define si para el vídeo que se quiere incluir como fondo de la Fila se debe utilizar un Archivo local en PC, un Archivo de Internet o un Vídeo de Youtube.
Archivo local en PC / Archivo de Internet / URL de Vídeo de Youtube: ofrecidos según el Tipo de vídeo seleccionado, estos elementos permiten seleccionar el archivo de vídeo que se quiere importar o introducir la dirección URL en la que el archivo del vídeo ya está disponible en Internet.
Imagen de vista previa: especifica una imagen de vista previa para asociar al vídeo. También en este caso la imagen puede buscarse bien en la Librería online a la que se accede mediante el botón bien en las carpetas locales por medio del botón Seleccionar archivo.

La imagen de vista previa se muestra antes del vídeo y desaparece con efecto de fundido solo tras haberse iniciado la reproducción. Definir la imagen de vista previa es pues particularmente útil para gestionar la consulta en dispositivos móviles, donde el vídeo no se inicia nunca automáticamente.

Por último, es posible activar las siguientes Opciones:

Extender hasta el ancho de la ventana del Explorador: el aspecto definido para la FIla no se aplica solo hasta el ancho correspondiente al contenido de la Página, sino que se extiende por todo el ancho de la ventana del Navegador.
Activar Efecto Parallax: activa el efecto parallax en la Fila seleccionada. El efecto parallax es una técnica visual que mediante el movimiento de imágenes a diferentes velocidades y perspectivas confiere profundidad y riqueza al diseño de una Página Web, creando una ilusión 3D. Este efecto vuelve el desplazamiento de las Páginas una experiencia más cautivadora para el Visitante.

Basándose en el movimiento de imágenes a diferentes velocidades, el efecto parallax no puede activarse si como fondo de la Fila se establece un color único.

 


Best practice:

-

Cómo trabajar en el Estilo de las Filas


Profundización:

-

El Box Model en WebSite X5