Le mois de décembre est arrivé et il semble que nous soyons enfin en train de boucler l'année 2011. Cette année a été remplie de nouveaux fronts passionnants pour le Web. CSS3, HTML5 et responsive design étaient au sommet des sujets les plus discutés. Nous marquons également le passage des anciennes manières. Les plugins propriétaires Flash, Silverlight et similaires ont reçu un assaut total en 2011, une attaque contre laquelle ils pourraient ne jamais se remettre.
Pour clôturer l’année avec une rétrospective informative, nous avons parcouru le Web à la recherche de modèles et de tendances qui sont apparus ou qui sont devenus de plus en plus populaires tout au long de 2011. Suivez la piste pendant que nous examinons plus de cinquante sites Web pour tenter de relever des astuces et des thèmes similaires. Je vous garantis que ce sera difficile à lire sans déceler quelques tendances sur lesquelles vous avez sauté dans vos propres projets cette année!
Top tendance: Responsive Design
En 2010, Ethan Marcotte a inventé le terme Conception sensible et a écrit un article éclairant et persuasif à ce sujet sur A List Apart. À la mi-2011, Responsive Design était complètement devenu la nouvelle tendance en matière de conception de sites Web.
Ce n'est pas un simple phénomène de style comme les autres de cette liste, c'est une nouvelle approche de la création de contenu sur le Web visant à créer la meilleure expérience possible pour le plus grand nombre d'appareils. Bien que certains concepteurs considèrent cette idée comme un travail supplémentaire, de plus en plus nombreux vont jusqu'à dire que si votre site n'est pas réactif, vous le faites mal.
Ici, sur Design Shack, nous n’avons pas l'habitude de parler de responsive design cette année, voici quelques-uns des articles que nous avons publiés sur le sujet:
- 20 exemples étonnants d'utilisation de requêtes multimédia pour une conception Web réactive
- Considérations pratiques sur la conception des sites réactifs
- Comment construire un framework Frankenstein réactif avec LESS
Je pourrais facilement vous fournir plus d'une centaine d'exemples de conceptions réactives qui ont surgi cette année, mais beaucoup d'autres ont déjà travaillé dur pendant des mois pour rassembler de telles collections. Ma galerie de designs responsive actuelle préférée est Media Queries, qui compte plus de 200 exemples!
Le design réactif se démarque définitivement la tendance de conception de 2011, mais il y a quelques autres, beaucoup plus petites tendances qui valent la peine de regarder aussi. Ce qui suit représente quelques-uns que j'ai remarqués.
Lignes en pointillé
Les lignes pointillées ont attiré de plus en plus l'attention des concepteurs en 2011. Bien que parfois rectiligne, le cas d'utilisation le plus typique est un chemin sinueux et sinueux qui attire votre attention et le mène à l'endroit souhaité par le concepteur.
J'ai mentionné cette tendance dans plusieurs articles cette année comme un excellent moyen de créer une ressemblance d'ordre dans un design par ailleurs organique. C'est le moyen idéal pour transformer le chaos en une ligne de pensée facilement compréhensible.
Fondateur Fondateur
Oui!
Boo Bebe
Quartier Vier
AskLela.org
Cercles
J'hésite à mentionner celui-ci simplement parce que je ne suis pas sûr que vous puissiez jamais parler d'une forme de base en tant que tendance de design. Après tout, les cercles ont toujours été présents dans tous les types de design et le seront toujours.
Néanmoins, j'ai certainement constaté une augmentation de l'utilisation des cercles comme éléments de conception principaux. Il est très évident que de nombreux concepteurs ci-dessous ont délibérément choisi les cercles comme étant au cœur de leur thème et s'inspirant de cette idée simple mais élégante. Le résultat est souvent de nature assez organique, mais comme vous pouvez le voir ci-dessous, plusieurs des conceptions sont encore assez structurées et utilisent des cercles disposés en ligne droite tout simplement comme une alternative à la vignette du rectangle séculaire.
Carnette
Lisi Design
Esquisse de pistache
Fondation TaosPuso
Atelier d'anglaisApprentissage de la langue
Air Protect
Ag? Ncia iSee Interactive Group
Décoder
Design élégant
Rakesh
JE SUIS ZAM
Dans ma bulle
Type rétro propre et sophistiqué
Je commence à penser que le rétro est une tendance qui ne mourra jamais. Nous reviendrons toujours sur les styles de conception d'époques révolues avec intérêt et nostalgie. La révélation vraiment intéressante est que les styles de design modernes et rétro évoluent ensemble.
Dans les années passées, les designs rétro et plus particulièrement la typographie impliquaient souvent un look très sale et déprimé, comme ce que vous attendriez de voir sur un t-shirt Old Navy. Cependant, alors que les conceptions nettes et minimales commençaient à s'imposer dans le design moderne, le design rétro a fait un saut similaire dans la sophistication. La typographie rétro de nos jours est chic et propre, sans angoissant. Les ombres sont presque toujours présentes et totalement dépourvues de flou; bon nombre d’entre elles sont composées de lignes diagonales ou d’un autre motif simple, par opposition à une couleur unie.
Big Bite Creative
Beerworks
Urbanoff
Noltedesign
Rubans
L'élément de conception le plus important en 2011 doit être le ruban suspendu verticalement. Cette chose est apparue absolument partout comme une manière bien intégrée de tenir un logo, une icône ou un texte tout en l'aidant à se démarquer de l'arrière-plan.
La forme typique comporte deux points triangulaires à la base, mais les concepteurs ont expérimenté toutes sortes de métaphores de ruban. Un exemple ci-dessous prend même une forme de ruban familière et lui donne une tournure inattendue en le transformant en une poche de chemise.
Changer de nation
GiveBeyond.Me
Communauté Tao
Défi du bol rouge
Marisco Gallego a Domicilio
LoadUp 2012 par PuddleDrop
DigitalSafe
Anhalter des Jahres 2011
Joe, la barbiche
Jopp
Dimanche Meilleurs Sites Web
HarryFord
Studios évier de cuisine
Trois choses
Chaque concepteur sait que trois est un nombre magique et cela a été très évident dans la conception Web cette année. Une technique de mise en page très populaire que vous voyez encore et encore utilise trois sections ou objets de premier plan pour transmettre un processus, une liste de fonctionnalités ou un autre concept.
J'aime beaucoup cette tendance car elle oblige le concepteur à simplifier les informations présentées à l'utilisateur et à les diviser en plusieurs morceaux faciles à digérer. Le résultat est souvent une page très attrayante qui semble à la fois informative et bien équilibrée.
Tabspresso
Cabane dans les arbres
Acres Shady
Sellfy.com
Papier froissé / plié
L'ombre portée a évolué. Cette astuce de conception utilise une simple illusion d’ombre incurvée pour donner à l’objet plat au-dessus de celui-ci une apparence de papier gondolé. C'est un petit mensonge tellement crédible que même lorsque vous savez ce qui se passe, il est difficile de faire voir à vos yeux ce qui constitue vraiment un bord droit. L'ombre permet à votre cerveau de percevoir instantanément une courbe, peu importe à quel point vous le savez bien.
C'est un effet facile à utiliser avec Photoshop ou même CSS. Voici quelques pages qui utilisent efficacement cette tendance:
Alphabétisation2030
Edite Trimestriel
Greenjob
Grilles sans bordure
Une autre tendance visuelle croissante est la disparition de frontières ou de marges sur une grille d'images. Historiquement, nous avons le plus souvent aligné des images dans une grille bien espacée, mais ces jours-ci, il est assez courant de tout simplement les encombrer.
J'aime vraiment ce look car il donne aux images séparées une sensation très intégrée. C'est un exemple de synergie au travail où le tout est plus grand que la somme des parties.
Fuzzco
Ignacio Macri
CARLOS5TO
ROA Produktion
Design diagonal
Notre dernière tendance en matière de conception est l’émergence de conceptions plutôt chaotiques qui exploitent fortement les lignes diagonales. Attendez-vous à voir cette tendance se poursuivre jusqu'en 2012. Pourquoi? Parce que cela représente un changement radical par rapport aux conceptions nettes, très structurées et minimalistes qui ont imprégné le paysage de la conception Web au cours des dernières années.
En regardant en arrière dans l’histoire, vous pouvez clairement voir que les tendances de conception sont réactives. Quelque chose devient cool parce que c'est différent de la norme, alors il devient si populaire que c'est la norme. Ce qui était autrefois rebelle est maintenant chose courante, alors quelqu'un propose une réponse qui représente un départ clair. Par exemple, l'engouement minimal que je viens de mentionner est une réponse au design trop fou, désordonné et coloré des années 1990 (voir: Saved by the Bell). La tendance diagonale actuelle remonte à nos jours tout en conservant une sensation sophistiquée attrayante.
Bleep-Radio
Piropixel
Kikk Festival 2011
David Kopec
Centre commercial des marais
Wixel
Designer Gleb
Qu'avons-nous manqué?
Cela ne représente qu'une poignée des nombreuses tendances populaires en matière de conception de sites Web en 2011. Maintenant, c'est à votre tour de vous aider. Laissez un commentaire ci-dessous et parlez-nous des tendances que vous avez remarquées ou même prises en compte au cours de l'année.
Quelles tendances avez-vous préférées? Lequel avez-vous détesté? Si possible, laissez un lien et montrez-nous un exemple!