Affichage d'images multiples

Il existe plusieurs façons d'afficher un certain nombre d'images reliées logiquement sur un site Oxygen. Disons que vous avez 35 images que vous voulez afficher dans un groupe. Quelles sont vos options ? Vous pouvez faire l'une des choses suivantes.

Afficher toutes les images en ligne, en taille réelle

Vous pourriez choisir d'afficher les 35 images, en taille réelle, l'une après l'autre sur la page. Mais vous pouvez considérer que 35 images sont trop nombreuses pour être affichées en une seule fois. Avec un tel nombre d'images en taille réelle, la page sera très longue, et si vous ne prenez pas de mesures pour y remédier, le classement de la page risque d'en pâtir.

L'affichage d'un grand nombre d'images les unes à la suite des autres, ou entre les paragraphes, peut alourdir une page - et donc la rendre lente. Google déteste les pages lentes.

Vous pouvez essayer de charger les images paresseusement pour réduire le poids de la page. Le chargement paresseux signifie que les images ne sont pas chargées, sauf si l'utilisateur fait défiler la page suffisamment loin pour les voir. Le chargement paresseux est un chargement juste à temps des images.

L'affichage d'un grand nombre d'images en taille réelle occupera également beaucoup d'espace vertical. Vous devez faire preuve de discernement. Si vous n'avez que 8 images à afficher, cette méthode peut bien sûr fonctionner correctement. Si vous avez 35 images à afficher, vous devriez peut-être penser à autre chose.

Affichez des images dans une barre de défilement

En termes d'espace sur la page, un slider est plus efficace. Il n'occupe que l'espace d'une image, car les 34 autres images sont cachées jusqu'à ce qu'elles soient visibles. Cela dépend du plugin de slider que vous utilisez, mais de nombreux sliders chargent les images paresseusement lorsqu'elles sont nécessaires.

Cela signifie que votre page ne devra pas nécessairement charger les 35 images pour commencer.

En général, l'utilisateur ne peut voir qu'une seule image à la fois et doit attendre que chaque image se glisse dans la vue, ou utiliser les commandes pour faire défiler manuellement chaque image. Les utilisateurs étant souvent pressés, un curseur n'est peut-être pas la meilleure solution si vous voulez être sûr que les images soient vues.

De plus, si les créateurs de sites Web trouvent les curseurs faciles à utiliser, ce n'est pas le cas de nombreux utilisateurs. Ils peuvent être irrités de devoir réfléchir aux boutons sur lesquels ils doivent cliquer pour trouver les informations dont ils ont besoin.

Pire encore, si l'information n'est pas littéralement présentée là, devant l'utilisateur, celui-ci ne fera peut-être pas l'effort de la chercher. C'est pourquoi les interfaces compliquées, trop intelligentes, cryptiques ou non intuitives sont souvent vouées à l'échec.

Afficher les images dans une galerie

Une galerie est un affichage cohérent de vignettes d'images. Comme toutes les images sont affichées en même temps, l'utilisateur peut facilement examiner toutes les vignettes. Si l'une d'entre elles attire son attention, il peut cliquer dessus pour voir la grande image que la vignette représentait.

En option, un clic sur une seule vignette peut déclencher l'affichage d'une boîte à lumière de toutes les images représentées par les vignettes de la galerie. Une boîte à lumière affichera également la grande version de l'image représentée par la vignette cliquée, mais elle permettra en outre à l'utilisateur de faire défiler manuellement toutes les autres images de la galerie pour les voir en taille réelle.

Une galerie peut prendre plus de place qu'un curseur si vous avez beaucoup de vignettes d'images. Mais vous pouvez normalement contrôler la taille des vignettes pour maîtriser, dans une certaine mesure, l'espace utilisé.

Avantages d'une galerie

L'avantage d'une galerie est que l'utilisateur peut rapidement parcourir toutes les images et cliquer sur celle qu'il veut voir en plus grand. Dans le cas d'un curseur, il se peut qu'il n'attende jamais assez longtemps pour voir toutes les images défiler, de sorte que votre travail ou votre message peut être essentiellement caché.

Lorsqu'on clique dessus, la vignette apparaît en taille réelle dans une boîte à lumière virtuelle. Avec une galerie, rien n'est caché lors de l'affichage initial. Cela incite davantage les gens à regarder l'ensemble de votre travail. Les galeries permettent à l'utilisateur de rester sur la page et de développer un intérêt pour le contenu.

L'autre avantage, bien sûr, est que la version plus grande de l'image n'est pas chargée, sauf si l'utilisateur demande à la voir dans la lightbox.

Une fois que la lightbox est ouverte, les images restantes peuvent être visualisées à travers la lightbox, à ce moment-là la galerie devient plutôt comme un curseur. Évidemment, à ce stade, vous comptez à nouveau sur la volonté de l'utilisateur d'interagir avec l'interface utilisateur de la lightbox pour naviguer dans la séquence d'images. Mais au moins, comme la galerie lui a tout exposé au départ, le visiteur est plus susceptible d'examiner les images plus avant.

Quelques options de galerie

J'ai rédigé quelques articles de blog pour vous aider à vous lancer facilement dans les galeries.

• Vous pouvez commencer par le bloc de galeries intégré de WordPress
• Cette fonction peut être améliorée grâce au plugin gratuit SimpLy Gallery.
• Ou vous pouvez utiliser l'élément de galerie natif d'Oxygen

Les boîtes à lumière sont facultatives

La plupart des galeries sont équipées de boîtes à lumière intégrées, mais certaines ne le sont pas. N'oubliez pas qu'il est également possible de charger une galerie de vignettes et d'en rester là. C'est-à-dire un simple affichage organisé de vignettes qui ne sont pas cliquables. Si vous choisissez des vignettes suffisamment grandes, vous pouvez atteindre votre objectif avec la galerie seule et permettre à la page de rester relativement légère.