Spécialisation en création de sites Web sans code

Mes sources d'inspiration | Juan Mora

Vous trouverez ici les designers qui ont influencé mon travail et je vous expliquerai pourquoi et comment ils l'ont fait.

Mes sources d'inspiration | Filip Felbar

Maintenant, j'aimerais parler de mes plus grandes influences et de la façon dont elles m'ont influencé en tant que créatif.

Mes sources d'inspiration | Jan Losert

Je veux que vous examiniez cinq personnes qui ont façonné mon style ou m'ont permis de continuer à travailler. Et je vais vous dire pourquoi j'aime leur travail.

Mes sources d'inspiration | Mónica Durán

Dans cette leçon, je souhaite partager avec vous quelques-uns des concepteurs Web spécialisés dans Squarespace que je suis de très près. Je vais également vous montrer quelques livres et blogs sur le design et la conception Web en général qui ont été très utiles dans mon processus de formation, et que je continue de consulter fréquemment.

Mes sources d'inspiration | Isa Macías

Pour moi c'est super important d'avoir des références créatives dont s'inspirer au quotidien et d'être en constant apprentissage. Dans cette leçon, je vais vous montrer quels studios et designers me font le plus peur aujourd'hui.

Types de pages de destination

Module 2

Prêt à découvrir comment la narration peut influencer le design ? Juan Mora, fort d’une expérience chez Google, Amazon et YouTube, vous montre comment les techniques narratives peuvent transformer une simple landing page en une expérience mémorable. Passez à l’action avec Figma et commencez à créer des mises en page qui, au-delà de l’esthétique, établissent un vrai lien avec les utilisateurs.

14 leçons (1 h 46 min)

Dans cette leçon, vous découvrirez différents types de pages de destination et je vous apprendrai à identifier celle qui est la plus adaptée au projet que vous allez réaliser.

Qu'est-ce qu'une bonne page de destination ?

Je vais maintenant vous expliquer avec plusieurs exemples comment identifier les éléments qui composent un site web efficace.

Qu'est-ce que la hiérarchie dans le contenu ?

Dans cette leçon je vais vous expliquer comment prioriser le contenu et son importance dans le storytelling d'une landing page.

5 min

Contraste, équilibre visuel et règle des 3 secondes

Enfin, nous allons analyser le rôle que jouent le contraste et l'équilibre dans la navigation d'une landing page. Nous verrons également comment utiliser la règle des 3 secondes à notre avantage.

Le brief et comment enquêter

Le brief est le document qui nous aide à comprendre les besoins du client. Dans cette leçon, je vais vous apprendre à enquêter à partir de l'interprétation d'un mémoire.

Structure du contenu d'une page de destination

Maintenant, je vais vous apprendre à organiser le contenu pour raconter une histoire basée sur les recherches précédentes.

Comment faire un mood board

Dans cette leçon, nous allons voir comment créer un moodboard comme outil d'analyse, d'inspiration et de débogage.

Enfin, je vais vous parler de l'importance de la typographie et je vous expliquerai comment bien la sélectionner pour qu'elle convienne au mieux au projet que vous avez en main.

La bonne typographie

Dans cette leçon, vous apprendrez à prendre en compte le comportement des personnes lorsqu'elles interagissent avec un produit, un système ou un service. Aussi comment utiliser ces informations comme base pour l'organisation de votre histoire avec la structure proposée dans la planification.

Création d'histoire

Mettez tout le matériel sur la toile !

Il est temps de placer sur la toile tous les éléments que vous avez collectés pendant le cours pour commencer la conception de votre landing page. Dans cette leçon, j'explique comment faire.

Créez les ressources dont vous avez besoin pour votre page de destination

Enfin, je vais vous dire comment créer vos propres assets à partir du matériel que vous trouvez sur internet. Je recommanderai également où les chercher.

Dans cette leçon, je vais vous apprendre à créer le guide de style pour façonner votre page de destination. Il va falloir définir des éléments graphiques et typographiques pour donner cohérence et unité au design.

Définition de conception

Peaufinez votre conception : commentaires

Il est temps de demander des commentaires sur ce que nous avons fait jusqu'à présent. De cette façon, nous pouvons ajuster les détails nécessaires pour obtenir la conception finale du projet de cours.

5 min

Présentation au client

Dans cette leçon, je vais vous montrer comment présenter votre projet à votre client et ce que vous devez prendre en compte pour expliquer les décisions que vous avez prises pour montrer ce que vous avez fait.

Introduction aux systèmes de conception

Module 3

Vous avez parfois l’impression que votre processus créatif devient chaotique trop rapidement ? C’est l’occasion de ramener clarté et cohérence dans vos projets. Découvrez comment les systèmes de design peuvent fluidifier votre processus et sublimer vos créations web. Avec Figma comme outil principal, vous explorerez des structures intelligentes qui font gagner du temps – et valorisent votre travail.

20 leçons (4 h 51 min)

Dans cette leçon, je présenterai un bref aperçu de ce que sont les systèmes de conception et de la manière dont ils sont généralement utilisés. Je vais également expliquer comment mon processus exact fonctionne et pourquoi cela a été bénéfique pour moi.

Comment les systèmes de conception peuvent vous aider à accélérer votre flux de travail

Ensuite, je vais vous donner quelques exemples rapides de la façon dont les systèmes de conception peuvent vous aider à augmenter votre efficacité, en expliquant à quel point les styles et les composants globaux sont utiles.

Présentation du projet et de l'approche

Passons maintenant en revue le projet sur lequel nous allons travailler ! Je vais créer une ventilation générale de ce dont nous avons besoin pour bien démarrer.

Configuration du fichier Figma et début des premières explorations 1

Tout d'abord, je vais expliquer comment les systèmes de conception peuvent être créés dans Figma. Ensuite, je commencerai les premières explorations et collecterai quelques composants initiaux.

Configuration du fichier Figma et début des premières explorations 2

Avec ces explorations de conception initiales, nous pouvons jouer avec toutes les idées qui nous viennent à l'esprit. Voyons-en un peu plus !

Extension du système d'explorations et de conception 1

Je continuerai à développer mes conceptions et mises en page, ainsi que le système de conception lui-même. Vous verrez comment j'utilise les composants et les mises en page automatiques, afin que vous ayez une idée de la façon dont cela fonctionne.

Extension du système d'explorations et de conception 2

Une fois que nous avons une idée plus claire de la direction dans laquelle nous préférerions orienter le projet, nous révisons certains de nos choix initiaux et mettons à jour nos styles globaux tout au long des mises en page. Voyons comment mon projet évolue !

Organisation des pages design system 1

Dans cette leçon, je vais passer en revue les composants et les styles que j'ai créés et commencer à les placer sur des pages dédiées pour avoir une première idée de la structure.

Organisation des pages design system 2

Je vais continuer à affiner mes fichiers système de conception. N'oubliez pas que le fait de pouvoir affiner une bibliothèque de système de conception à ces premières étapes peut réduire le temps qu'il faudra à la fin du projet lorsque nous préparons tout pour le transfert final.

Exploration de variantes lors de la création de composants

Dans cette leçon, nous allons plonger un peu plus dans les composants ; vous comprendrez comment nous pouvons utiliser des variantes pour développer encore plus notre boîte à outils. Vous aurez également une meilleure idée de la façon dont les conventions de dénomination entrent en jeu dans Figma et où vous pouvez explorer pour voir quelles fonctionnalités vous souhaitez mettre en évidence et auxquelles vous avez facilement accès.

Affiner le système de conception avec une page assemblée 1

Dans cette leçon, nous allons passer en revue une conception plus développée. Maintenant, à ce stade, j'ai traversé quelques itérations dans mes explorations et j'ai atterri dans une direction dont je suis assez satisfait. À partir de là, nous approfondirons la création de composants et de mises en page automatiques. Nous verrons également comment la combinaison de ces outils peut nous aider à créer des flux et des mises en page plus dynamiques.

Affiner le système de conception avec une page assemblée 2

Je vais continuer à affiner le système de conception. Lorsque je travaille avec des sites Web qui ont beaucoup de contenu répétitif, d'index de contenu ou d'archives en général, je trouve extrêmement utile d'imbriquer plusieurs mises en page, composants et instances automatiques les uns dans les autres.

Affiner le système de conception avec une page assemblée 3

Passer un peu plus de temps à créer une seule mise en page avec des composants et une mise en page automatique vous aidera à voir comment différents formats de contenu peuvent fonctionner dans différentes instances. Au cas où nous nous rendrions compte après quelques ajustements que le contenu avec lequel nous travaillons n'est pas en accord avec notre vision initiale, nous pouvons modifier plusieurs instances de différents éléments de contenu en même temps afin d'avoir une meilleure idée de la façon dont notre concept peut être utilisé dans un environnement réel. Voyons comment ce système de conception et ce site Web seront structurés.

15 min

Configuration de nouvelles pages avec le système de conception complet 1

Maintenant, je vais étendre les conceptions Web avec de nouvelles pages : une archive de blog, une page de contact et une galerie de produits. La prochaine étape consistera à tester le système de conception et à voir quels éléments fonctionnent, ce qui doit être changé et ce qui devrait être ajouté.

Configuration de nouvelles pages avec le système de conception complet 2

Après avoir créé une archive de blog et un article de blog, je vais vous montrer comment créer une page de contact. Cela nous permet de voir comment le système de conception que nous avons créé peut nous aider à créer rapidement ces nouveaux éléments.

Configuration de nouvelles pages avec le système de conception complet 3

Ici, vous verrez comment je crée la dernière page supplémentaire, qui est la page de la boutique ou la galerie de produits.

Comment aborder la création de documentation pour le système de conception

Dans cette leçon, je vais passer en revue deux exemples de création de documentation pour un système de conception, en utilisant Notion et zeroheight.

Nettoyer et utiliser une mise en page automatique

Nous prendrons un peu de temps à ces étapes finales pour passer en revue le site Web et le système de conception et nous assurer que tout est correctement configuré et utilise nos notes standard.

Utilisation du design sur d'autres éléments de la marque

Notre système de conception ne doit pas s'arrêter à un site Web. Dans cette leçon, je vais vous montrer quelques exemples d'utilisation du système de conception que j'ai construit comme point de départ pour créer des éléments de marque supplémentaires tels que des publications sur les réseaux sociaux et des articles de papeterie.

Et c'est un enveloppement! Dans cette leçon, je vais passer en revue quelques réflexions supplémentaires sur l'ensemble de ce processus.

Dernières pensées

Introduction au sans code

Module 4

Oubliez les lignes de code — Webflow vous permet de créer des sites web élégants et fonctionnels uniquement grâce au design visuel. Guidé par Jan Losert, vous passerez d’une page blanche à un site marketing complet, en apprenant à concevoir des expériences digitales percutantes pour toute marque à l’aide d’outils intuitifs, sans écrire une seule ligne de code.

21 leçons (5 h 0 min)

Dans cette leçon, je vais expliquer comment les sites Web sont créés, et vous allez explorer Webflow et la bibliothèque de ressources sur Webflow University.

Fonctionnalités principales du flux Web

Explorons tous les panneaux et fonctionnalités fournis par Webflow et créons un projet vierge pour commencer le voyage créatif de ce cours.

Nous examinerons la conception et discuterons de ce sur quoi il est essentiel de se concentrer avant le lancement du projet. Ensuite, je vous expliquerai où obtenir des images libres de droits pour votre projet.

Concevoir

Dans cette leçon, je vais expliquer pourquoi créer une fondation au début de chaque projet et ajouter des polices au projet vierge.

Guide de style

Création d'un guide de style 1

Dans cette leçon, nous commençons à créer ! Tout d'abord, nous allons configurer tous les éléments initiaux, tels que les boutons et la typographie.

Création d'un guide de style 2

Nous allons maintenant continuer à explorer certains boutons et classes combinées.

Commençons par créer la section supérieure de notre site Web avec un téléphone et une rangée d'images.

Section Héros

Dans cette leçon, je vais vous expliquer comment créer le menu de navigation du site Web et comment le rendre réactif. Nous allons styliser le composant appelé Navbar.

La navigation

Sections d'études de cas 1

Maintenant, nous allons créer des cartes illustrées représentant des études de cas du studio et des sections avec des statistiques d'une entreprise.

Nous continuerons d'ajouter des éléments au bloc d'étude de cas.

Section d'étude de cas 2

Je vais vous apprendre à créer une section de collage avec des images et des témoignages dans cette leçon.

Collage Section 1

Nous réutiliserons la section à trois colonnes pour créer un bloc avec les principales valeurs de l'entreprise.

Collage Section 2

Section Clients et formulaire de newsletter simple

Cette leçon se penchera sur la création d'une section clients "nous avons travaillé avec".

Il est temps de créer la dernière section du site - le pied de page.

Bas de page

Nous allons préparer le site pour des fenêtres plus petites dans cette leçon, en commençant par la vue tablette. Je partagerai également quelques conseils pour vous faciliter la vie en utilisant des règles plus strictes pour la largeur de notre conteneur et de notre classe d'emballage.

Fenêtre de la tablette

Fenêtre mobile Paysage et Portrait

Nous allons rendre tout encore plus étroit et nous assurer que le site a fière allure sur les mobiles portrait et paysage.

Nous explorerons encore plus les formulaires et styliserons les états de réussite et d'erreur. Et puis, je vous montrerai où trouver les soumissions de formulaires et ce que vous pouvez en faire.

Formulaires de test

Enfin, rendons le site plus ludique en ajoutant des interactions subtiles pour la section héros. Ensuite, je couvrirai la différence entre les interactions "Charger la page" et "Défiler dans la vue".

Interactions

Optimisation SEO et hébergement

Dans cette leçon, nous verrons comment configurer votre favicon de balises SEO, puis mettre notre site en ligne avec un plan d'hébergement Webflow.

Panneau de maintenance, d'édition et d'actifs

Parlons de l'entretien. Je vais vous montrer comment préparer le site si vous souhaitez travailler avec plus de personnes à l'avenir et garder votre projet bien rangé et organisé.

Je vais vous montrer comment fonctionne le CMS dans la boîte à outils Webflow sur un simple blog. Ensuite, je discuterai de la manière de créer des collections et d'utiliser les données dynamiques sur des pages statiques par rapport aux modèles de collection.

Explorer le CMS

Définition de l'objectif et de la structure de notre site Internet P1

Module 5

Couleur, structure et stratégie se rejoignent alors que Mónica Durán vous guide à travers la liberté créative de construire votre propre site avec Squarespace. Grâce à ses conseils, vous découvrirez comment créer un espace numérique à la fois personnel et professionnel — sans coder. Débloquez des outils et des techniques pour concevoir un portfolio qui parle de votre travail et attire le bon public.

28 leçons (6 h 13 min)

Pour concevoir un site Web fonctionnel (et attrayant), il est important d'être très clair sur l'objectif que nous voulons qu'il nous aide à atteindre, car c'est sur cette base que nous organiserons la structure du site Web et de chacune des pages.

Définition de l'objectif et de la structure de notre site Web P2

Dans cette leçon, nous allons voir des exemples de la façon dont ces objectifs correspondent aux décisions de conception dans le Web et les éléments que nous décidons d'inclure dans notre conception (lesquels et comment).

Le style général de notre site

Maintenant que nous avons créé la structure du Web, nous allons définir globalement le style visuel que nous voulons qu'il ait. Nous allons voir, d'une manière très simple, comment combiner les polices et les couleurs, et je vais vous donner des exemples de la façon dont vous pouvez les utiliser pour créer un style visuel pour votre site Web. Je vais également vous donner quelques ressources où vous pouvez chercher de l'inspiration.

Création, organisation et préparation de fichiers graphiques

Nous avons déjà toutes les ressources graphiques que nous utiliserons sur notre site Web, et un aperçu général de la conception de chaque page ... maintenant nous devons préparer tous les fichiers que nous allons utiliser afin qu'ils soient optimisés pour une utilisation sur le Web , et organisés de manière à ce que nous puissions les trouver facilement lorsque nous concevons dans Squarespace.

Modifications apportées à l'interface du bloc de contenu Squarespace

Dans cette leçon, j'explique brièvement quelques changements récents apportés à Squarespce afin que vous connaissiez les différences entre ce que vous verrez dans l'interface des leçons suivantes et l'interface que vous verrez sur votre site Squarespace lorsque vous le créerez.

3 min

Comment choisir le modèle pour votre site Web

Dans cette leçon, nous allons faire un tour des différents modèles que nous trouvons dans Squarespace lorsque nous allons créer un nouveau site Web. Nous verrons quelles sont leurs caractéristiques et ce que vous devez prendre en compte lors du choix de la bonne pour votre projet.

Paramètres initiaux dans Squarespace

Une fois le compte créé, nous ferons un tour de tout le panneau d'administration de Squarespace afin que vous vous familiarisiez avec les différentes sections: Pages, Conception, Commerce, Marketing, Analytics, Commentaires, Paramètres et Aide. [textbox type=alert]Remarque importante: Après avoir enregistré les leçons de ce cours, Squarespace a publié une nouvelle section dans le panneau d'administration, appelée Profiles ou Profiles . Cette section n'est pas particulièrement pertinente pour le contenu du cours, mais cela vaut la peine de l'explorer un peu car à partir de là, vous pourrez voir et gérer les profils de: - Clients: personnes qui ont acheté sur votre site Web, si vous avez une boutique en ligne installée (et c'est quelque chose que nous ne voyons pas dans le cours). - Abonnés: personnes qui s'abonnent à votre liste de diffusion si vous utilisez l'option native de Squarespace. Si vous utilisez un outil de marketing par e-mail externe (tel que Mailchimp ou Mailerlite), vous ne pourrez pas les gérer à partir d'ici. Vous pouvez trouver plus d'informations sur cette nouvelle section du panneau d'administration Squarespace sur ce lien.[/textbox]

Création de pages dans Squarespace: leurs propriétés et paramètres

Dans cette leçon, je vais expliquer les différents types d'éléments que nous avons dans Squarespace pour créer l '«architecture» du site Web: Pages, Collections (ou Pages de collection), Dossiers et Liens, car chacun a des fonctions et des caractéristiques différentes.

Les blocs de contenu dans Squarespace

Maintenant que vous savez comment la structure générale d'un site Web fonctionne dans Squarespace, nous allons voir comment la structure de chacune des pages est créée et pour mieux expliquer nous allons créer une page à laquelle nous ajouterons différents blocs de contenu, qui sont les éléments qui composent la conception de n'importe quelle page dans Squarespace.

Les sections de page dans Squarespace

Maintenant que nous savons quels sont les blocs de contenu que nous avons dans Squarespace, voyons comment les intégrer à des sections de pages pour créer le design de chacune des pages Web.

Conception et configuration des pages Accueil, Services, A propos de moi et Contact P1

À partir des croquis que nous avons réalisés dans l'Unité 2 et du contenu que nous avons ajouté à notre classeur, nous allons créer les pages Accueil, À propos de moi, Services et Contact, avec toutes leurs sections, textes et images.

Conception et configuration des pages Accueil, Services, A propos de moi et Contact P2

Pour le moment, ne vous inquiétez pas des couleurs ou des polices, car nous ajusterons cela plus tard: l'important est maintenant de créer la structure des pages.

Conception et configuration des pages Accueil, Services, A propos de moi et Contact P3

Sur la page de contact, je vais vous montrer comment ajouter un formulaire et ce que vous devez faire pour inclure le texte et la case nécessaire pour se conformer au RGPD (règlement général sur la protection des données).

Paramètres de la page Portfolio P1

Dans cette leçon, nous verrons comment ajouter un portfolio avec des projets sur le Web. Je vais vous montrer les différentes options de conception dont vous disposez pour votre page principale de portefeuille, comment ajouter de nouveaux projets et les différents ajustements que vous pouvez apporter à des projets individuels.

Paramètres de la page Portfolio P2

Nous allons maintenant voir comment configurer un blog pour votre site Web. Je vais vous montrer les différentes options de conception dont vous disposez pour la page principale du blog, comment ajouter de nouveaux articles et les différents ajustements généraux que vous devez apporter à chaque article avant de le publier.

Paramètres du blog P1

Paramètres du blog P2

Paramètres du blog P3

Création de pied de page et principaux ajustements de navigation

Dans cette leçon, je vais vous apprendre à configurer le pied de page de la page web (pied de page) pour inclure tout ce que nous avons défini dans l'unité 2. Vous verrez qu'il est très simple et très flexible d'apporter des modifications au pied de page de votre site , maintenant que vous maîtrisez déjà les sections et les blocs de contenu de Squarespace.

Définition des polices et des couleurs du site P1

Dans cette leçon, je vais vous montrer les différentes options dont vous disposez pour définir le style des titres, des sous-titres et du corps du texte du site. Vous apprendrez à changer les polices que le modèle apporte par défaut et à faire des ajustements supplémentaires pour modifier les styles différemment de ceux par défaut.

Définition des polices et des couleurs du site P2

Paramètres d'image et autres paramètres

Avec les couleurs et les polices prêtes, nous allons maintenant nous occuper des ajustements d'image et d'autres détails tels que les animations générales du site, l'espacement, les boutons, l'icône du navigateur (favicon), l'image pour les réseaux sociaux, les styles de page spéciaux, entre autres.

Bonus: Styles Web dans Squarespace 7.0

Cette leçon s'adresse uniquement aux utilisateurs de Squarespace version 7.0. Voici comment ajuster les polices, les couleurs et d'autres éléments Web sur un site conçu dans l'ancienne version de Squarespace.

Nous allons voir les éléments que nous avons dans le panneau Squarespace Marketing et je vais vous montrer comment configurer une barre de publicité pour le Web, ainsi qu'une fenêtre pop-up que vous pouvez utiliser pour promouvoir certaines informations ou attirer des abonnés.

Paramètres marketing

Paramètres de confidentialité généraux

Dans cette leçon, je vais vous apprendre à créer les pages légales du site et à les lier dans le pied de page. Je vais également vous montrer comment configurer la barre de cookies et les paramètres que vous devez y apporter, et je vous donnerai une option alternative au cas où vous auriez besoin d'une barre de cookies plus avancée si vous comptez charger des cookies supplémentaires sur votre site Web.

Rendons le site public P1

Enfin, nous verrons les étapes nécessaires pour rendre votre site Web public: les différents plans de paiement de Squarespace, leurs caractéristiques, et celui que je recommande pour un site Web comme celui que nous ferons dans le cours.

Rendons le site public P2

Enfin nous explorerons le panel Analytics du site: je vous ferai un tour d'horizon de ses rubriques et je vous donnerai mes recommandations pour en tirer le meilleur parti.

Suivi analytique du site

Références visuelles : où chercher l'inspiration

Module 6

Donnez vie à vos idées en ligne avec personnalité et intention grâce à Isa Macías, qui vous guide à travers son approche créative du design web. En partant de Figma et en passant à WordPress avec Elementor, vous apprendrez à créer des sites dynamiques, sans code, qui reflètent votre style tout en restant pratiques et faciles à gérer.

18 leçons (3 h 23 min)

Dans cette leçon, je veux vous dire à quel point il est important pour moi de rechercher des références visuelles qui m'inspirent lors du développement d'un projet de conception Web. Je vous dirai également où je trouve et conserve ces références pour toujours les garder à l'esprit pendant tout le processus de conception du site.

Plan du site et guide de style

Maintenant, je vais vous apprendre à tracer l'itinéraire que l'utilisateur empruntera une fois arrivé sur votre site Web, cela vous donnera une idée plus claire des pages que vous devez concevoir et de la manière dont elles sont liées les unes aux autres. Nous verrons également comment créer un petit guide de style dans lequel rassembler les éléments généraux et les styles que nous souhaitons pour le Web.

Préparation de la proposition de conception 1

Une fois que nous avons créé l'ensemble du concept visuel du site Web, nous allons préparer la proposition de conception. C'est l'une des parties les plus excitantes du processus ! Je vais commencer par concevoir l'en-tête, le pied de page et ma page d'accueil.

Préparation de la proposition de conception 2

Je continue à concevoir dans Figma le reste des sections que j'ai définies dans le plan du site. Au cours de ce processus, n'oubliez pas de garder vos références à l'esprit !

Premiers pas dans WordPress

Dans cette leçon, je vais vous apprendre comment installer WordPress et quel est son fonctionnement de base. De cette façon, vous pourrez vous familiariser avec le plein potentiel de ce logiciel.

Nous allons maintenant installer Elementor, qui est l'outil avec lequel nous allons construire toute la conception Web sans avoir besoin d'écrire une seule ligne de code.

Installer Elementor

Nous allons transférer à Elementor tous les éléments et styles généraux que nous avons définis dans le guide de style. Comme nous avons déjà tout pensé et défini dans notre guide, le processus sera très simple !

Connaître Elementor 1

Je vais maintenant faire un bref résumé des configurations que je vous ai montrées dans la vidéo précédente. Ensuite, nous continuerons à configurer et à personnaliser d'autres options telles que le jeu de polices.

Connaître Elementor 2

En-tête et pied de page 1

Dans cette leçon, je vais expliquer ce qu'est le constructeur de thème Elementor et pourquoi j'en suis un tel fan. De plus, je vais vous apprendre à l'utiliser pour concevoir l'en-tête de votre site Web.

En-tête et pied de page 2

Maintenant, je vais vous montrer comment je crée le pied de page de mon site Web avec Elementor. Voyez-vous à quelle vitesse il est de travailler avec ce programme ?

Il est temps de concevoir la première section du web. La page d'accueil est probablement la première page qu'ils verront sur votre site, c'est donc là que j'aime toujours être le plus créatif et visuel.

Page d'accueil

Modèle pour les projets 1

Dans cette leçon, nous allons travailler avec les options de modèle d'Elementor pour créer la mise en page du projet individuel. Et, accessoirement, j'inclurai également tous les projets dans mon portefeuille.

Modèle pour les projets 2

Je vais maintenant vous montrer comment j'arrive à travailler avec la version responsive de mon modèle de projet.

La prochaine chose que je vais vous apprendre à concevoir est la page principale du portfolio, où seront archivés tous les projets que nous téléchargeons sur le Web.

Archives du projet

Enfin, nous allons travailler sur deux sections essentielles sur tout site internet : la page « A propos » et la page « Contact ».

"À propos" et "Contact"

15 min

Pages secondaires : confidentialité, 404 et maintenance

Dans cette leçon je vais parler de certaines sections secondaires de votre site, qui ne sont pas visibles a priori, mais qui sont toujours là. Et je vais également vous apprendre à mettre votre site web en mode maintenance.

Tester et lancer le site Web

Avant de lancer le Web dans le monde, nous allons le tester pour vérifier que tout fonctionne et ressemble à ce que nous voulons. Je t'apprends à le faire !