59,00 au lieu de 85,00

Tuto Bundle Formation WEBDESIGNER : Créer un site OnePage dynamique & responsive avec WordPress, Affinity Designer bundle -31%

59,00 au lieu de 85,00

  • Une formation vidéo de 13h58m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Bundle Formation WEBDESIGNER : Créer un site OnePage dynamique & responsive

ajouter ce cours aux favoris retirer ce cours des favoris

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 !


Tuto composant ce bundle :

  • Créer un site OnePage pour présenter votre activité professionnelle - Partie 1 : LE WEBDESIGN (voir la fiche produit)

      • Intro, grille bootstrap et palette de couleurs 00:14:48
      • Partie ACCUEIL : logo, image de fond et menu 00:28:32
      • Partie A PROPOS : icones, paragraphes, bouton 00:11:56
      • Partie EQUIPE : images, masques, et opacité 00:12:02
      • Partie DEVISE : parallax, masque, ombre portée 00:05:41
      • Partie FOLIO : icones, masques, formes, et effets 00:15:41
      • Partie CONTACT : icones, dégradé, formes 00:12:42
      • Design de la version MOBILE : plans de travail, icone burger, dégradé 00:18:01
      • Conclusion et découverte du design une fois intégré 00:12:03
  • Créer un site OnePage Responsive - Partie 2 : L'INTÉGRATION (voir la fiche produit)


    • Introduction & Préparation

      • Déroulement de la formation 00:12:54
      • Préparation des fichiers html, css et javascript 00:23:12

    • Section ACCUEIL

      • Structure HTML/CSS & positionnement du logo 00:20:14
      • Effet de parallax sur le background & bouton de scroll en jQuery 00:22:56

    • Création du MENU

      • Structure du menu & style css pour le positionner en fixed 00:21:29
      • Animation & fonctionnement OnePage du menu en jQuery 00:13:43

    • Section A PROPOS

      • Structure HTML/CSS & colonnes Bootstrap 00:24:13

    • Section NOTRE EQUIPE

      • Structure HTML/CSS, apparition d'un texte au survol & effets d'opacité sur des images 00:38:03
      • Effet 3D au survol en jQuery 00:07:01

    • Section DEVISE

      • Structure HTML/CSS & effet parallae 00:11:42

    • Section NOS OEUVRES D'ART

      • Structure HTML/CSS & images responsives 00:17:37
      • Mise en place du slider pour faire défiler les oeuvres d'art 00:28:52
      • Mise en place d'une Lightbox pour visionner les photos par dessus le site 00:09:53

    • Section CONTACT

      • Footer du site avec les coordonnées & une modale pour ouvrir les mentions légales 00:32:44

    • Rendre le site RESPONSIVE

      • Rendre le site responsive mobile/tablette grâce à Bootstrap et aux Media Queries 00:29:10
      • Création du menu responsive avec effet d'apparition en slideDown 00:31:19

    • Animations & Conclusion

      • Rajouter des animations au scroll afin de rendre notre site plus dynamique 00:26:38
      • Conclusion 00:06:42
  • Créer un site OnePage dynamique - Partie 3 : LE THÈME WORDPRESS (voir la fiche produit)

      • Introduction 00:04:50
      • Installer Wamp pour avoir un serveur local sur votre PC 00:06:42
      • Installation de WordPress 00:18:38
      • Tour d'horizon de l'administration 00:31:51
      • Installation des plugins indispensables à la formation 00:10:12
      • Créer un mu-plugin avec des constantes utiles pour le thème WordPress 00:09:59
      • Créer la base du thème pour qu'il soit reconnu par WordPress 00:20:14
      • Scinder le fichier index.php en plusieurs fichiers : header.php, footer.php ... 00:06:30
      • Mettre en place une redirection permanente et ajouter les hooks wp_head et wp_footer 00:16:37
      • Découverte du plugin ACF et création des champs pour les options générales du site 00:21:22
      • Récupérer ces champs créés dans le template de notre thème 00:12:34
      • VISUEL ACCUEIL Partie 1 00:14:11
      • VISUEL ACCUEIL Partie 2 00:13:43
      • Mise au point sur la version 5 de ACF 00:14:23
      • Partie A PROPOS 00:34:02
      • EQUIPE : Partie 1 00:09:44
      • EQUIPE : Partie 2 00:31:21
      • Partie DEVISE 00:07:52
      • Partie OEUVRES D'ART 00:31:12
      • Conclusion 00:12:46

Formateur : Adrien Gazaix

Adrien Gazaix a publié 202 tutoriels et obtenu une note moyenne de 4,8/5 sur 59 923 tutoriels vendus. Adrien Gazaix est un formateur certifié tuto.com. Voir les autres formations de Adrien Gazaix

5,0
note moyenne

22
avis laissés
5 étoiles
22
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de btzdjo laissé 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
    "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 !"

  • 5
    avis de membre-2693-2869 laissé 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 !
    "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 !"

  • 5
    avis de membre-8136-1796 laissé le 16/09/2021
    En pLus, c’est une bonne introduction à Affinity Designer

  • 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
Parcours Développeur WordPress
accédez à plus de 1433 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données