19 approches de la couleur
Avec plus de 9 milliards de sites indexés sur le Web et en nombre, les sites doivent faire plus pour se faire remarquer et encourager les utilisateurs à y consacrer du temps.
Avec davantage de sites Web qui rivalisent pour attirer l'attention des utilisateurs, la couleur devient de plus en plus importante pour que votre page se démarque. Voici quelques sites qui font exactement cela: utiliser des couleurs intéressantes dans des combinaisons inhabituelles pour se démarquer des milliards de sites de couleurs standard sur le marché.
Layrr
Nous savons tous que le contenu vient en deuxième position pour attirer l'attention, et les titres ont été utilisés dans le papier journal pendant des années pour susciter l'intérêt. Layrr utilise un contraste sobre pour y parvenir, et même si vous ne parlez pas français, je vous suggère d'aller voir ce site maintenant, il utilise de petites zones de couleur pour créer un impact sur le fond gris et y parvient dans un design étonnamment beau. Pas étonnant qu'il ait reçu une mention honorable dans le concours de design Awwwards .
Havainas
La page de destination de Havainas , un très grand détaillant de tongs et sandales est étonnamment et merveilleusement coloré, un trait qui s'étend aux pages régionales du site. Le but de ce site est d'illustrer leur style, ainsi que les couleurs vives associées à la chaleur et à l'été, aux vacances et surtout à leurs produits. Bien que la couleur fasse partie de la reconnaissance de leur marque, il est rafraîchissant de voir le site d’une grande entreprise qui a été bien conçue en termes de couleurs, comme vous pouvez probablement le constater par la liste des sites ici.
ColourPixel
En plus d'être brillant et coloré, qu'est-ce qui a vraiment attiré mon attention? ColourPixel le site, était l'utilisation de noir, où d'autres sites auraient utilisé le blanc. La raison pour laquelle le blanc est utilisé est que le contraste entre cette couleur et les autres couleurs est plus facile pour les yeux, et donc plus accessible pour les utilisateurs, mais ici, de plus grandes boîtes noires ont été utilisées pour encapsuler du texte blanc. Cela permet en fait d'attirer mon attention sur le texte qu'ils contiennent, plutôt que sur les boîtes proprement dites dans le cadre de la conception. En dehors de cela, l'arrière-plan du site atteint ce que le concepteur appelle un aspect «ethnique», en utilisant des pixels déplacés pour obtenir un effet de tapisserie. Les Rainbows sont utilisés de manière plutôt gratuite, mais offrent une belle différenciation des couleurs et des accolades subtiles en arrière-plan.
Will Fernandes
Will Fernandes Le site utilise des couleurs nombreuses et variées, tout en se disputant l'attention pour réaliser son style. Il réserve le jaune, l’orange et le blanc au texte et à l’arrière-plan, et évite surtout de les utiliser dans ses œuvres pour marquer une différence par rapport à celle-ci et au contenu. Il offre une option de visualisation en plein écran, qui est recommandée si vous souhaitez voir le travail de cet artiste talentueux et concepteur Web dans un site fantastique avec des animations brillantes. Il a évidemment été travaillé de manière approfondie pour s'assurer que les bonnes couleurs sont utilisées pour l'art et le site tout en se complétant mutuellement.
Ryan Keizer
C'est le premier site que nous avons examiné et qui utilise délibérément des couleurs offensantes et écrasantes conçues pour s'affronter, afin d'obtenir un effet de contraste élevé. Le designer aime tellement utiliser la couleur qu'il a une palette d'inspiration de couleurs au bas du site. Ryan Keizer utilise principalement du jaune, une couleur avec laquelle beaucoup de choses peuvent mal tourner si elles sont mal utilisées, ici avec du cyan et, dans une moindre mesure, du rose, le site entier apparaît. Sur une note finale, le cyan et le rose rappellent très fort les lunettes anaglyphes 3D, utilisant une palette de couleurs qui a été très peu absorbée par nos vies inconscientes, ce à quoi on ne s'attendrait pas normalement mais inexplicablement. deux couleurs ensemble.
Ben Markowitz
Un autre site très discret avec une utilisation très soignée de la couleur, donnant à l'élément interactif du site un aspect usiné. Pour la conception d'un site comme celui-ci, l'utilisation de la couleur de cette manière est inhabituelle, les concepteurs vont généralement dans un sens ou dans l'autre, mais cela ajoute vraiment au titre: Ben Markowitz ', non seulement attirant l'attention, mais offrant une différenciation, en utilisant une palette complémentaire avec une large gamme. Le seul autre usage de la couleur dont je pense que ce site pourrait bénéficier est celui des icônes de réseaux sociaux en bas de page, car elles utilisent toutes des couleurs très neutres et se démarqueraient et seraient un peu plus facilement identifiables.
Câlins pour les monstres
Joe Lifrieri Câlins pour les monstres a le même but que le site de Will Fernandes que nous avons examiné plus tôt, mais le réalise dans un style individuel organique, en utilisant la couleur pour mettre en valeur son style unique. Je suggère fortement que vous jetiez un coup d’œil à certaines de ses autres pages, elles ont toutes un art différent dans le même style éclectique que vous pouvez voir ici.
Tim Bjørn
Contrairement aux autres produits présentés ici, la page d’accueil de ce site se caractérise par un manque de couleur, et en regardant l’autre travail de Tim Bjørn , l'artiste utilise évidemment la couleur très soigneusement et avec parcimonie. Il est très rafraîchissant de voir un site en niveaux de gris simples qui ne semble pas avoir été conçu il y a dix ans! L'œuvre, comme Hugs for Monsters ci-dessus, est très organique et constitue le point central du site, avec des menus discrets et la quasi-totalité de la page de destination consacrée à quelques éléments clés.
Pour usage interne seulement
Ceci est un autre site qui utilise une petite quantité de couleur pour obtenir un contraste élevé avec un site à échelle de gris. En particulier le cas ci-dessous, où la transparence sur le logo crée un rouge terne contre l'image derrière elle. Un autre regard sur Pour usage interne seulement montre que ces gars-là savent comment et quand utiliser la couleur et le font bien.
Laboratoire de conception de méthodes
le Laboratoire de conception de méthodes Le fil de nouvelles innovant utilise la couleur d'une manière nouvelle, pour signifier «l'âge» des informations, avec un système de couleurs chaudes et froides facilement identifiables, sauf que les nouvelles n'existent que dans la section «chaude» de la palette de couleurs. idée de marketing intelligente, peut-être? Néanmoins, il est très facile de comprendre que le rouge est une information ancienne datant de plus de 12 heures et que le jaune est plus récent. Très bien exécuté, et la couleur contribue à la fois à la conception et à la fonction du site, et non pas à ce que l'on peut dire de nombreux sites au-delà de leur navigation. Après l'avoir trouvé pendant la recherche pour cet article, ce site a trouvé sa place dans mes favoris tant pour son contenu que pour sa conception.
DesignWise
Le thème de DesignWise est contrasté par la simplicité, avec une sensation subtile grungy, le rose sur noir fonctionne parfaitement, et l'utilisation d'un blanc cassé pour le contenu du texte compense le rose sans que le contraste soit net contre le noir. Il y a aussi un contraste entre le fond propre et texturé, et de subtiles touches de grunge éclaboussées sur tout le site.
Prius Harmony
Les couleurs de cette infographie sont magnifiquement coordonnées, à la fois pour atteindre la mission évidente de transmettre «l'harmonie» et pour communiquer les sujets liés aux couleurs. Bien que ce soit effectivement un morceau de publicité pour Prius , ça l'emporte bien, et même si vous méprisez Flash, appréciez simplement les couleurs. Ceci est un autre site avec des fonctionnalités en couleur, ne serait-ce que de manière ténue, et l’un des rares qui utilise des couleurs de bloc avec transparence pour créer des variations avec les couleurs combinées de deux ou plusieurs superpositions. vous ignorez les sections laides et mal coordonnées du noir et du marron.
Grille organique
Si vous pouvez pardonner deux sites Flash d'affilée, Grille organique est un beau portfolio qui peut être pardonné par son utilisation incroyable de la couleur dans un menu qui change son schéma chaque fois que vous y retournez. Non conventionnel? Oui. Non coordonné? Définitivement pas. Optez pour les couleurs, mettez le site en mode plein écran et restez pour profiter des incroyables photos et illustrations dans les portfolios, si vous pouvez ignorer les temps de chargement.
Matt Mullenweg
Ce site inspiré de Lichtenstein doit être inclus, ne serait-ce que pour le père de WordPress, Matt Mullenweg Le blog de la ville fait revivre les couleurs de blocs et les hachures croisées du pop art. Le blocage des couleurs primaires peut être merveilleux s'il n'est pas surutilisé, et ce site nous donne un tiret. Il ya une vague de pop art en bas du blog, mais vous ne pourrez pas la regarder longtemps, car Mullenweg a tant de messages que vous ferez défiler à tout jamais!
Vanity Claire
Si vous pouvez regarder au-delà du fait que ce site a une facilité d'utilisation terrible, les illustrations sur chaque page sont incroyablement bien faites. De simples couleurs atténuées deviennent de plus en plus populaires et Claire Le site réussit aussi à se faufiler dans un petit grunge. Ce site se caractérise par une couleur d'arrière-plan de bloc unique différente sur chaque page avec un design simple horizontalement au milieu de la page.
La colle
Un site Web qui a amené la simplicité à un nouveau niveau, La colle enlève tout le contenu au profit d'un sablier magnifiquement exécuté, avec le sable qui tombe vers le haut accompagné du slogan «Save Time». Le site avait plus de contenu avec les magnifiques reflets orange sur le gris, mais il est malheureusement devenu seulement une invitation.
Microsoft
Cela me fait de la peine d’inclure ceci, en tant que fidèle partisan de la pomme, Microsoft La présence en ligne de la société a fait un bond en avant, probablement liée à l’avancée surprenante d’Internet Explorer (il aurait sans doute été embarrassant de voir son site date de son navigateur). L’interface «métro» de Windows 8 basée sur les tuiles a clairement eu une certaine influence, et je dois dire que cela a l'air bien. Comme nous l’avons vu avec Google Chrome, Skype, et maintenant Microsoft, les logos colorés représentent l’avenir, l’époque des dégradés malsains et l’utilisation de la 3D pour les protéger sont terminées.
AdaptD
L'inclusion de ce site a peut-être eu quelque chose à voir avec le fait qu'il me rappelait une sucette de roquette, une friandise préférée des enfants, ou que cela incluait simplement la couleur juste pour le plaisir. AdaptD Un sourire sur mon visage avec le ruban «quelque chose de coloré» en haut du site, pourquoi pas? Un beau bijou dans un site standard mais bien conçu.
ColoRotate
Enfin, nous finissons avec un site qui n'utilise pas la couleur dans sa conception, en fait, la conception du site est incroyablement fade, mais en tant que fonction, l'objectif du site est de vous aider à parcourir et à fusionner les palettes de couleurs. Il semble approprié de terminer sur un site qui utilise la couleur de cette façon, donc si vous décidez que votre site a besoin d'un relooking après avoir lu cette liste, rien ne vous empêche de choisir le schéma de couleurs parfait. ColoRotate Si vous avez envie de lire la théorie des couleurs du 21ème siècle et comment nos yeux perçoivent la couleur, vous trouverez également une page d'information intéressante sur la couleur.
Comment abordez-vous la couleur? Jouez-vous la sécurité ou essayez-vous de vous démarquer? Faites le nous savoir dans les commentaires.