Bundle Formation WEBDESIGNER : Créer un site OnePage dynamique & responsive
ERROR
00:00
00:00

TUTO Bundle Formation WEBDESIGNER : Créer un site OnePage dynamique & responsive

Adrien Gazaix
Promo -31%
59,00€85,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Cette formation de 14h de vidéo s’adresse à toute personne souhaitant créer un site web OnePage afin de présenter son activité professionnelle. Elle vise également ceux qui souhaitent devenir Webdesigner.

C'est la conduite complète d'un projet de création d'un site One Page qui vous ai proposé dans ce bundle : de la création de la maquette graphique, à la création d'un thème personnalisé dans WordPress en passant par une phase d'intégration en HTML, CSS et jQuery.

Toutes les étapes sont présentées et vous pourrez suivre cette formation à votre propre rythme en posant des questions au formateur.
 

Au programme de cette formation Webdesigner et Intégrateur

Ce cours se décompose en 3 parties (que vous pouvez acquérir de manière séparée).

  • LE WEBDESIGN : nous utiliserons le logiciel Affinity Designer (version d’évaluation) pour créer la maquette du site en version bureau & mobile. Les notions de “grille Bootstrap”, “de système de navigation”, de “responsive design” seront abordées.
  • L’INTÉGRATION : cette partie sera consacrée à l’intégration HTML/CSS de la maquette précédemment créée en utilisant le framework Bootstrap afin de faciliter le responsive sur mobile/tablette. Le jQuery sera aussi utilisé pour créer des effets de parallaxe, des animations, des sliders…
  • LA CRÉATION DU THÈME WORDPRESS : une fois que l’intégration est terminée, nous passerons à la création du thème sur le CMS WordPress pour rendre notre site entièrement dynamique. Le contenu pourra donc être modifié via une administration.

A la fin de la formation, vous connaîtrez tout le processus de création d’un site web, et vous serez autonome pour mettre en place votre propre site OnePage ou celui de vos clients !

Vous trouverez le design complet, l’intégration HTML, et le thème WordPress dans les fichiers de travail fournis, pour que vous puissiez vous y référer à tout moment.

Je reste disponible dans le salon d’entraide si vous avez des questions pendant ou après le visionnage.
Bonne formation à tous !

Cours dans ce bundle

Créer un site OnePage pour présenter votre activité professionnelle - Partie 1 : LE WEBDESIGN Cours 1

Créer un site OnePage pour présenter votre activité professionnelle - Partie 1 : LE WEBDESIGN

Créer un site OnePage Responsive - Partie 2 : L'INTÉGRATION Cours 2

Créer un site OnePage Responsive - Partie 2 : L'INTÉGRATION

Créer un site OnePage dynamique - Partie 3 : LE THÈME WORDPRESS Cours 3

Créer un site OnePage dynamique - Partie 3 : LE THÈME WORDPRESS

Plan détaillé des cours

 
Leçon 1Intro, grille bootstrap et palette de couleurs
14m48s
Leçon 2Partie ACCUEIL : logo, image de fond et menu
28m32s
Leçon 3Partie A PROPOS : icones, paragraphes, bouton
11m56s
Leçon 4Partie EQUIPE : images, masques, et opacité
12m02s
Leçon 5Partie DEVISE : parallax, masque, ombre portée
05m41s
Leçon 6Partie FOLIO : icones, masques, formes, et effets
15m41s
Leçon 7Partie CONTACT : icones, dégradé, formes
12m42s
Leçon 8Design de la version MOBILE : plans de travail, icone burger, dégradé
18m01s
Leçon 9Conclusion et découverte du design une fois intégré
12m03s
 
Chapitre 1 : Introduction & Préparation
36m06s
 
Leçon 1Déroulement de la formation
Leçon 2Préparation des fichiers html, css et javascript
Chapitre 2 : Section ACCUEIL
43m10s
 
Leçon 1Structure HTML/CSS & positionnement du logo
Leçon 2Effet de parallax sur le background & bouton de scroll en jQuery
Chapitre 3 : Création du MENU
35m12s
 
Leçon 1Structure du menu & style css pour le positionner en fixed
Leçon 2Animation & fonctionnement OnePage du menu en jQuery
Chapitre 4 : Section A PROPOS
24m13s
 
Leçon 1Structure HTML/CSS & colonnes Bootstrap
Chapitre 5 : Section NOTRE EQUIPE
45m04s
 
Leçon 1Structure HTML/CSS, apparition d'un texte au survol & effets d'opacité sur des images
Leçon 2Effet 3D au survol en jQuery
Chapitre 6 : Section DEVISE
11m42s
 
Leçon 1Structure HTML/CSS & effet parallae
Chapitre 7 : Section NOS OEUVRES D'ART
56m22s
 
Leçon 1Structure HTML/CSS & images responsives
Leçon 2Mise en place du slider pour faire défiler les oeuvres d'art
Leçon 3Mise en place d'une Lightbox pour visionner les photos par dessus le site
Chapitre 8 : Section CONTACT
32m44s
 
Leçon 1Footer du site avec les coordonnées & une modale pour ouvrir les mentions légales
Chapitre 9 : Rendre le site RESPONSIVE
1h29s
 
Leçon 1Rendre le site responsive mobile/tablette grâce à Bootstrap et aux Media Queries
Leçon 2Création du menu responsive avec effet d'apparition en slideDown
Chapitre 10 : Animations & Conclusion
33m20s
 
Leçon 1Rajouter des animations au scroll afin de rendre notre site plus dynamique
Leçon 2Conclusion
 
Leçon 1Introduction
04m50s
Leçon 2Installer Wamp pour avoir un serveur local sur votre PC
06m42s
Leçon 3Installation de WordPress
18m38s
Leçon 4Tour d'horizon de l'administration
31m51s
Leçon 5Installation des plugins indispensables à la formation
10m12s
Leçon 6Créer un mu-plugin avec des constantes utiles pour le thème WordPress
09m59s
Leçon 7Créer la base du thème pour qu'il soit reconnu par WordPress
20m14s
Leçon 8Scinder le fichier index.php en plusieurs fichiers : header.php, footer.php ...
06m30s
Leçon 9Mettre en place une redirection permanente et ajouter les hooks wp_head et wp_footer
16m37s
Leçon 10Découverte du plugin ACF et création des champs pour les options générales du site
21m22s
Leçon 11Récupérer ces champs créés dans le template de notre thème
12m34s
Leçon 12VISUEL ACCUEIL Partie 1
14m11s
Leçon 13VISUEL ACCUEIL Partie 2
13m43s
Leçon 14Mise au point sur la version 5 de ACF
14m23s
Leçon 15Partie A PROPOS
34m02s
Leçon 16EQUIPE : Partie 1
09m44s
Leçon 17EQUIPE : Partie 2
31m21s
Leçon 18Partie DEVISE
07m52s
Leçon 19Partie OEUVRES D'ART
31m12s
Leçon 20Conclusion
12m46s

Avis des apprenants

Détail des avis
140
Apprenants
23
Commentaires
5/5
Note moyenne
5/5
23
4/5
0
3/5
0
2/5
0
1/5
0
Eric
Eric
Publié le 02/03/2024
Très bonne formation. J'avais arrêté de faire des sites depuis 7 ans, avec l'évolution je croyais être à la rue mais grâce à cette formation, très bien construite, bien expliqué je me suis remis au goût de jour. Bravo et merci. J'ai hâte de commencer la partie wordpress. Eric
Jonathan Benitez
Jonathan Benitez
Publié le 02/04/2022
Super tuto. Adrien est un super formateur aux explications compréhensible. Il prend vraiment le temps d'expliquer chaque manipulations. De plus, très rapide à répondre dans la section entraide qui pour ma part je trouve que ce nest pas toujours le cas avec d'autres formateur. Si je peut juste me permettre de te suggérer un tuto sur l'intégration d'un site avec e-commerce sur WordPress se serait le top du top. Encore merci pour tes formation. je suis actuellement en formation webdesigner et Jai bien plus appris avec t'es tutos que dans ma formation. Je recommande les tutos d'Adrien les yeux fermer, l'essentiel du métier, la passion et la pédagogie sont bien présente. Jonathan
Adrien Gazaix
Adrien Gazaix
Vraiment merci a toi, c'est des avis comme ça qui donnent envie de continuer à faire des tuto et partager mes connaissances ! Je prend note pour la partie e-commerce ça pourrait être cool en effet 😉 a bientot pour de nouvelles formations !
Membre-2693-2869
Membre-2693-2869
Publié le 26/01/2022
Des explications claires et pédagogiques ainsi qu'un pas à pas bien pensé. J'ai particulièrement apprécié que le formateur s'exprime avec calme et n'hésite jamais à répéter des manips importantes tels les raccourcis clavier. Bravo et surtout merci !
Adrien Gazaix
Adrien Gazaix
Super, merci à toi !!! J'essaie de ne pas aller trop vite c'est vrai pour que tout le monde puisse suivre mes tuto à son rythme, c'est pas simple mais je pense que ma mission est réussie ;) A très bientôt sur d'autres tuto !

Vos questions sur le cours

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

WordPress 4, Affinity Designer

Quel est le niveau requis pour suivre ce tuto ?

débutant

Attendez ! 🤗

Accédez à plus de 1330 tutos gratuits

Notre politique de protection des données