Clicky

Visualización de varias imágenes

Hay varias maneras de mostrar una serie de imágenes conectadas lógicamente en un sitio Oxygen. Digamos que tiene 35 imágenes que desea mostrar en un grupo. ¿Cuáles son sus opciones? Podría hacer cualquiera de las siguientes.

Mostrar todas las imágenes en línea, tamaño completo

Puede elegir mostrar las 35 imágenes, a tamaño completo, una tras otra en la página. Pero puede considerar que 35 imágenes son demasiadas para mostrarlas todas a la vez. Tantas imágenes a tamaño completo alargarán mucho la página y, si no toma medidas para evitarlo, la clasificación de la página puede verse afectada negativamente.

Mostrar muchas imágenes una detrás de otra, o entre párrafos, puede hacer que una página resulte pesada y, por tanto, lenta. Google odia las páginas lentas.

Puedes probar a cargar las imágenes perezosamente para reducir el peso de la página. La carga lenta significa que las imágenes no se cargan a menos que el usuario se desplace lo suficiente hacia abajo para verlas. La carga perezosa consiste en cargar las imágenes justo a tiempo.

Mostrar muchas imágenes a tamaño completo también utilizará mucho espacio vertical. Hay que tomar una decisión. Si sólo tiene 8 imágenes para mostrar, este método puede funcionar bien. Si tiene 35 para mostrar, tal vez quiera pensar en otra cosa.

Varias imágenes en una página
Las imágenes se colocan en la página una tras otra, pero ocupan mucho espacio vertical

Mostrar imágenes en un deslizador

En términos de espacio en la página, un deslizador es más eficiente. Sólo ocupa el espacio de una imagen, porque las otras 34 imágenes están ocultas hasta que se deslizan a la vista. Dependerá del plugin de slider que utilices, pero muchos sliders cargan las imágenes lentamente cuando es necesario.

Esto significa que su página no tendrá que cargar necesariamente las 35 imágenes para empezar.

Una imagen deslizante
Una corredera

Normalmente, el usuario sólo puede ver una imagen cada vez y debe esperar a que cada imagen se deslice a la vista, o utilizar los controles para deslizarse manualmente por cada imagen. Como los usuarios suelen tener prisa, un deslizador puede no ser la mejor solución si quieres asegurarte de que las imágenes se ven.

Además, aunque a los creadores de sitios web nos resulten fáciles de usar, a muchos usuarios no. Puede irritarles tener que pensar en qué botones pulsar para encontrar la información que necesitan.

Peor aún, si la información no se presenta literalmente allí, delante del usuario, éste podría no hacer el esfuerzo de buscarla. Por eso las interfaces complicadas, demasiado ingeniosas, crípticas o poco intuitivas suelen ser contraproducentes.

Mostrar imágenes en una galería

Una galería es una presentación coherente de imágenes en miniatura. Como todas las imágenes se muestran a la vez, el usuario puede examinar fácilmente todas las miniaturas. Si alguna le llama la atención, puede hacer clic en ella para ver la imagen grande que representaba la miniatura.

Opcionalmente, al hacer clic en cualquier miniatura se puede abrir una caja de luz con todas las imágenes representadas por las miniaturas de la galería. Una caja de luz también mostrará la versión grande de la imagen representada por la miniatura pulsada, pero además permitirá al usuario pasar manualmente por todas las demás imágenes de la galería para verlas a tamaño completo.

Una galería puede ocupar más espacio que un deslizador si tiene muchas miniaturas de imágenes. Pero normalmente puedes controlar el tamaño de las miniaturas para controlar hasta cierto punto, el espacio utilizado.

Una galería de imágenes
Una galería de imágenes en miniatura

Ventajas de una galería

La ventaja de una galería es que el usuario puede escanear rápidamente todas las imágenes y hacer clic en la que desee ver a mayor tamaño. En el caso de un deslizador, es posible que nunca esperen lo suficiente para ver todas las imágenes deslizarse, por lo que su trabajo o mensaje puede quedar esencialmente oculto.

Al hacer clic, la miniatura aparecerá a tamaño completo en una caja de luz virtual. Con una galería, nada queda oculto en la vista inicial. De este modo, es más probable que la gente se anime a ver toda su obra. Las galerías facilitan que el usuario permanezca en la página y desarrolle interés por el contenido.

La otra ventaja, por supuesto, es que la versión ampliada de la imagen no se carga a menos que el usuario solicite verla en el lightbox.

Una vez abierta la caja de luz, las imágenes restantes pueden verse a través de la caja de luz, momento en el que la galería se convierte más bien en un deslizador. Evidentemente, en este punto vuelves a depender de la voluntad del usuario de interactuar con la interfaz de usuario del lightbox para navegar por la secuencia de imágenes. Pero al menos con la galería habiéndoselo expuesto todo inicialmente, es más probable que el visitante siga investigando las imágenes.

Algunas opciones de galería

He escrito algunas entradas en el blog para ayudarte a empezar con las galerías fácilmente.

Las cajas de luz son opcionales

La mayoría de las galerías vienen con lightboxes incorporados, pero algunas no. Ten en cuenta que también es posible cargar una galería de miniaturas y dejarlo así. Es decir, sólo una visualización organizada de miniaturas en las que no se puede hacer clic. Si eliges miniaturas lo suficientemente grandes, puedes conseguir tu objetivo sólo con la galería y permitir que la página siga siendo relativamente ligera.