10 meilleures images des héros du site et création de leurs propres meilleures pratiques

La section héros joue un rôle clé dans la conception du site Web. L’image héroïque du site Web peut avoir un grand impact sur les utilisateurs. C’est la première chose qu’ils ont vu sur le site qu’ils ont visité. C’est le point de départ d’une exploration étrange ou d’une navigation rapide sur le site. Mais qu’est – ce qui donne aux héros le pouvoir de créer ou de détruire des sites Web? Quel est le rôle de cette image dans un site Web? L’image héroïque est le premier (et le plus important) élément que les utilisateurs voient lorsqu’ils visitent le site. Par conséquent, l’image du héros n’est pas seulement un élément de conception en termes de positionnement et de taille, c’est un outil de communication puissant.
Nous allons voir des exemples de sites Web où l’image héroïque a fait du site un succès. Cela a conduit à l’objectif fixé. Donc, en bref, Image héroïque du site Web: attirer l’attention des utilisateurs, ajouter des facteurs de persuasion émotionnelle, permettre aux gens d’interagir avec le contenu du site Web, accueillir les visiteurs avec des informations étroitement liées à la personnalité de la marque Résumé du contenu du site Web Images annoncent ce que les visiteurs verront dans les sections suivantes Qu’est – ce qu’un héros de la proposition de valeur unique de l’entreprise?
Voyons ce qu’est un héros et ce qu’il contient. Le héros du site est l’image d’introduction en haut de la page du site. Il s’agit généralement d’images, mais aussi de textes (titres, sous – titres et exigences d’action). Lorsque vous organisez des projets dans cette section de la page du site, vous devriez tenir compte de certaines pratiques exemplaires pour les images de héros du site. Dix des meilleurs héros du site dans les projets réussis, nous dressons la liste des 15 sections les plus attrayantes du site:
66 Nord Ce héros correspond au thème du site: destinations nordiques. Afficher
66 nord offre une diapositive pour chaque destination. Ces images sont pertinentes et expressives. Veuillez visiter le site plus loin. Il s’agit d’un bref résumé des destinations choisies par l’entreprise qui méritent d’être examinées. Le texte (titre et sous – titre) est centré, l’accent étant mis sur le message principal. De plus, au bas de ces images héroïques, une barre de recherche invite les lecteurs à commencer à chercher le type de voyage qu’ils veulent.
Peu de gens C’est un héros encore plus inhabituel, avec peu de texte appliqué. Tout le texte est représenté par un menu court et le logo de l’entreprise. Au bas du héros, la liste des icônes de partage social vous permet de diffuser des informations sur les poco. Le protagoniste est simple et puissant, laissant une impression durable au lecteur. Il accueille les utilisateurs avec une image inhabituelle tout en suggérant une personnalité de marque inoubliable. La couleur correspond à la marque et au logo et crée un contraste parfait entre l’image et le texte.
Mitch Ramen Le héros évoque le site du restaurant. Il inclut également l’intrigue, qui donne une sensation spéciale en haut de cette page. Il semble avoir été créé spécifiquement pour augmenter les commandes et les réservations de restaurants. Tous les autres contenus du site sont basés sur l’image du héros et sont censés augmenter le taux de conversion. Le texte comprend une marque nominative et un court sous – titre informatif qui est utile pour ceux qui veulent essayer l’expérience Mickey Ramen. Pizza dans le coffre. La pizzeria a « montré » ses produits: des pizzas au bois de chauffage, présentées avec éloquence dans Heroes of the scene par un feu en arrière – plan. Le texte contraste bien avec l’image de fond et le CTA est clairement défini dans la page
La couleur positionne la marque comme une marque de luxe dès le début. Ils véhiculent le bonheur et le confort, le pouvoir de la marque. Certaines diapositives ont une certaine luminosité, et l’aspect luxueux de l’hôtel sur la photo est encore plus exquis. Le texte est marqué en blanc et contraste fortement avec le brun foncé brillant sur le fond de l’image. Regarder cette image héroïque donne une impression durable d’un confort, d’un luxe et d’un bonheur irrésistibles.
Docteur. Laura Pewitt Une autre image héroïque de la clinique pour animaux de compagnie: Cette image inspire confiance dans les soins aux animaux et le professionnalisme des services de la clinique pour animaux de compagnie. Toutefois, l’information centrale n’est pas suffisante pour produire l’effet désiré parmi les lecteurs. Cependant, ce message continue d’apparaître au bas de l’image du héros, où les visiteurs peuvent obtenir des détails sur les services de la clinique. Le schéma de couleurs utilise des tons neutres par rapport aux couleurs de l’image du héros. Les héros de l’image jouent donc leur rôle en reliant émotionnellement les utilisateurs à l’entreprise (la clinique pour animaux de compagnie). Woolank. Par rapport à l’exemple précédent, il est plus axé sur le texte que sur l’image sur le site Hero. Il s’agit d’un site Web d’entreprise (explicitement une société de référencement), de sorte qu’il répond davantage à la logique des utilisateurs qu’à leurs sentiments. Il doit être interprété à travers des images et du texte, ce qui explique en grande partie pourquoi choisir woorank est une bonne idée. Dans la section héros du site, le texte est blanc et contraste avec le bleu de l’image de fond. Le design est minimaliste, ce qui signifie que l’analyse avec woorank se concentre sur la lutte contre la concurrence de l’entreprise. Qu’est – ce qui fait de l’exemple ci – dessus une bonne base pour créer l’image héroïque d’un site Web? Il existe quatre types différents d’images héroïques: l’image du produit C
Image contextuelle auteur \/ fondateur exemple 1 l’image contextuelle est une image héroïque d’un site Web. L’image du produit de l’exemple 6 est l’image héroïque du fleuriste. Format générique de nom de domaine. L’exemple 2 utilise des images non contextuelles pour les sites Web Hero. Cela peut également être lié à la présentation du héros de l’auteur dans la première image du site. Selon le type d’image de héros qui convient à votre site, vous pouvez définir plus en détail les meilleures pratiques de recherche associées à ce type de héros. Meilleures pratiques pour les images de produits dans les héros du site si vous êtes sûr que les images de produits fonctionnent le mieux dans les héros du site, Voici une liste des éléments à prendre en considération pour cette image: l’image doit être suffisamment claire pour permettre aux gens de voir les détails du produit et elle doit pouvoir éclairer la haute qualité du produit (dans notre exemple ci – dessus, les fleurs sont des couleurs fraîches et lumineuses). Il devrait y avoir un CTA proéminent à côté (si vous présentez votre produit directement sur le site Hero, il va sans dire que vous voulez que les gens l’achètent) la présentation du produit devrait déduire que l’utilisateur ne perdra pas ses avantages l’image du produit devrait représenter votre entreprise (vous devriez utiliser votre propre image unique) par exemple, vous pouvez vous personnaliser: Pratiques exemplaires pour les images de fond dans le site des héros de caffè Colibri si les images de fond sont la meilleure solution pour le site des héros, vous devriez considérer les pratiques exemplaires suivantes: les images devraient attirer le lecteur et être pertinentes émotionnellement. Les images devraient être claires, Donne une image précise du contexte que vous souhaitez ajouter à l’information et l’image sélectionnée doit mettre en évidence les avantages des services de votre entreprise, ou
Abonnez – vous à des services spéciaux (selon l’emplacement du site) vous devez choisir soigneusement l’image, de sorte qu’elle devrait être pertinente et significative pour l’ensemble du site. L’image contextuelle devrait être parfaitement intégrée dans l’identité de marque de l’entreprise et exprimer avec éloquence des exemples d’identité de marque que vous pouvez personnaliser: Les meilleures pratiques de Colibri yoga pour les images \/ illustrations non contextuelles sur le site Hero si c’est une image non contextuelle, vous pouvez envisager d’insérer des images ou illustrations inhabituelles. Lorsque vous insérez des images \/ illustrations non contextuelles dans le site Hero, consultez les meilleures pratiques que vous devez connaître: N’hésitez pas à essayer les illustrations pour vous assurer qu’elles sont entièrement visibles par des graphiques et des couleurs. Pour éviter la perte d’utilisateurs, assurez – vous que les illustrations que vous choisissez sont facilement liées au texte principal du site Hero. Par conséquent, il n’y a pas d’interruption dans la transmission de l’information à l’utilisateur. Vous pouvez ajouter des éléments à volonté pour attirer l’émotion du lecteur et être suffisamment innovant pour attirer l’attention de l’utilisateur à travers les illustrations. Créez une cohérence entre les illustrations et la conception globale du site Hero (par exemple, à travers le schéma de couleurs). Essayez de vous personnaliser: Dans certains cas, comme le site Portfolio ou le site CV, vous voudrez peut – être inclure une photo de l’auteur sur le site Hero. Meilleures pratiques dans ce cas: les photos doivent être claires et de la meilleure taille avec une image héroïque les photos doivent montrer une personne souriante et confiante l’arrière – plan ne peut que permettre à la personne sur la photo de mieux montrer la description dans le CV \/ Portrait prospectif
Le livre d’ouverture devrait suivre le héros, de sorte qu’il n’y a pas de déconnexion entre la photo du personnage et la description de ses capacités, par exemple (à partir du site CV), que vous pouvez personnaliser avec la photo: Cours Colibri principes généraux pour s’assurer que votre image s’adapte à votre site, à tous les types de héros ci – dessus, Lors de la conception d’un héros parfait pour un nouveau site Web, vous devriez tenir compte des principes suivants: Assurez – vous d’utiliser des images de haute qualité (les images floues ou pixelisées ne sont pas un bon choix: elles montrent un manque de professionnalisme et ne contribuent pas à renforcer la confiance des utilisateurs). Assurez – vous que vos images héroïques ont l’air bien sur tous les appareils (bureau et mobile) et que la qualité de l’image n’a pas changé. Vous pouvez tester différentes versions d’images de héros pour voir quel type de conversion d’image fonctionne le mieux. Les tests A \/ B peuvent vous aider à trouver le meilleur choix pour votre site Hero et à assurer une efficacité maximale des images Hero. Utilisez le texte ci – joint (titre et slogan) pour adapter la section héros de votre site et l’image de votre choix. Utilisez une invitation à agir visible. Les messages d’accueil des visiteurs devraient les guider dans certaines actions: y compris un bouton d’appel d’action visible qui guide l’utilisateur dans l’exécution des actions que vous voulez qu’il fasse. Utilisez le contraste entre le texte et l’image de fond pour dessiner le héros afin que le texte soit suffisamment visible et facile à lire. Si vous créez un contraste insuffisant en sélectionnant une couleur spécifique pour le texte, vous pouvez également changer l’image (par exemple en appliquant une superposition). Gardez à l’esprit l’authenticité lors de la conception: l’image héroïque doit être représentative de la marque et crédible. En bref, le texte devrait contenir des recommandations sur la valeur unique de l’entreprise. Éviter f
Une façon de créer une section héros parfaite pour votre site Web, vous devriez tester deux variantes ou plus pour voir laquelle fonctionne le mieux. De cette façon, vous pouvez maximiser le taux de conversion et vous assurer que vos clients cibles obtiennent vos informations correctement dès le début.