$ 29.00

Tuto L'intégration en Responsive Web Design avec CSS, HTML

$ 29.00

  • Une formation vidéo de 3h01m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com

Vous êtes concepteur de sites Internet et vous souhaitez améliorer vos connaissances dans le Responsive Web Design ?
Vous rêvez de devenir concepteur de sites Internet professionnels ?
Alors ce tuto est fait pour vous !

Les connaissances que je dispense dans ce tuto vous seront indispensables afin de pouvoir mener à bien la conception de sites Internet professionnels.
IMPORTANT : Pour pouvoir suivre sereinement ce tuto, vous devez connaître la mise en page CSS3 par les Flexbox. Si tel n'est pas le cas, je mets à votre disposition divers cours sur l'apprentissage des flexbox :

 

Au programme de ce cours sur le Responsive Web Design

Dans ce tuto en vidéo consacré à l'intégration responsive, nous allons aborder la technologie CSS qui nous permet de rendre facilement un site web adapté au support qui le visualise.
Cette technologie qui s'appelle les medias queries est relativement simple à comprendre et il y a peu de chose à savoir. En revanche, il faut mettre l'accent sur la pratique !
Ce tuto est donc axé sur la pratique de cette technologie afin de faire de vous un véritable professionnel au niveau Front-end !

Je ferais appel à vos connaissances sur les flexbox afin de résoudre un certain nombre de difficultés !
Ce tuto abordera les 2 pratiques sur la conception de site Internet : le mobile first ainsi que le desktop first.

A la fin de ce tuto, vous serez parfaitement apte à réaliser en quelques minutes seulement, la mise en page d'un site Internet simples comme complexes.

  • Un QCM est fourni en fin de cours afin de valider vos compétences.
  • Des fichiers de travail sont mis à votre disposition.
  • Enfin, un salon d'entraide est à votre disposition si vous avez des questions relatives au tuto.

Bonne formation !

Table des matières de cette formation CSS, HTML (durée : 3h01m)

  • Le Responsive
    • Présentation 00:02:30
    • Le viewport 00:02:40
    • Les points de ruptures 00:02:16
    • Les medias queries 00:04:35
    • Le mobile first 00:01:00
  • Mobile-first : 1er exemple
    • Mise en place de la structure HTML 00:03:12
    • Mise en place du CSS pour les smartphones 00:09:06
    • Mise en place du CSS pour les ordinateurs 00:11:48
  • Mobile-first : 2ème exemple
    • Mise en place de la structure HTML 00:06:39
    • Mise en place du CSS pour les smartphones 1/2 00:13:57
    • Mise en place du CSS pour les smartphones 2/2 00:05:40
    • Mise en place du CSS pour les tablettes 00:07:10
    • Mise en place du CSS pour les ordinateurs 00:12:32
  • Desktop first : 1er exemple
    • Présentation du desktop first 00:01:07
    • Mise en place de la structure HTML 00:04:36
    • Mise en place du CSS pour les ordinateurs 00:09:30
    • Mise en place du CSS pour les smartphones 1/2 00:07:17
    • Mise en place du CSS pour les smartphones 2/2 00:08:25
  • Desktop first : 2ème exemple
    • Mise en place de la structure HTML 00:05:40
    • Mise en place du CSS pour les ordinateurs 00:09:55
    • Mise en place du CSS pour les tablettes 00:04:34
    • Mise en place du CSS pour les smartphones 00:04:28
  • Mobile First Vs Desktop First
    • Mobile First ou Desktop First ? 00:02:53
    • Desktop First : la structure HTML 00:05:18
    • Desktop First : le CSS pour les ordinateurs 00:07:32
    • Desktop First : le CSS pour les tablettes 00:07:10
    • Desktop First : le CSS pour les smartphones 00:04:26
    • Mobile First : le CSS pour les smartphones 00:04:21
    • Mobile First : le CSS pour les tablettes 00:04:47
    • Mobile First : le CSS pour les ordinateurs 00:02:25
    • Conclusion 00:04:18



Formateur : Carl Brison

Carl Brison a publié 111 tutoriels et obtenu une note moyenne de 4,9/5 sur 7 024 tutoriels vendus. Carl Brison est un formateur certifié tuto.com. Voir les autres formations de Carl Brison

5,0
note moyenne

7
avis laissés
5 étoiles
7
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de tedm laissé le 25/07/2019
    5 cas pratiques pour comprendre le responsive design avec la technologie des flexbox. Une pédagogie par l'exemple qui avance étape par étape. j'ai eu la chance de suivre les tutos sur les flexbox avec Carl et je peux témoigner de la puissance de cette technologie. Dans mon apprentissage on m'a fait commencer par découvrir Bootstrap pour gérer le responsive mais aujourd'hui je suis convaincu que c'est une erreur de méthode. Passer sur des frameworks sans connaitre le fonctioennement et les comportements des technologies officielles est à mon sens une erreur tactique dommageable dans un processus d'apprentissage. Merci Carl de nous démontrer efficacement que ce qui est important c'est de maitriser parfaitement les bases. Une vérité pour tout domaine d'activité qu'on a tendance à oublier. :)
    "Merci pour votre sens très aiguisé !"

  • 5
    avis de vinceb0 laissé le 27/04/2019
    Alors la ... je ne sais pas ce qu'il vient de se passer mais tout est devenu clair et limpide dans ma tête, mes doigts écrivent tous seuls et la page se met en place sans prise de tête. Merci Mr Brison.
    "Merci à vous, Vincent. Je suis très heureux de vous avoir comme apprenant ;-)"

  • 5
    avis de laroccavideo laissé le 03/04/2019
    Applications pratiques des flexbox, exercices intéressant et assez simples si on a compris les flexbox.

  • Avec quelles versions de logiciels ce tuto est-il compatible ?
    CSS 3, HTML 5
  • Que contient le fichier source ?
    Toutes les sources du tuto
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
  • Très interessant mais une question, j'ai fait dernièrement une formation Outlook 2016, mais le seul reproche c'est que l'on peut que regarder les vidéos on ne peut pas les télécharger sur son PC. Alors difficile de suivre un cours sur plus de 70 vvidéos ou avoir une bonne mémoire perso. J'y ai passé 3 semaines il il me reste rien. Alors votre cours de formation est il le même système ? Cordialement Louis progeas.l@wanadoo.fr
    Bonjour, Comme précisé sur la fiche description, les fichiers de travail sont mis à votre disposition. Il est certain que si on se contente juste d'écouter, sans jamais pratiquer, il est difficile de se rappeler de ce que l'on a appris. Pour progresser je vous conseille : de faire une petite fiche où vous y notez les points essentielles, puis de tenter de faire par vous même les exemples proposés ou bien ceux de votre choix. Gardez bien ceci à l'esprit : en informatique, le secret c'est la pratique ! Enfin et pour clore ma réponse, ce tuto demande d'avoir des connaissances dans les flexbox. Si vous n'avez pas ces connaissances, je vous conseille de les acquérir afin de pouvoir suivre facilement ce tuto qui vous donnera toute la dextérité pour pouvoir réaliser très facilement des mises en page responsives de site internet.
accédez à plus de 1082 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données