.

Quel intérêt ?

.

• Dimension des visuels

Sur le site, les photos intégrées peuvent s’afficher avec des tailles différentes, selon qu’elles soient présentées en vignette, en mosaïque ou en mode diaporama. Dans sa largeur maximum, une photo intégrée dans un album sera affichée dans sa largeur maximum en 1080 pixels, et dans sa hauteur maximum en 810 pixels.

Il est donc intéressant de redimensionner les visuels à intégrer pour les albums en 1080 pixels de largeur pour les photos en format paysage, et en 810 pixels de hauteur pour les photos en format portrait. Car si la dimension des visuels est plus petite, ils seront « gonflés » artificiellement au moment de l’affichage sur le site et la qualité apparaitra médiocre. Et si la dimension du visuel est plus grande, il alourdira inutilement la base de données du site.

Sur l’ensemble du site, les visuels qui sont téléchargés ont intérêt à être réduits aux formats suivant :
– 1920 pixels de large si le visuel occupe toute la largeur de la page (plein écran).
– 1080 à 1440 pixels de large si le visuel est intégré dans une largeur relativement importante de la page.
– 810 pixels de large si le visuel occupe une moins grande largeur.

.

• Ratio

La plupart des photos intégrées à ce jour dans le site présentent soit un ratio proche du 4 par 3 (1,33), soit proche du 3 par 2 (1,5). Le fait de se baser sur une largeur de 1080 pixels pour les visuels en format paysage et 810 pour le format portrait, permet de respecter le ratio propre à chaque photo et de garantir le meilleur affichage possible selon la déclinaison des tailles (vignette, mosaïque ou diaporama).

..

• Réduction du poids

Selon l’origine d’une photo, la variation de son poids en terme informatique (sa taille en octets) peut être considérable. Un poids trop élevé sera dommageable pour la navigation sur le site, et il est donc très utile d’alléger au maximum tous les visuels qui doivent être téléchargés dans la base de données du site, sans pour autant nuire à la qualité esthétique des images.

.

L’application en ligne Squoosh

Pour optimiser le temps de chargement des pages et le référencement, il est préférable que chaque visuel intégré, sauf exception, fasse un poids entre 100 ko et 300 ko.

L’application en ligne squoosh (à défaut d’un outil comme Photoshop) permet de modifier facilement la taille et le poids d’une image :
https://squoosh.app/
– Modifier la taille avec « Resize »
– Réduire le poids avec « Compress » en format « MozJPEG » en réglant le curseur « Quality » pour obtenir le poids voulu (vérifier le rendu si tu dois descendre en dessous de 50%)
– La réduction de poids est affichée en direct juste en dessous.
– Sauver le fichier en cliquant sur le picto bleu et blanc en bas à droite.
– Vérifier sur le bureau que la nouvelle image (qui peut avoir le même nom que l’original) fait bien le poids souhaité.
– Renommer l’image selon les principes mentionnés ci-dessous.

.

Principe général des mots-clés 

Les photos sont nommées avec 2 à 5 mots-clés ou expressions-clés séparés par des tirets (tiret du milieu) qui favoriseront un référencement efficace sur le Web.

– Le 1er mot-clé est toujours « aime » et les  mots-clé suivant sont constitués de mots pertinents en fonction de l’image, selon le lieu ou l’activité concernés par exemple, tout élément susceptible de constituer des expressions que les internautes utilisent plus ou moins couramment sur des moteurs de recherche de type Google.

Renommer la nouvelle image avec les principes suivant qui permettent de favoriser le référencement :
– indiquer au début une partie du nom de domaine (aime)
– puis le ou les principaux mots clés (nom de ce que ça représente par exemple)
– tout écrire en minuscules et chiffres
– SANS ACCENS ni caractère spéciaux
– sans espace et avec des tirets (tiret du milieu)

– Exemples : aime-formation-hotellerie.jpg ou aime-sortie-pedagogique.jpg