DOCUMENTATION EN LIGNE
DE WINDEVWEBDEV ET WINDEV MOBILE

Aide / Développer une application ou un site / Champs, fenêtres et pages / Champs : Types disponibles / Champ Image
  • Présentation
  • Optimisation de la taille de l'image
  • Emplacement de l'image
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaEtats et RequêtesCode Utilisateur (MCU)
WEBDEV
WindowsLinuxPHPWEBDEV - Code Navigateur
WINDEV Mobile
AndroidWidget AndroidiPhone/iPadWidget IOSApple WatchMac CatalystUniversal Windows 10 App
Autres
Procédures stockées
Présentation
Lors du développement d'un site WEBDEV, de nombreuses images peuvent être utilisées.
Lors de l'ajout d'une image dans un site WEBDEV, un assistant s'affiche automatiquement. Cet assistant permet de gérer :
  • la taille de l'image. Si l'image a une taille trop importante pour un affichage optimisé sur le WEB, il est possible de compresser l'image.
  • l'emplacement de l'image. L'image doit être dans un répertoire accessible pour être affichée.
Optimisation de la taille de l'image
Lors de l'ajout d'une nouvelle image dans une page WEBDEV, l'image est automatiquement vérifiée. Si l'image sélectionnée a une taille supérieure à 20 Ko, un assistant s'affiche automatiquement. Cet assistant propose de compresser l'image pour optimiser son temps de chargement. Il est bien entendu possible de ne faire aucune modification sur l'image.
Pour compresser l'image :
  1. Dans l'assistant, sélectionnez l'option "Compresser l'image et dégrader sa qualité". Passez au plan suivant.
  2. Sélectionnez le format voulu et ses caractéristiques :
    • Format JPEG : Il est possible de définir la qualité de l'image et de choisir un JPEG progressif. Dans ce cas, la page sera affichée immédiatement et l'image sera affichée progressivement. Le chargement de l'image ne bloquera pas l'affichage de la page.
    • Format GIF : Il est possible de définir le nombre de couleurs gérées par ce format.
    • Format PNG.
      Selon le format choisi et ses options, l'aperçu de l'image résultat est automatiquement affiché.
  3. Sélectionnez si nécessaire la nouvelle taille de l'image. WEBDEV permet de réduire la taille de l'image tout en conservant les proportions. Passez au plan suivant : l'assistant permet de sélectionner l'emplacement de l'image.
Emplacement de l'image
WEBDEV propose deux possibilités pour l'emplacement de l'image :
  • soit l'image est placée dans le répertoire du site (répertoire <Nom projet>_WEB).
  • soit l'image est conservée dans son répertoire d'origine.
Etudions ces deux solutions.
1. L'image est placée dans le répertoire du site (répertoire <Nom projet>_WEB). Cette méthode est conseillée.
L'image peut alors est placée dans un répertoire spécifique du sous-répertoire du site (par exemple un sous-répertoire Interface pour regrouper toutes les images).
Dans ce cas :
  • l'image est copiée une fois pour toute dans le répertoire indiqué (même si elle est utilisée plusieurs fois dans le site).
  • les pages du site utilisent directement cette image.
  • les modifications éventuelles seront effectuées sur l'image présente dans le répertoire du site.
  • l'image conserve son nom, ce qui facilite le référencement du site.
  • si une conversion est nécessaire, elle est effectuée uniquement au moment de la copie de l'image dans le répertoire.
2. L'image est conservée dans son répertoire d'origine.
Dans ce cas :
  • l'image est automatiquement copiée dans le répertoire du site à chaque génération de la page HTML.
  • les modifications éventuelles de l'image doivent être effectuées dans le répertoire du site.
  • l'image est générée avec un nom déterminé par WEBDEV.
  • si une conversion est nécessaire, cette conversion est effectuée à chaque génération de la page contenant l'image.
Cette seconde option est utile uniquement dans les cas suivants :
  • si l'image d'origine doit être partagée avec d'autres projets.
  • si l'image doit être conservée dans son format d'origine.
Attention : Cette option augmente le temps de génération des pages et ne permet pas un référencement correct des images.
Version minimum requise
  • Version 14
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire

Dernière modification : 25/05/2022

Signaler une erreur ou faire une suggestion | Aide en ligne locale