How long does the training course last?

2,00 day(s)

In which language(s) is the training course taught?

EN FR

When will the next session take place?

02.12.2026

See details

Where does the training course take place?

En distanciel

How much does the training course cost?

1550,00€

Who is organising this training course?

OXiane est spécialisé dans la conception et la réalisation de formations informatiques et de supports de cours pédagogiques sur les dernières technologies. Nos différentes filières permettent de couvrir tous les besoins en formation que ce soit en IT au sens large, mais également "Utilisateurs" et "Soft Skills" en Management, Communication & leadership.

The content of this page is not available in English

Who is the training course aimed at?

Développeurs front-end, UX Designers, Graphistes Web, Chefs de projet Web

What are the aims or the skills being targeted?

Appréhender les tenants et aboutissants de la gestion des images dans les projets Responsive Web Design,
Intégrer dans leurs projets Responsive Web Design les bonnes techniques de gestion des images.

What does the training course cover?

État des lieux du Web mobile

Usage de devices différents selon le contexte, le moment de la journée
Activité séquentielle d'un device à l'autre
Statistiques par navigateurs et plateformes
Rapprochement mobile – desktop : un seul développement

Rappel de la définition du Responsive Web Design

La définition d'origine
Les grands principes pour les images
Parcours de quelques sites pour visualiser les pratiques courantes pour les images en
Responsive Web Design

Les formats d'images

Les images matricielles (bitmap) : GIF, PNG, JPEG
Les images vectorielles : fontes d'icônes, SVG
La gestion des sprites

Gérer les images de décoration dans la CSS

Gérer les densités variables (« Retina »)
Gérer les largeurs variables, fluides
Combiner les deux

Gérer les images de contenu dans le HTML

Gérer les densités variables (« Retina »)
- L'astuce « Compressive Images »
- srcset-x
Gérer les largeurs variables, fluides
- srcset-w
- sizes
La Direction Artistique
- picture / source