Catégories
A propos du blog PhotoBrol

Galerie photo en lightbox

Nouveau: comment afficher la galerie en mode lightbox (plein écran)?
Temps de lecture :  4 minutes

Pour un meilleur confort de navigation, photobrol propose à présent de visiter la galerie photo en mode « lightbox ».

La photo à afficher en plein écran...
La photo à afficher en plein écran... (infos)

Lightbox

La photo est affichée en pleine page (mais toujours pas en résolution maximum; une photo est générée automatiquement en 2048px pour ne pas que ce soit trop lourd à afficher), avec un minimum d’information.

Seul le titre de la photo s’affiche en bas (précédé du titre de l’album si on navigue dans un album), et une description courte si elle est présente.

Exemples de navigation en mode lightbox

Capture d'écran de la photo vue en mode lightbox

Si la photo est verticale, elle s’affiche sur toute la hauteur de l’écran, si elle est horizontale, elle s’affiche dans la plus grande largeur possible, pour autant qu’elle ne dépasse pas la hauteur de l’écran.

Photo verticale en mode lightbox
Une photo verticale. Elle prend donc la hauteur de l’écran, ce qui réduit sa largeur. Le titre est à peine visible à cause des éléments de la photo. Le titre disparait progressivement pour ne pas empiéter sur la photo.

Le titre apparait au survol, et le fond est plus sombre pour améliorer la lecture
Au survol de la souris, le titre s’affiche en surbrillance et ici le fond est obscurci pour faciliter la lecture.

Le titre s’affiche faiblement, centré horizontalement en bas de l’écran, et au survol de la souris s’affiche plus fortement, obscurcissant la photo si nécessaire.

A gauche et à droite, au survol de la photo des flèches apparaissent pour permettre de passer à la photo suivante ou la photo précédente (mais la navigation est plus facile au clavier si on n’est pas sur une tablette ou un smartphone).

Je dois encore améliorer plein de choses, mais c’est en cours, petit à petit. par exemple, le balayage vers la droite ou la gauche sur un smartphone n’est pas encore implémenté.

Pour plus d’informations sur une photo, il suffit de cliquer sur la photo. La fin de l’adresse (/lightbox/) est replacée par l’extension par défaut (.html). Exemple: https://www.gaudry.be/photos/1.html

Une partie des metadonnées et les miniatures de navigation

Pour info, les albums se trouvent ici: https://www.gaudry.be/photos/sets.html

Un clic sur un album permet de parcourir les photos

Navigation avec clavier

Il est possible, comme dans le reste du site, de naviguer de page en page (ici de photo en photo) en utilisant les flèches gauche et droite du clavier.

En mode lightbox, il suffit de presser la touche d’échappement (Esc) pour retourner au site.

Pour optimiser encore le confort de navigation, vous pouvez presser la touche F11 de votre clavier, et le navigateur devrait passer en plein écran.

Autres moyens de navigation

Le flux au sein d'un album
Affichage des photos d’un album (ici l’Italie). Un clic sur une des vignettes lance un popup pour une lightbox basique. Un clic sur la photo de la lightbox permet de passer en lightbox complète, plein écran.

Navigation par metadonnées (ici l'ouverture f/1.4)
Il est possible de naviguer selon les metadonnées des photos. Ici dans cet exemple, le flux parcourt les photos prises avec une ouverture de 1.4

Un autre exemple de metadonnée : l'objectif
Un autre type de metadonnée: l’objectif utilisé. Ce n’est qu’un exemple, mais il y a aussi l’appareil photo, la vitesse d’obturation, la sensibilité, le format, la date…

Les statistiques plus claires en diagramme et tableau
Les statistiques peuvent aussi s’afficher sous forme de diagramme, ce qui permet de mieux visualiser la répartition des valeurs. Il est possible de cliquer sur chaque partie du diagramme, de trier ou de filtrer le tableau de résultats. Un clic sur une valeur du diagramme ou du tableau affiche le flux de photos correspondant.

Navigation par tags (étiquettes). Ici "coucher de soleil"
Pour chaque photo, il existe des tags (des étiquettes) qui permettent de naviguer indépendamment des albums ou des metadonnées. Ici, l’affichage des photos en rapport avec un « coucher de soleil ».

Dans les coulisses

Les photos et les pages sont à présent normalement en cache (sauf si le cache vient d’être vidé). Par contre, si vous activez le mode utilisateur, la navigation se fait sans cache.

Si vous avez des remarques ou des suggestions, les commentaires me permettent aussi d’avancer ;-)

Bonne lecture.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site est protégé par reCAPTCHA et Google Politique de confidentialité et Conditions d'utilisation appliquer.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.