# Médias

Images, vidéos et sons que Feitio n'a pas dessinés. Feitio donne le cadre ; la personne donne l'image.

## Le rôle des médias

### Les images sont du contenu, non de la décoration

Une photo entre parce qu'elle montre quelque chose que le texte ne peut pas : un produit, un lieu, une personne, un résultat. Les images stock "pour l'ambiance" restent à l'extérieur.

### Dessins à domicile ; photos sur les façades

À domicile, les visuels proviennent des dessins à la main de Feitio, et les photos n'apparaissent que lorsqu'elles sont le contenu lui-même. Sur les façades extérieures, la photographie appartient au client et peut prendre le leadership ; Feitio ne donne que le cadre : coins, ratio, légende.

## Images

Le cadre de Feitio : les coins inégaux habituels, sans bordure, sans ombre. L'image est sur le papier, elle ne flotte pas. Ratio fixe, trois pour tout : la page ne saute pas quand l'image se charge, et une ligne reste alignée même avec des photos de tailles différentes.

![](/maid-avatar.png)

16:9, pour les mises en valeur et la vidéo

![](/maid-avatar.png)

4:3, pour le contenu et les pièces jointes

![](/maid-avatar.png)

1:1, pour les miniatures et les grilles

### Une légende lorsque le contexte est nécessaire

Qui, où, quand, d'où elle vient. En sans-serif, petit, juste en dessous de l'image.

### Aucun filtre

L'image se montre telle qu'elle est. Pas de saturation excessive, pas de teinte orange, pas de dégradé sur le dessus.

Do

![](/maid-avatar.png)

Corners Feitio, aucune ombre, l'image telle qu'elle est.

Don’t

![](/maid-avatar.png)

Ombre floue, coin parfaitement rond et couleur boostée : l'image devient une carte d'application.

### Le détail important est visible à la taille complète

Une photo de produit, un screenshot ou un schéma détaillé doit être zoomable. L'image elle-même lie vers le fichier complet, s'ouvrant dans l'onglet actuel : regarder et revenir c'est ce que le bouton retour fait déjà.

[![Ver a imagem em tamanho real / See the image at full size](/maid-avatar.png)](/maid-avatar.png)

Tap pour voir à la taille complète.

### Lors de la nuit, les photos restent telles qu'elles sont

Une photo n'est jamais assombrie ou inversée. Les dessins et diagrammes réalisés à l'encre utilisent la couleur du texte et changent avec le thème d'eux-mêmes.

## Texte alternatif

Toute image possède un texte alternatif (`alt`) : ce que quelqu'un qui ne peut pas voir l'image a besoin de savoir à son sujet, tout de suite.

Image

C'est comme ça

C'est pas comme ça

Photo de produit

Sac en cuir brun avec une longue sangle et une boucle en or

`imagem_bolsa_01.jpg`

Graphique

Sauvegardes de novembre : 29 effectuées, 1 retardée le 12

Graphique

Avalle à côté d'un nom

(vide : le nom est déjà écrit à côté)

Photo de profil d'Ana

Décoration sans information

(vide, `alt=""`)

Image décorative

-   Décrivez l'objectif, pas la technique : évitez « image de » ou « photo de » au début, sauf si le type est important.
-   Si l'image répète ce que dit le texte à côté, le `alt` reste vide pour ne pas dire deux fois la même chose.
-   Graphique complexe ou schéma : le `alt` résume, et les chiffres sont aussi dans un tableau ou du texte.

## Vidéo et audio

Légendes en anglais · Transcription ci-dessous · 2 min 14 s

-   **Rien ne se joue tout seul.** La vidéo et l'audio démarrent seulement quand la personne appuie sur Play. Pas d'autoplay, même pas muet.
-   **Les commandes sont toujours visibles :** play, pause, volume, temps. Les options du navigateur suffisent.
-   **Légendes et transcriptions.** La vidéo avec parole a des légendes ; l'audio a une transcription juste en dessous.
-   **Le mode « réduction de mouvement » s'applique ici aussi :** la vidéo de fond et l'animation en boucle n'existent pas dans Feitio.
-   **Afficher la durée avant le jeu :** la personne décide s'il a le temps.

## Poids et chargement

-   Les images sous l'écran de premier chargement ne se chargent que lorsqu'elles sont proches (`loading="lazy"`) ; la vidéo ne télécharge pas avant le jeu (`preload="none"`).
-   La taille du fichier suit la taille d'affichage : pas de photo de 4000 pixels dans un miniaturisation.
-   Le ratio fixe réserve l'espace avant que l'image n'arrive, et la page ne saute pas.
-   Pendant le chargement, la surface plate soulignée apparaît. Pas d'ossements clignotants.