Créer une page d'atterrissage avec optimisation du taux de conversion 2022

1. Introduction: Bonjour à tous, et bienvenue dans ce nouveau cours sur l'apprentissage des pages de destination, conçu avec des techniques d'optimisation SEO appropriées. Je rêvais de créer ce cours ultime pour tous ceux qui souhaitent travailler sur l' aspect commercial du design. Nous y sommes. J'espère que ce cours pourra littéralement changer votre vie. Alors, qu'est-ce que c'est, qu'est-ce que nous allons apprendre ici ? La conception Web est donc en fait une combinaison de deux compétences ou secteurs différents. L'un d'eux est le graphisme. Comment utiliser le design, les formes, le texte et les images pour transmettre un message. Et l'autre, c'est le Web. Comment les internautes interagissent sur le Web, quelles expériences utilisateurs et comment développez-vous vos idées de trafic pour les faire fonctionner dans le navigateur. Donc, toutes ces choses sont des choses que nous allons aborder dans ce cours. Vous pouvez vous attendre à apprendre les bases des pages de destination, y compris les éléments supplémentaires tels que la topographie, l'utilisation des couleurs, l'utilisation de mises et l'utilisation d'images, etc. des techniques de marketing telles que la rareté, l'authenticité, la crédibilité. Nous allons également parler toutes les compétences Web, du point de vue de l'expérience utilisateur, de la conception de l' interface utilisateur, et de tout cela fonctionne réellement sur le Web. Dans ce cours, nous allons voir comment gagner de l'argent avec cette compétence. Comment prendre des projets et les réaliser réellement pour les clients. Et, et de l'argent en convertissant un simple NADH et deux plans ciblés convergents, ce qui, si vous planifiez le marketing et la publicité pour votre site Web, votre produit ou service en ligne, vous obtiendrez de bien meilleurs résultats en envoyant votre trafic vers une page de destination dédiée. Et pour cela, vous n' avez pas besoin de connaissances préalables en matière de copyright. Et aussi des compétences jaunes. Il vous suffit de suivre ces instructions simples que je vais aborder dans ce cours. Qui suis-je maintenant ? Si vous ne le connaissez pas, je m'appelle Jay Hair Helmet. Je suis designer UX et j' ai plus de cinq ans d'expérience. À ce stade, j' ai travaillé en tant que designer UX senior une entreprise multinationale pendant tout ce temps J'ai aidé des centaines de propriétaires de petites entreprises, d'agences de design, startups entreprises et différentes maisons de logiciels pour obtenir une meilleure conversion des prospects vers leurs sites Web. Analysez personnellement les dernières périodes à l'aide analyse concurrentielle et expliquez comment ils peuvent améliorer leurs pages de destination afin d'obtenir résultat de qualité et de générer plus de prospects grâce à des techniques de CRO en baisse. J'ai partagé mes techniques et astuces de référencement avec différentes entreprises et entrepreneurs. Et ils sont plutôt satisfaits de ces techniques et ont généré plus de feuilles par rapport aux pages de destination précédentes. Et maintenant, j'ai hâte de vous enseigner ces techniques de marketing et conseils dans mon nouveau cours sur la page de destination. Ce cours est conçu de telle manière que même un débutant qui ne connaît pas la conception Web et qui est novice en matière de conception Web puisse facilement comprendre et utiliser les techniques de conception artistique. Et c'est ce que nous allons aborder à ce sujet, dans le cadre de ce cours. Maintenant, pourquoi devriez-vous vous en préoccuper ? Pourquoi vouloir devenir designer UX ? Comme je l'ai dit, il s'agit d'une compétence très précieuse sur le marché aujourd'hui et à l'avenir. Les sites Web ne mènent nulle part. Peu importe que la plupart des gens soient sur leur téléphone portable. Ils visitent toujours des sites Web, ils font toujours des achats en ligne. C'est pourquoi je vais aborder les techniques de marketing et de vente dans notre conception Web ou notre page de destination. C'est donc à peu près tout pour cette conférence. Rendez-vous à la prochaine conférence. 2. Utiliser les fichiers d'exercice: Dans cette vidéo, je vais vous montrer comment vous pouvez commencer par des exercices physiques. Les fichiers d'exercices de ce cours sont inclus dans cette conférence. Le fichier d'exercices que j'ai chargé contient un fichier Figma. Il contient toutes les ressources utilisées dans ce cours. Veuillez télécharger ce fichier afin que nous puissions poursuivre notre aventure en créant une page d'accueil pour les chaussures avec les techniques de CRO dans Figma. Ce fichier d'exercice que j'ai téléchargé ne contient pas d'effet sur mon fichier, alors suivez-moi tout au long de ce cours. Vous savez donc comment créer votre propre projet Figma. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 3. Quelles sont les pages de destination, y compris mon opinion personnelle ?: D'accord, il existe donc de nombreux types de pages Nanak sur Internet. Il existe de nombreux types de modèles de pages. Mais aujourd'hui, je vais vous présenter quatre types de modèles et de pages de destination très courants en ligne. Vous pourrez ainsi en apprendre un peu plus sur manière spécifique dont vous devez les configurer afin d' avoir le plus grand impact sur les conversions micro et macroéconomiques et développer votre activité en ligne. D'accord ? Donc, le premier dont je veux parler est la page de destination. Donc, si vous ne connaissez pas la page de destination, il s'agit de la page principale de votre site sur laquelle vous souhaitez que les internautes entrent et qu'ils se convertissent. Vous l'utilisez probablement pour optimisation des moteurs de recherche et de nombreux médias payants sur de nombreuses pages. Ils sont spécialement conçus pour les médias payants. Mais si vous le faites correctement, vous pouvez utiliser la même page pour vous classer dans Google. Et vous utiliserez la même page pour les médias payants. Et vous pouvez cibler les mêmes mots clés, et vous pouvez cibler le même public sur ces pages. Plus précisément, comment souhaitez-vous configurer votre page de destination afin d' obtenir les meilleurs résultats ? La première chose à faire est donc d'avoir un titre fort et quelques puces ou un texte. Et quand on y pense, on a envie de penser au test de sept secondes. Donc, dans les sept secondes, si quelqu'un vient spécifiquement dans cette zone, sait-il qui vous êtes ? Connaissent-ils le problème que vous résolvez ? En raison de connaître vos principaux facteurs de différenciation. Et sont-ils suffisamment certains de vouloir cliquer sur le bouton Contact ? Ils veulent entrer en contact avec vous. Également dans la partie supérieure de la page d'apprentissage. C'est sûrement une bonne idée d'avoir une image forte qui correspond spécifiquement à ce groupe démographique. Vous voulez tester différentes choses. Une image est donc excellente si elle correspond à la démographie et à ce que vous essayez de vendre. En plus de cela, vous pouvez également essayer des témoignages. Tu peux essayer, bien sûr. Il y a beaucoup de types de choses que nous pourrions vouloir y intégrer en fonction du type d'entreprise que vous avez. Vous avez donc le titre, le test de sept secondes. Vous avez capturé un type d'imagerie qui parle spécifiquement à cette personne. Et dans de nombreux cas, vous serez en mesure d'obtenir une conversion correcte. À présent. D'autre part, je dois mentionner que cet appel à l'action est très, très important. Donc, en testant la couleur de ce texte, en testant le texte que vous avez, leurs micros font vraiment une grande différence. Les plus courants sont en savoir plus. Test de contact. Maintenant, commencez, obtenez une proposition gratuite. Appelez-nous Vous devez réfléchir aux différentes manières dont les gens voudraient vous contacter. Et vous devez réfléchir au niveau d' engagement dont ils disposent à ce moment-là. Donc, si c'est juste pour en savoir plus, beaucoup moins d'engagement que de nous contacter. Vous devez donc penser que la sagesse est dans l'aventure et tester différents messages, tout en y testant différentes couleurs. Beaucoup de gens adorent le gros bouton orange. Le bouton Pig Oink est fantastique, mais peu importe la couleur, façon dont il s'intègre dans la page, n'est-ce pas ? Ainsi, avec une page Web donnée, vous ne voulez jamais avoir trop de monde ni trop de couleurs. Il y a quelque chose de vraiment très important. Vous voulez que l' appel à l'action principal soit l'élément le plus brillant de la page. C'est là que va aller l' œil. Et vous verrez que si vous installez éléments tels que des cartes thermiques appelées Content Analytics, cela qui attire le plus d'attention. Donc, au fur et à mesure que vous avancez dans la page, vous devriez vous demander : « Eh bien, d' accord, donc ici, je lui ai donné mon meilleur argumentaire, œil droit sur , d' accord, donc ici, je lui ai donné mon meilleur argumentaire, le deuxième test du saumon, j'ai fait du bon travail, mais Je ne les ai pas entièrement vendus. Alors, qu'est-ce que tu vas faire ensuite ? Eh bien, c'est une personne qui a besoin de plus d'informations. Donc, au fur et à mesure que vous avancerez dans la page, demander quels sont les principaux modules qui vont inciter cette personne à se convertir ? plupart du temps, c'est une question de crédibilité. Avez-vous donc figuré dans de grandes industries, des publications ou des publications nationales ? Ce sont des témoignages. Vous avez des témoignages de clients spécifiques qui apportent ce niveau de crédibilité. Si vous avez 1 000 avis sur le processeur, vous savez, faire confiance à Pilot ou quelque chose comme ça, où vous apportez et vous pouvez montrer ce niveau de crédibilité. S'agit-il de FAQ où vous répondez à des questions spécifiques que cette personne se poserait pour que le couple T. Et que vous essayez de le découvrir sur d'autres pages de votre site Web. J'adore mettre des FAQ. Est-ce un article de blog ? Est-ce que ce sont des récompenses, vous savez, qui renforcent cette crédibilité ? Et vous en tant qu'expert en la matière ou votre entreprise en tant qu'expert en la matière, afin qu'ils souhaitent se convertir. S'agit-il d'une inversion du risque ? Si vous ne connaissez pas le concept d'inversion des risques, c'est l'idée que si vous avez déjà souscrit une garantie de remboursement de 30 jours. L'inversion des risques est énorme pour inciter les gens à s'engager, car cela les amène à éliminer complètement les obstacles à l'entrée dans votre entreprise. Ainsi, lorsque nous pensons à une page de destination, vous devez réfléchir à tous ces différents éléments et la tester en permanence. Je ne peux pas vous dire combien de fois les gens vont simplement quitter cette zone. Ils sont les mêmes depuis des années et des années. Pensez à l'argent que vous pourriez gagner simplement en abandonnant des objets et en augmentant ce taux convergent, un ou deux pour cent. Surtout si vous diffusez dizaines de milliers, des centaines de milliers, des millions de médias payants chaque mois, soit une hausse de 1 %. C'est important pour l'entreprise. Absolument substantiel. J'ai partagé mes techniques et astuces de référencement avec différentes entreprises et entrepreneurs. Et ce sont des techniques assez satisfaisantes qui ont généré plus de feuilles que les pages de destination précédentes. Maintenant, j'ai hâte de vous enseigner ces techniques et astuces de marketing et de vente sur ma page de destination. L'optimisation du taux de conversion est l'une des choses les plus amusantes soient lorsqu' on la voit réellement fonctionner. D'accord, nous avons donc parlé de pages de destination, et je pourrais évidemment approfondir la question. Mais pour cette vidéo, je voudrais simplement vous donner un aperçu des pages des cliniques, ce que sont les pages de destination et de la manière dont elles vous aideront dans votre activité. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 4. Configuration de la grille pour la page d'atterrissage: Bienvenue à nouveau, étudiants. Dans cette vidéo, nous allons configurer une page de destination payante. Tout d'abord, créez un cadre en appuyant sur la touche F de votre clavier. Et sur le bureau. Dans la liste déroulante, choisissez 14, 40 x 1024 images. Renommez le cadre pour afficher la page de destination. À présent, dans l'inspecteur des propriétés, cliquez sur cette option de couche. D'ici. Choisissez des colonnes. Ensuite, remplacez le compte par 12, sa marge latérale par 160 pixels. Et c'est essentiel pour 24 ans. Maintenant, appuyez sur Shift plus r depuis votre clavier pour afficher les règles. Ensuite, ajoutez une règle à gauche et une à droite. Ajoutez également une règle en haut d'une hauteur de 80 pixels, qui correspond à l'espace alloué à notre en-tête. C'est ainsi que vous configurez une grille pour une page de destination. Rendez-vous dans la prochaine vidéo. Nous allons voir un brief de conception. Ensuite, nous examinerons en profondeur la section de notre page d'accueil consacrée à l' acquittement du héros. 5. I. de section d'en-tête et de héros: Dans cette vidéo, nous allons créer la section en-tête et héros de notre page de destination. Mais avant cela, permettez-moi vous donner un bref aperçu du brief de design Four. C'est donc notre vision du design. Vous pouvez voir ici le nom de l'entreprise, la description de l'entreprise, les livrables de conception et la date limite du projet qui ne sont pas des livrables. Vous verrez que le client souhaite créer une page de destination, des défauts et un site Web. La page de destination doit être un CRO optimisé afin qu'il puisse générer plus de prospects et d'affaires. Passons maintenant à notre ami. Ici, nous allons concevoir l'en-tête de notre page de destination car il s'agit de la page de destination. Je ne vais donc pas concevoir le logo de cette page de destination. Je mets juste un logo générique ici. Ensuite, sur le côté droit de la barre de navigation, je vais placer une icône de navigation de douze cercles sur 12 avec une icône de panier, car il s'agit d'une page de destination de commerce électronique. Il s'agit de la palette de couleurs que nous utilisons sur notre page de destination. Et les formulaires que nous allons utiliser dans cette langue ou les conflits jouent à l'hébreu. Nous avons maintenant conçu l' en-tête de notre page d'apprentissage. Appuyez sur la touche L et ajoutez une ligne séparée en dessous, puis changez également sa couleur en rouge. Passons maintenant à notre section consacrée aux héros. Dans la partie gauche de notre section consacrée aux héros, nous allons écrire la proposition de valeur avec une petite description du produit. Ensuite, nous allons ajouter la taille et le type de produit car il s'agit d'une page de destination pour les chaussures. Nous allons maintenant ajouter un CTA, c' est-à-dire que nous devons être bien en évidence, sorte que nous dessinons un rectangle de 295 sur 64. Remplissez avec sa couleur radiale noire. Changez le rayon de bordure de ce rectangle sur quatre. Ensuite, ajoutez une icône de panier d'achat ici. Copiez cette icône depuis les fichiers d'exercices. Maintenant, ajoutez un texte CTA et le prix du produit. Cela attirera donc l'attention de l' utilisateur. Ce n'est pas pour rendre ce CDM attractif, nous allons y ajouter une ombre. Il suffit donc de cliquer sur cet arrière-plan CTF. Et dans le panneau Propriétés, cliquez sur cette étape de l'effet et choisissez Supprimer l'ombre à partir d'ici. Maintenant, dans les propriétés de l' ombre à déposer , mettez l'axe x à zéro, accédez à 39 couleurs pour cette couleur. Et son opacité à 40  % devrait être de 53, et son écart devrait être de -20. Ensuite, nous allons ajouter l'authenticité, afin d'ajouter une note et un correctif de paiement biaisé, copier la page à partir des fichiers d'exercices et de la coller sous ce bouton CTA. Ensuite, j'ai publié un témoignage sous cet onglet d'authenticité. Donc, pour ajouter un témoignage ici, dessinez un rectangle d'environ 395 sur 70 pour le arrondir. Mais tu dois soutenir un rayon. Ensuite, ajoutez un trait de 0,7 et des pixels autour de cette forme. Maintenant, dans cette forme sur la gauche, ajoutez les étoiles écrites par l'utilisateur. Copiez les étoiles des fichiers d'exercices et placez-les ici, au centre , à droite, avec un témoignage générique sur votre droite. L'image. Maintenant, alignez-les correctement avec la cisaille. La colonne de gauche est prête. Nous allons maintenant ajuster les espaces de notre colonne de gauche car nous travaillons avec un système de grille à huit colonnes. Nous allons donc ajuster notre design en conséquence. Huit colonnes, cela signifie que vous définissez l'espace dans les multiples de huit. Disons 8162430 à 40. Après cela. Passons au côté droit de notre section consacrée aux héros. Ici, nous allons ajouter une volonté forte qui justifiera notre proposition de valeur. Sur le côté droit pour un rectangle blanc d' environ 614 sur 61, médiocre. Placez-le ici. Ajoutez un trait de cette couleur d'une magnitude de cinq. Ensuite, j'ai mis trois lèvres sur ce cercle, qui sera un château pour notre produit. Maintenant, ajoutez une autre ellipse à l'intérieur de ces vies blanches. Changez sa couleur en jaune. Ensuite, ajoutez quelques caractéristiques sur ce cercle ou rectangle jaune d'environ 239 sur 73. Ajoutez un visuel de chaussure avec cette fonctionnalité. Alignez-le correctement. Sélectionnez maintenant le stylo et tracez une ligne courbe d' environ 80 x 4 %. Et après ça, c'est vrai, 360 degrés de surpoids. Placez maintenant l'image principale sur le cercle CRO. Afficher les images du fichier d'exercices. Ensuite, nous allons ajouter différents angles à cette prise de vue. Pour ça. Dessinez trois rectangles avec un rayon de bordure de 16. Je vais changer la couleur de ces rectangles. D'abord du jaune au vert, et le troisième au violet. Ensuite, sur les images des fichiers d'exercices au-dessus de ces rectangles. Nous allons maintenant l'ajouter à ces images. Pour cela, j'ai introduit trois formes sous ces chaussures. Les images changent de couleur en fonction de leurs parents. Et après cela, conservez leur propriété de flou de couche d'environ quatre. Maintenant, à gauche et à droite de ces images, ajoutez deux carrousels. Ensuite, nous allons ajouter de la crédibilité au point de vouloir ajouter les logos de différents logos de différentes entreprises. Il suffit de placer les logos ici avec un espacement égal. Ensuite, dessinez un rectangle d'environ 11 ou 20 sur ces logos. Conservez la couleur grise rectangulaire de notre palette de couleurs. Enchaînez la couleur du rectangle à dégradé linéaire de gris. Sélectionnez maintenant les rectangles et le logo en cliquant sur le bouton du masque en haut. Vous pouvez appuyer sur Ctrl plus Alt plus n depuis le clavier. C'est ainsi que vous concevez une section dédiée aux héros d' une page de destination avec une préposition de valeur appropriée, un visuel clair, un CTA visible, ainsi qu'une authenticité et une crédibilité appropriées. Voilà, c'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 6. II de la section des TÉMOIGNAGES génériques: Dans cette vidéo, nous allons concevoir une section de témoignages générique, qui augmentera la crédibilité de notre page de destination. Donc, tout d'abord, ajoutez ici un titre d'une taille de 64 pixels. Et placez ce titre au-dessus de ces huit colonnes internes. Ensuite, DrawRectangle d'environ 11, 20 x 640 avec un rayon de bordure de 12 pixels. Dans ce rectangle, nous allons ajouter un témoignage vidéo à cet effet. Il suffit de récupérer l'image dans les fichiers d'exercices et de la placer dans ce rectangle. Maintenant, dessinez simplement une ellipse de 124 x 124 sur ce rectangle et changez sa couleur en rouge. Ajoutez maintenant une icône de jeu au-dessus de cette ellipse. Alignez-les correctement pour que ce bouton de lecture soit plus visible. Ajoutez simplement une couche d'opacité de 24 % sur cette image. Le bouton Play semble donc plus visible. Ensuite, nous allons ajouter deux témoignages sur cette image. Ne dessinez pas un rectangle, remplacez son rayon de bordure par 14 et ajoutez une image CR7 par-dessus. Ensuite, prenez une forme de témoignage dans les fichiers d'exercices, placez-la ici et ajoutez-y du texte. Disons qu'on me regarde faire défiler mes 100 points. Cela ressemble donc à un témoignage. Ensuite, saisissez le stylo et tracez une ligne pointée vers la vidéo. Changez sa couleur en jaune. Cela attirera donc l' attention de l'utilisateur sur la vidéo. Maintenant, il suffit de courber ce témoignage ci-dessus, de le placer en bas à droite de l'image et de changer sa couleur en bleu, tout en modifiant également son texte. Notre section est maintenant complétée par une technique d'optimisation SEO appropriée. C'est cela la crédibilité. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 7. Section des avantages: Dans cette vidéo, nous allons étudier les avantages de notre page de destination. Parce que dans les pages de destination, nous nous concentrons davantage sur les avantages plutôt que sur les fonctionnalités. Tout d'abord, copiez ce titre ci-dessus, déplacez-le vers le bas. L'espacement supérieur de 160 pixels. N'oubliez pas que l'espacement entre les sections est de 160 pixels et que l' espacement les en-têtes de section et la section est de 80 pixels. Ce sont les normes que nous avons définies pour Atlantic Beach. Ensuite, ajoutez une image sur le côté gauche de la section. Copiez l'image à partir des fichiers d'exercices et placez-la correctement ici. Maintenant, ajoutez deux icônes plus sur ces chaussures pour hommes. Ces icônes plus indiqueront cette caractéristique du produit lorsqu'un utilisateur clique sur cette icône plus. Maintenant, sur le côté droit, nous allons ajouter un sous-titre, notre description. Et SATA. Le sous-titre passe à moyen et sa taille à 60, et renommez-le pour qu'il fonctionne comme jamais auparavant. Jane fait un test de Syrie pour voir la collection. Nous allons maintenant ajouter quelques avantages ici. Pour cela, dessinez un rectangle d' environ 534 x 170, modifiez le rayon de sa bordure à 20 pixels, supprimez son remplissage et donnez-lui un trait de couleur rouge. Ensuite, ajoutez une ligne de séparation à l'intérieur du navire. Nous allons maintenant ajouter deux avantages ici. Sur le côté gauche, nous allons ajouter un avantage, un titre et une description. Modifiez la taille du titre et de la description à 16. Ici, j'ai renommé le titre No Soul. Ensuite, ajoutez une icône d'âme de 28 x 28 pixels à l'intérieur de cette ellipse. Copiez cette icône depuis les fichiers d'exercices placez-les ici et alignez-les correctement. ne suffit pas de supprimer l'icône, Il ne suffit pas de supprimer l'icône, le titre et la description, de les déplacer vers la droite et de modifier son icône pour montrer que je pourrais copier ce que je peux à partir des fichiers d'exercices et le placer ici. Ensuite, renommez le titre en Solid Grid. Nous allons maintenant ajouter un CRO, une technique d'optimisation dans cette section. Pour la dette, tracez un rectangle autour de quatre 92 avec un rayon de bordure de 12 pixels. Donnez-lui une touche de cette couleur grise. Ajoutez également une ombre de cette couleur. Maintenant, à l'intérieur de ce rectangle, nous allons ajouter une image utilisateur et un témoignage. Dessinez donc une ellipse d'environ 56 sur 56. Ensuite, insérez une image utilisateur dans cette forme. Pour cela, il suffit de copier l'image des fichiers d'exercices et de la coller dans cette forme. Ensuite, saisissez l'outil de texte et ajoutez des témoignages. Maintenant, pour le rendre plus attrayant, il suffit d'ajouter une icône en forme de cœur en haut à droite du rectangle. Il suffit maintenant de sélectionner tout ce texte avec son groupe de témoignages. Tous ensemble, renommez-le en colonne de droite. De même, faites de même avec l'image. Renommez-le en colonne de gauche. Sélectionnez maintenant ces deux colonnes, alignez-les verticalement au centre et placez-les avec une marge supérieure de 80 pixels. Voilà, c'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 8. IU de la section des nouvelles technologies: Bienvenue à nouveau, étudiants. Dans cette vidéo, nous allons créer une toute nouvelle section de texte. Donc, tout d'abord, dessinez un cadre sur toute la largeur d' une hauteur de 656 pixels. Remplissez-le avec une couleur foncée de notre palette. Ensuite, à partir de la section ci-dessus, copiez cette colonne de droite sans bénéficier, placez-la sur le côté gauche de l'écran et remplacez son titre par une toute nouvelle technologie. Changez également sa description, CTA, et la couleur de son témoignage en blanc. Ici. Remplacez également l' icône en forme de cœur par une icône en forme d'étoile. Toutes ces icônes sont disponibles dans le fichier d'exercices. Ensuite, récupérez l'image des fichiers d'exercices et placez-la sur le côté droit de la bannière. Car notre produit est constitué de chaussures. Il suffit donc de recadrer l'image et de se concentrer sur les chaussures. Après cela. Ajoutez des icônes plus sur ces chaussures et quelques courbes. Les courbes sont courbées avec un stylo et gardez-les de couleur blanche avec une capacité de 50 %. Enfin, tracez une ellipse surmontée d'une ligne droite. Changez les couleurs en rouge. Et changez cette ligne. Et remplacez cette ligne (flèche inférieure par rapport aux propriétés du trait. Cela ressemblera donc à une option de défilement vers le bas. Et maintenant, notre section de texte est terminée. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 9. UI de section de chaussures sur mesure: Dans cette vidéo, nous allons créer et personnaliser votre section chaussures. Tout d'abord, copiez la section de la colonne de gauche ci-dessus et déplacez-la vers le bas avec un espacement de 80 pixels, modifiez le titre, la description. Et dans le CTA, sur une déclaration de crédibilité 100 pour cent différente, sinon travaillée, 48 h icône de rasage à gauche de cette déclaration également. Copiez que je peux former les fichiers d'exercices et les placer correctement ici. Ensuite, modifiez également ce témoignage. Maintenant, sur le côté droit, nous allons ajouter différentes tailles et couleurs de chaussures. Donc, en haut à droite, sélectionnez la taille avec une liste déroulante en dessous, ajoutez un rectangle d' environ 48 x 64, retirez son remplissage et donnez-lui un trait de cette couleur foncée avec une opacité de dix pour cent. Donnez-lui un rayon de bordure d'environ huit pixels. Et pour le rendre plus lisse, il suffit de cliquer sur ces trois points et modifier la propriété de lissage des coins sur 100 %. Ajoutez maintenant la taille ici. Supposons que vous regroupiez ces deux couches , que vous en fassiez trois copies et que vous changiez également leurs tailles. Ensuite, sélectionnez la couche de site, déplacez-la vers le bas avec un espacement de 40 pixels. Renommez le texte pour sélectionner la couleur. Maintenant, dessinez simplement une ellipse de 53 par 53. À l'intérieur de cette ellipse. Encore une fois, créez une ellipse de 38 x 30 pixels. Donnez-lui une touche de couleur blanche. Alignez ces deux ellipses ensemble. Maintenant, faites-en trois copies et déplacez-le vers la droite. Ne les remplacez pas par des couleurs aléatoires pour la couleur de l'ellipse. Ensuite, nous allons ajouter notre image. Il suffit donc de copier l'image des fichiers d'exercices et de la placer ici au centre. Ne vous contentez pas de laisser le stylo travailler et de faire un cercle autour de la chaussure. La chaussure. Et David Recolor. Ensuite, ajoutez une ellipse rouge de 75 x 75 pixels surmontée d'une icône à 360 degrés. Et placez-le au centre. Ainsi, l'utilisateur saura qu' il peut voir la chaussure à 360 degrés grâce à deux flèches situées à droite et à gauche de la chaussure, sorte que l'utilisateur saura qu'elle peut être défilée. Nous allons maintenant ajouter une technique d' optimisation du CRO dans cette section. Tout d'abord, ajoutez une signature Cristiano Ronaldo par-dessus la chaussure. Appuyez ensuite sur la touche T et écrivez autographe exclusif CR7 sur chaque paire. Le téléphone doit être à 16 lumières et de couleur rouge. Ensuite, ajoutez un CTA, patchs de paiement biaisés ici. Il suffit donc de copier le CDA avec pages de paiement corrigées de la section Hero et de le placer ici. Modifiez l'orientation des baies de paiement SQL pour les aligner au centre. Ensuite, ajoutez une flèche, copiez la flèche de notre deuxième section, collez-la ici et retournez-la horizontalement. Ajoutez maintenant les icônes de la fièvre ici, copiez les icônes FIFA depuis Exercise Files et placez-les ici. Enfin, ajoutez ici une couche de texte d'une taille de 24 pixels et renommez-la en partenaire officiel. Ainsi, l'utilisateur saura que la FIFA est notre partenaire officiel. L'espacement que j'utilise dans notre page de destination est de huit pixels. Cela signifie donc que nous utilisons des espaces multiples de huit. Et maintenant, une section est terminée. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 10. Notre interface d'interface de la section de la collection: Dans cette vidéo, nous allons créer notre section de collection. Tout d'abord, copiez ce titre principal de 64 pixels. Placez-le ici avec un espacement supérieur de 160 pixels. Renommez-la en collection. Il doit être placé sur quatre colonnes. En direct sur la chronique. Après cette description de l'annonce sur les sept autres colonnes. Nous allons maintenant ajouter quelques catégories ici. Tout d'abord, dessinez un rectangle d'environ 15 x 60 pixels. Rayon de bordure de 12 pixels. Rendre également son coin lisse en cliquant sur ces trois points. Donnez-lui une touche de cette couleur grise. Maintenant, les parasites qui n'écrivent pas et écrivent des tendances, ajoutez également une icône d'entraînement. Toutes ces icônes sont disponibles dans les fichiers d'exercices. Maintenant, faites-en trois copies et placez-les avec un espacement égal et modifiez également leurs noms et icônes. Maintenant, pour que cet état de cours fasse passer le premier rectangle au rouge, le texte passant au blanc, afin que l'utilisateur sache que cet état est actuellement sélectionné. Nous allons maintenant ajouter différents produits ici. Alors tout d'abord, dessinez un rectangle d'environ 357 pixels à 03:45 pixels avec un rayon de bordure de huit pixels. Rend également tout en douceur. 200 %. Changez sa couleur pour prendre cette couleur grise. Cet œuf, Nike et l'icône préférée de ce panier sur une image de chaussure au centre de cette carte. Pour ajouter, adaptez-vous à cette image pour mieux faire tomber l'ombre. Ajoutez maintenant les étoiles de lecture de l'utilisateur, nom du produit, le produit, l'ancien prix et le nouveau prix du produit d'une réduction pour créer sentiment d'urgence dans les détails de la vue du client, le CTA sur le côté gauche de cette carte, et sur le côté droit un compteur de quantité et une icône de panier sur fond gris foncé. Maintenant, pour gagner du temps, nous allons reproduire cette carte, en faire cinq copies et les placer correctement. Ensuite, nous allons modifier les images des produits et la couleur de ces cartes afin qu'elles puissent être différentes les unes des autres. Donc, à partir de là, j' accélère simplement le processus pour le dire tout le temps. Nous avons maintenant créé toutes nos cartes et notre section de collection est terminée. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 11. II de section Testimonial sur Instagram: Bienvenue à nouveau, étudiants. Dans cette vidéo, nous allons créer une section de témoignages pour Instagram. Tout d'abord, permettez-moi de vous donner un bref aperçu des témoignages. Les témoignages sont un type de preuve sociale qui indique au visiteur que des personnes éprouvant la même douleur ou la même confiance apprécient notre produit. Page de destination. Les témoignages sont efficaces pour une bonne raison. J'aime les argumentaires de vente. Les témoignages sont impartiaux, ce qui permet à votre entreprise d' établir plus facilement sa crédibilité et d'accroître confiance dans les offres d'Atlantic Beach. En fait, des études montrent que des témoignages crédibles augmentent l'intention d'achat de plus de 92 %. Passons donc à notre page de destination et commençons à créer un témoignage d'Instagram. Tout d'abord, ajoutez un titre. Disons plutôt que, obsédés dans la colonne de gauche, nous allons créer notre carte d'instance. Pour cela, tracez un rectangle de 98 x 640 pixels. Donne-moi le rayon d'angle de 60 pixels. Ensuite, sur cette carte, ajoutez une image utilisateur avec un nom d'utilisateur et son emplacement. Ajoutez également un carrousel à trois points, comme sur Instagram, devant cette image utilisateur. Ensuite, ajoutez une image principale d'environ 442 x 386 pixels avec un rayon d' angle de 20 pixels. Ici, son coin a également été lisse. Maintenant, sous cette image, ajoutez un commentaire J'aime, partagez et une icône de favori. Ensuite, écrivez une ligne de texte comme celle de Lucas et 903 autres devant elle. Chez TU, les images. Ensuite, ajoutez un témoignage important avec une date en dessous. Notre colonne de gauche est maintenant complète. Passons à la colonne de droite de cette section. Dans la colonne de droite, ajoutez le titre principal et le sous-titre d'un témoignage. Ensuite, faites confiance au patch Pilot avec des étoiles d'évaluation des utilisateurs. Avec des étoiles d'évaluation des utilisateurs, puis un témoignage d'utilisateur. Ensuite, ajoutez la signature d'un utilisateur, patch certifié de niveau Shu. Ne paniquez pas. Tout cela est disponible dans ces fichiers d'exercices. Enfin, ajoutez les avis des pilotes d'essai sous Dispatch. Copiez le sac depuis Exercise Files et placez-le ici. Enfin et surtout, il suffit d'ajouter Ajouter au panier pour vous asseoir ici avec des pages de paiement en brochettes. Copiez simplement cela de la section ci-dessus et placez-le ici au centre avec un espacement de 80 pixels, sans les aligner tous correctement, et notre session est terminée. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. 12. Témoignage général avec l'interface d'interface de la bannière de la FIFA: Dans cette vidéo, nous allons créer une bannière FIFA avec une section de témoignages généraux. Alors d'abord, dessinez notre rectangle d'environ 11, 20 sur 248. Donnez-lui la couleur radiale rouge. Ensuite, ajoutez un titre et une description. Ajoutez suffisamment de CD ici. Je vais maintenant ajouter trois images ici. Donc, à gauche, à la Coupe de la FIFA, et à droite, il y avait le football avec image sur le net. Copiez ces images à partir des fichiers d'exercices et placez-les correctement ici. Maintenant, descendons et ajoutons un titre avec un espacement supérieur de 160 pixels. Renommez-le en quelques histoires satisfaites. Ensuite, ajoutez des étoiles de lecture utilisateur sous cette rubrique. Dessinons maintenant un rectangle d'environ 14, 40 x 960 pixels. Changez sa couleur en gris clair. Ensuite, nous allons ajouter quelques témoignages d'utilisateurs ici. Donc, pour cela, dessinez un rectangle d'environ 358 par neuf anciens pixels. Changez sa couleur en blanc. Changez également son coin pour le lisser en cliquant sur ces trois points. Maintenant, dessine un autre cadre. À l'intérieur de ce cadre d'environ 333 x 2,4 pixels avec un rayon de bordure de six pixels. Alors que le rayon de la bordure extérieure du cadre doit être de 12 pixels. Cela a donc l'air esthétique. Ici. Jane, ce cadre intérieur passe au gris. Parce que nous allons ajouter quelques images ici en dessous, ajouter une image utilisateur, un nom d'utilisateur et une image vérifiée par notre lot. Ensuite, des étoiles d'évaluation des utilisateurs et un témoignage en dessous. Maintenant, sur la droite, ajoutez quelques virgules inversées ici. Cela ressemblait donc à un témoignage. Faites-en deux copies et placez-les avec un espacement égal. Ensuite, les images, le nom d'utilisateur et les images également. Ajoutez également ici les flèches gauche et droite, ainsi de suite, qui dessinent une ellipse de 40 sur 40. Changez sa couleur en blanc et ajoutez-y une flèche gauche de couleur rouge. Maintenant, faites-en une copie, déplacez-la vers la droite et modifiez son abstraction pour écrire également. Maintenant, sous ce témoignage, ajoutez une ligne de séparation. Je vais donc vous montrer quelques statistiques ici. Tout d'abord, dessinez un rectangle de 61 224 avec un rayon de bordure de 12 pixels. Donnez-lui un trait d' un pixel de couleur grise. Ensuite, ajoutez les étoiles d'évaluation des utilisateurs et le nombre total d'avis. Maintenant, au milieu, nous allons ajouter des barres de progression en pourcentage. Alors tout d'abord, ajoutez une couche de texte de cinq étoiles. En face. Ajoutez un rectangle d'environ 402 18 avec un rayon de bordure de quatre pixels. Dupliquez-le et changez sa couleur en vert Sa largeur doit être de 361. Ensuite, sur une étiquette à 80  %. En face de cette barre de progression, ajoutez une couche X de 10,5 K, qui correspond au nombre total d' utilisateurs ayant attribué une note de cinq étoiles. Faites maintenant quatre copies de cette barre de progression et modifiez également leur couleur et leurs étiquettes X. Enfin, sur le côté droit, dupliquez cette case de gauche ici plus de huit millions de produits vendus dans le monde par an. Et vous deux, ces stars. Client, cette couche de texte correctement, aligne correctement ces couches de texte avec cette zone. Voilà, c'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo, nous allons concevoir ce qui se trouve dans la section boîte. 13. Ce que vous obtenez dans votre commande Section UI ?: Bienvenue à nouveau. Dans cette vidéo, nous allons créer ce qui se trouve dans la section boîte. Donc, tout d'abord, ajoutez un titre avec un espacement supérieur de 160 pixels. Renommez-le en. Voici ce qu'il y a dans la boîte. Ensuite, dessinez un cadre de 11, 20 par 891. Donnez-lui un trait de cette couleur rouge et une couleur de remplissage avec 30 % d'opacité. la colonne de gauche, nous allons ajouter l'image principale et quelques images. Copiez les images secondaires de la section des héros, collez-les ici verticalement et redimensionnez-les en conséquence. Ensuite, dessinez un cadre autour de 4306504, changez son rayon de bordure en 2010, sa couleur en rouge. Rendre également son coin lisse. Ensuite, ajoutez une image principale, copiez cette image à partir des fichiers d'exercices, placez-la ici et alignez-la correctement avec respect. Maintenant, dans la colonne de droite, nous allons ajouter quelques détails sur notre produit. Tout d'abord, avec le nom du produit, puis la note de l'utilisateur, les étoiles, le prix total et le nouveau prix. Ensuite, ajoutez les menus déroulants Select Color et Size. Ensuite, nous allons ajouter un compteur de quantité sélectionné. Pour ça. Tracez une ligne grise, faites-en une copie. Changez la couleur de la ligne ci-dessus en rouge. Ensuite, à une ellipse de 14 x 14 pixels, changez également sa couleur en gris. Faites une copie de cette ellipse, déplacez-la vers la droite et changez sa couleur en rouge. Donnez-lui un trait d'un pixel de couleur blanche. Ici. Donnez-lui également une ombre noire sur son axe Y. Cela semble donc plus réaliste. Ici aussi, ajoutez une couche de texte sur la quantité t avec les modifications apportées lorsqu' un utilisateur change, indique le litre de quantité. Nous allons maintenant ajouter un CTA ici. Il suffit donc de copier le CDF depuis la section des héros et de le coller ici. Faites-le sur toute la largeur. Si vous déplacez le prix et placez le texte et l'icône de suppression au centre de ce bouton. Sous ce bouton, nous souhaitons ajouter une livraison rapide ainsi qu'un lot de notes et de sécurité. Copiez-le à partir des fichiers d'exercices et placez-le ici correctement avec l'espacement approprié. Ensuite, nous allons ajouter une bannière à cet effet. Dessine un cadre de 941 x 188 pixels. Commençons par un espacement des cellules ATP. Changez son rayon d'angle à 20 pixels. Les couleurs doivent être lues. Maintenant, aux informations de livraison ici. Copiez-le donc à partir des fichiers d'exercices et placez-le ici correctement avec un espacement égal. Maintenant, notre section « Le pire dans la boîte » est terminée. C'est tout pour cette vidéo. Rendez-vous dans la prochaine vidéo. Nous allons créer une section FAQ pour notre page de destination. 14. FAQ avec l'interface d'interface de section de pied: Bienvenue à nouveau, étudiants. Dans cette vidéo, nous allons créer une section FAQ avec une section de pied de page. Vous devez tout d'abord copier le titre de section ci-dessus et placer ici avec la marge supérieure de 160 pixels, nous l'avons défini précédemment. Ajoutez une description devant ce texte. Ensuite, descendons et commençons à créer des FAQ. Donc, tout d'abord, dessinez un rectangle d'environ 548 64 et modifiez son rayon d'angle à six pixels Donnez-lui également un trait d'un pixel de couleur rouge. Appuyez maintenant sur la touche T et écrivez la première question. Disons mal et est-ce que nous allons laisser Live reprendre la question de savoir pourquoi le changement fait poids de la police à moyen et sa couleur à cette couleur foncée joue une flèche déroulante devant elle. Copiez-le à partir des fichiers d'exercices et placez-le correctement ici. Regroupez maintenant ces trois couches et faites-en sept copies. Bénissez-les avec un espacement égal de 40 pixels. Maintenant, nous allons modifier les questions ici car le processus est long. J'accélère donc le processus ici. section FAQ est maintenant terminée. Passons à la dernière et dernière section de cette page de destination, qui est la section de pied de page. Donc, pour cela, dessinons un cadre d'environ 14, 42 sur 292. Changez sa couleur en noir. Maintenant, sur la gauche, ajoutez un logo factice, description et des icônes de réseaux sociaux. Ils sont tous disponibles dans les fichiers d'exercices. Placez-les ici. Propriété. Appuyez maintenant sur la touche T, Android a en-tête. Et quelques liens ici, environ trois à quatre liens. Regroupez ces trois couches et dupliquez-les trois fois. Nous allons maintenant renommer ces fins de titre. Donc, à partir de là, je ne fais qu' accélérer le processus. Ensuite, ajoutez une image de patron de chaussure au centre de cette session. Il suffit donc de le copier depuis Exercise Files et placer ici avec une opacité de 8 %. Enfin, dessinez un rectangle de 14, 40 x 50 pour changer sa couleur en rouge. Enfin, appuyez sur la touche T et écrivez simplement le copyright. Et d'accord, réservez le texte. Alignez le centre avec ce rectangle rouge. Nos pages de destination sont maintenant terminées. Rendez-vous dans la prochaine vidéo. Nous allons concevoir une version réactive de la page de destination. 15. Conception de l'interface utilisateur de la version réactive: Bienvenue, étudiants. Dans cette vidéo, nous allons concevoir de manière réactive et proposer une page de destination. Tout d'abord, je vais vous parler des règles de notre espace responsive. Prenons un cadre d' iPhone Pro Max car cela est possible en appuyant sur la touche F de votre clavier et en sélectionnant ce cadre iPhone. Ensuite, configurons notre réseau et les dirigeants seront responsables. Pour cette version réactive. Nous allons utiliser les standards d'iOS. Tout d'abord, cliquons sur ce cadre, puis sur cette icône plus dans le panneau des couches. Ensuite, cliquez sur ces trois points. Et à partir de là, choisissez les colonnes de Disruptor. La plupart d'entre vous savent que pour les versions mobiles, nous utilisons la grille de colonnes. Donc, tout d'abord, écrivez simplement quatre colonnes dans l'onglet Colonne. Ensuite, dans les marges. Si tu ne sais pas, Martin, ce sont ces espaces de gauche à droite. Ces espaces blancs à l'intérieur sont appelés gouttières. Hein ? 20. Vous pouvez également opter pour 24 marges. Mais pour l'instant je vais en écrire 20. Et dans ce cratère, touchez 16 à droite. Mais n'oubliez pas que nous avons choisi un espacement de huit colonnes dans la page Web et la page du membre supérieur. Dans ce mobile fonctionne à nouveau, nous allons utiliser l' espacement de quatre pixels à partir de quatre pixels. Je veux dire, nous définissons l'espacement par multiples de quatre. Et l'espacement que nous avons défini pour n'importe quel pH sera divisé par deux et la version réactive. Cela signifie que si nous avons défini l' espacement entre deux sections, 160 pixels dans la version Web, puis dans la version mobile, vous serez redirigé vers. Nous allons donc définir un espacement de 80 pixels entre les sessions sur mobile, car les écrans mobiles sont petits et nous ne pouvons pas voir mon espacement sur le mobile. Sinon, l'utilisateur doit faire trop défiler la page pour accéder au contenu souhaité et ne pas tester ce que nous voulons. Maintenant, définissons la règle de notre plan. Il suffit donc d'appuyer sur la touche Shift R de votre clavier. Et à partir de là, localisez les règles et placez-les avec cette couche. Ensuite, pour l'en-tête vertical, juste pour un rectangle d' environ 60 pixels et placez une règle en conséquence. Ici, nous allons placer notre section d'en-tête. Ensuite, supprimez ce rectangle et commençons à créer notre en-tête. Donc, tout d'abord, copiez le logo, l'icône du panier et le menu. Je peux créer la page de destination et la coller ici. Et épinglez-les un peu pour qu'ils soient beaux en fonction de l'écran du mobile. Ensuite, passons à notre section consacrée aux héros ici. Tout d'abord, choisissez cette colonne de gauche sur le Web et collez-la ici. Et baissez également leur taille en rose. Et placez-les avec ces règles de gauche à droite. Alignez également la police au centre, car c'est pratique pour les petits écrans. Sur le Web, vous pouvez atteindre un minimum de 60 pixels ou sous-texte. Mais sur le mobile, vous pouvez accéder à, eh bien, pixels minimum. Mais pour l'instant, restons-en à 64 SetText mobile. Ensuite, descendons. Et voici notre image principale. Copiez-le depuis cette page de destination avec tout ce qui l'entoure avec tout ce qui l'entoure et placez-le ici et ajustez-le en fonction de notre note. Ensuite, copiez ce menu déroulant CTA et les détails du témoignage, placez-les correctement ici et modifiez l'alignement pour qu'il correctement ici et modifiez soit centré horizontalement. Enfin, copiez les logos de ces clients et placez-les également ici. Maintenant, je vais terminer la première section. Passons à la section suivante. Ici. Tout d'abord, ajoutez un titre, suffit donc de copier le titre sur il suffit donc de copier le titre sur la page de destination, de le redimensionner à 48 boules et de le placer ici avec une marge supérieure de 80 pixels. Parce que n'oubliez pas que pour un écran mobile, l'espace entre deux sections devient la moitié. Disons que si l'espace entre deux sections est de 160 pixels, il devrait être de 80 pixels sur les écrans mobiles. Ensuite, dessinez un cadre d'environ 388 sur 340. Modifiez son rayon d'angle. Deux objectifs. Ensuite, copiez l'image depuis la page de destination et placez-la ici en appuyant sur le raccourci clavier Alt V. Ensuite, copiez le bouton de lecture et le témoignage et placez-les correctement sur cette image. Sélectionnez maintenant ces témoignages avec cette image et regroupez-les en appuyant sur la touche Ctrl G de votre clavier. Et après cela, placez-le avec un espacement supérieur de 40 pixels. Maintenant, nous allons descendre ici. Ajoutez un titre. Copiez le titre sur la page de destination, collez-le ici et redimensionnez-le à 48, puis placez-le avec un espacement supérieur de 80 pixels. Ensuite, ajoutez une image utilisateur, copiez cette image depuis la page de destination et placez-la ici en la redimensionnant au milieu. Ensuite, sélectionnez les détails de la colonne de droite et placez-les un par un sous cette image. Mais pensez à le redimensionner en conséquence. Maintenant, nous allons descendre ici. Dessinez un cadre de 428 par 945, changez sa couleur en noir. Ensuite, ajoutez d'abord cette image de colonne de droite sur ce cadre, redimensionnez-la en conséquence. Maintenant, sous cette image, choisissez les détails de la colonne de gauche et placez-les en conséquence. N'oubliez pas que notre titre doit être 48, la taille de la description doit être 16 claires, CTA doit être 20 normal. Et laissez le témoignage de 4 à 16. Passons maintenant à la page suivante pour personnaliser votre séance de chaussures. Tout d'abord, dans le titre de la section, description, dans cette colonne de gauche et dans les détails de cette colonne. Après cette annonce Afficher l' image en la redimensionnant vers le bas. Ajoutez ces icônes à 360 degrés et le CTA, arbitraire pour les logos, etc. N'oubliez pas que ce que nous avons placé sur le Web sera remplacé par une ligne centrale sur une vue réactive. Mais ce n'est pas obligatoire. Quoi qu'il en soit, passons à la section suivante, qui est notre section de collection. Ici, ajoutez un titre, quelques étapes de description et de catégorie. Après cela. Ajoutez des cartes à chaussures verticalement. Ajoutez simplement trois cartes ici. Ajoutez simplement trois voitures ici pour le moment. Ensuite, ajoutez un testament contenant tout le CDA après la troisième carte, afin que l'utilisateur puisse la consulter facilement au lieu de la parcourir entièrement. Passons maintenant à notre section suivante, qui est la section des témoignages. Ici. Tout d'abord, ajoutez un titre. Après cela. Sur cette fiche de colonne de gauche, réduisez-la à environ quatre colonnes. Nous allons maintenant ajouter notre bannière FIFA, la mesure du possible. Nous souhaitons donc personnaliser cette session, ce n'est pas obligatoire pour présenter tout ce qui provient du Web sur les écrans mobiles. Ici. Il suffit de dessiner un rectangle autour de 36 x 536 et de changer sa couleur en dégradé linéaire. Pour cela, il suffit de sélectionner ce cadre sur le Web. Appuyez sur Control Alt Z et remplissez ce cadre sur mobile en appuyant sur Control Alt V. Ensuite, ajoutez une description du titre et un CTA verticalement avec un espacement égal. Enfin, copiez cette icône FIFA. Asseyons-nous ici et redimensionnons-le pour faire un quatre par 241 et alignons son centre horizontalement. Regroupez-les maintenant tous ensemble. Passons à la section suivante. Dans le titre de la section, cet utilisateur note des étoiles et des critiques. Ensuite, nous allons ajouter une carte ici. suffit donc de copier la carte depuis le WebView, de la placer ici et la redimensionner en quatre colonnes en haut de cette carte, flèches gauche et droite au centre. La seule chose que j'ai oublié d'ajouter est le fond gris clair. Il suffit donc d'ajouter un fond gris clair derrière cette carte et les flèches. Après cela. Après cette carte, nous allons ajouter la carte d'évaluation des utilisateurs et le total des ventes annuelles de cartes. Copiez-les simplement depuis le WebView et placez-les ici sur 2.2 colonnes. Passons maintenant à ce qui se trouve dans la section encadrée ici. Tout d'abord, ajoutez un titre de section. Ensuite, sur cette image principale sur ces quatre colonnes. Ici, ajoutez ces autres images de chaussures sous cette image principale. Choisissez maintenant les détails de cette colonne de droite et placez-les ici en conséquence. Ensuite, nous allons personnaliser cette bannière. Donc, tout d'abord, dessinez un rectangle autour de 23, 44. Voici ces informations d'expédition et écrites, la disposition des 2.2 colonnes et leur redimensionnement en fonction de l'écran du mobile. Par exemple, remplacez le texte de livraison gratuite 16 supports et la description par 14 absents. Après avoir saisi ces informations d'expédition, commencez la touche L du clavier et tracez une ligne vers le haut ce soir, trois heures, modifiez sa vitesse à 0,5 pixel et sa couleur en blanc, couleur linéaire. Et placez-le au centre de cette colonne de gauche et de droite pour qu'il puisse faire la différence. Êtes-vous donc capable de différencier ces deux colonnes ? Passons maintenant à la section FAQ. Ici, dans le nom et la description de la section. Ensuite, choisissez cette première question sur le Web. Placez-le sur cet écran mobile pour les colonnes. Redimensionnez le texte de la question à 16 (moyen) et modifiez également la position de la flèche. Maintenant, faites-en six copies. Première question. Dupliquez-les avec un espacement des pixels entre eux. Il ne suffit pas de modifier le texte de ces questions. Maintenant, notre section FAQ est terminée. Passons à la dernière section de cette page de destination consacrée à la responsabilité. Ici. Tout d'abord, dessinez un rectangle noir de 14428 avant l'âge de 74 ans. Ensuite, selon votre description locale d'environ deux lignes. Ensuite, placez ces liens de quatre colonnes au format 2.2 colonnes sur Responsive Urgent. Enfin, ajoutez ces icônes de réseaux sociaux après ces éléments. Et ici, dessinez un rectangle d' environ 28 x 50 pixels. Changez sa couleur en rouge. Et sélectionnez ce texte, d'accord, son propre texte, et collez-le sur ce rectangle rouge. Et alignez votre centre verticalement et horizontalement. Notre page d'accueil, agent responsable, est maintenant terminée. C'est ainsi que vous créez une page de destination avec sa version réactive avec des CRO et des techniques d'optimisation appropriées. C'est tout pour cette vidéo. J'espère que ce cours vous sera utile et que vous vous retrouverez dans un autre cours de Figma. Merci d'avoir suivi ce cours.