A la découverte du Responsive Design
ERROR
00:00
00:00

TUTO A la découverte du Responsive Design

Steven Sil
29,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Au moment où je créé cette formation, les sites Web sont consultés à plus de 50% par des téléphones mobiles, à 7% par des tablettes et à plus de 40% par des ordinateurs. Cet usage grandit au fur et à mesure des mois (+ 10% de visite via des smartphones entre janvier 2017 et décembre 2017 en France).

Il est donc important pour chaque site, d’adapter son contenu et la disposition de celui-ci en fonction de la taille de l’écran qui l’affiche. C’est ce qu’on appelle le Responsive Web Design.

Au programme de cette formation dédiée au Responsive Design

Cette formation complète a pour but de vous former au responsive design en abordant toutes les notions importantes de celui-ci :

  • Utilisation des media queries pour modifier la disposition des éléments en fonction de la taille de l’écran de notre visiteur.
  • Découverte de l’utilisation des unités relatives pour avoir un site qui s’adapte parfaitement à son environnement et qui reste accessible aux malvoyants.
  • Adaptation des textes pour garder une lisibilité maximale peu importe le support.
  • Modification des sources des images de notre design en fonction de la taille de l’écran du visiteur.
  • Des médias flexibles qui s’adapte parfaitement à chaque disposition de notre design.
  • Découverte du Mobile first qui consiste à d’abord s’occuper de la disposition de nos éléments sur les plus petits écrans (smartphones) pour ensuite évoluer vers des écrans de plus en plus grands. Les smartphones étant moins puissant que nos ordinateurs, il est important de réduire au maximum leur travail durant le rendu de notre page.
  • Découverte du module de disposition Flexbox de CSS 3 afin de créer une grille responsive pour vos futurs projets Web.

Pour que cette formation soir réellement complète, nous viendrons réaliser une landing page responsive complète dont vous pouvez voir le résultat dans la vidéo d’introduction de la formation et dans la galerie d’images un peu plus bas.

Cette formation est accessible à toute personne ayant une première expérience avec les langages HTML et CSS. J’ai d'ailleurs créé une formation à ce sujet qui est disponible juste ici.

Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions. 
Un QCM est disponible pour valider vos nouvelles compétences.
Les fichiers sources sont fournis avec le cours.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Chapitre 1
Ce qu'il faut savoir
Chapitre 2
Cas concret : Une landing page responsive

Plan détaillé du cours

Chapitre 1 : Ce qu'il faut savoir
1h43m
 
Leçon 1Introduction
Leçon 2Le responsive design
Leçon 3Le document HTML de base
Leçon 4Media types et media queries
Leçon 5Utiliser les unités relatives
Leçon 6Organiser un projet avec le mobile first
Leçon 7Gérer les textes
Leçon 8Des médias flexibles
Leçon 9Des images adaptatives
Leçon 10Initiation à Flexbox
Leçon 11Créer une grille responsive avec Flexbox
Chapitre 2 : Cas concret : Une landing page responsive
1h31s
 
Leçon 1Préparation de notre projet
Leçon 2Le header
Leçon 3Les compétences
Leçon 4Le formulaire d'abonnement à la Newsletter
Leçon 5Le footer
Leçon 6Conclusion

Aperçus

Avis des apprenants

Détail des avis
74
Apprenants
4
Commentaires
5/5
Note moyenne
5/5
4
4/5
0
3/5
0
2/5
0
1/5
0
Mickael Riviere
Mickael Riviere
Publié le 16/01/2020
Formateur hyper clair !
Steven Sil
Steven Sil
Merci ! :D
Xavier Viacava
Xavier Viacava
Publié le 16/05/2018
Très bonne pédagogie, très claire.
Steven Sil
Steven Sil
Merci ! :)
Sébastien Champalaune
Sébastien Champalaune
Publié le 16/02/2018
Un excellent tuto que j'ai acheté les yeux fermés. Steven est toujours au top. Merci
Steven Sil
Steven Sil
Merci à toi d'être toujours au rendez-vous ! :)

Vos questions sur le cours

Avec quelles versions de logiciels ce tuto est-il compatible ?

CSS 3, HTML 5

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Attendez ! 🤗

Accédez à plus de 1330 tutos gratuits

Notre politique de protection des données