Les dix dernières tendances en matière de conception web que vous devez connaître en 2017

Les palettes et les matériaux vous aident à choisir un schéma de couleurs pour la conception des matériaux. Besoin d’aide pour choisir un schéma de couleurs pour votre site Web? La palette de conception des matériaux fournit un bon point de départ. Duotone est une image en deux couleurs. Nous avons vu beaucoup de ces images l’année dernière et je m’attends à ce que ce style devienne plus populaire en 2017. Des sites comme Spotify utilisent des images à deux tons qui fonctionnent très bien. Comme vous l’avez peut – être remarqué, duotone est un style populaire pour de nombreuses vignettes dans les vidéos YouTube. Le site Web d’Adison Partners tire pleinement parti de bichrome dans la conception du site. Rétro – moderne, qu’il s’agisse d’art pixel, de mise en page rétro ou d’images inspirées des années 80 et 90; C’est à cette époque que le contact entre l’Antiquité et l’époque moderne a eu lieu. Au cours des dernières années, il a eu un impact plus important sur la conception du Web, et de nombreux sites Web utilisent ce style. Le curriculum vitae interactif de Robby leonardi est un excellent exemple de rétro moderne. Il combine un style d’art pixel semi – moderne avec le défilement latéral du jeu vidéo Super Mario Esco. Le site Web de Robby leonardi. Sweet Magnolia gelato a choisi un style rétro mais a utilisé quelques animations accrocheuses. Cela donne au site un aspect moderne tout en conservant le charme du style antique. Le marché noir a également choisi un look rétro combiné à une disposition modulaire. Le site a un charme rustique qui s’harmonise bien avec les offres du marché noir. Cinemaps cinemaps est toujours une photo avec des éléments de mouvement répétitifs. Ils sont devenus de plus en plus populaires ces derniers temps, à juste titre; Les caméras cinématographiques bien faites peuvent être étonnantes visuellement. L’image du film peut être un GIF ou un fichier vidéo. Si le cinemagraphe est de haute qualité, les deux produisent des fichiers assez volumineux. Cinemagraph GIF peut facilement dépasser
3mo, donc vous pouvez considérer la vidéo en streaming.
Vous pouvez voir d’excellents exemples de cinemap sur flixel; Un service d’hébergement pour ce type d’image ou de vidéo. Regardez autour de vous et voyez ce que font les gens. Voici un exemple de nombreux films de haute qualité. Conception des matériaux depuis 2014, la conception des matériaux de Google est en cours sur place. Il repose essentiellement sur le principe du papier et de l’encre, en convertissant sa qualité en format numérique. Par exemple, utilisez des ombres et des bordures pour indiquer ce que vous devriez toucher, comme un bouton. Besoin d’aide pour choisir un schéma de couleurs pour votre site Web? La palette de conception des matériaux fournit un bon point de départ. Au cours des deux dernières années, la conception de matériaux est devenue de plus en plus populaire, créant de nombreux thèmes et modèles pour les CMS et les cadres frontaux comme Twitter Bootstrap. L’une des critiques que vous entendrez au sujet de la conception des matériaux est que de nombreux sites Web construits avec elle ressemblent beaucoup; C’est peut – être trop similaire. C’est parce que le style de conception des matériaux est trop strict, plutôt que d’appliquer simplement les principes. Je m’attends à ce que nous voyions de nombreux projets de réseau plus petits adopter la conception matérielle existante. Non seulement les principes de la conception des matériaux, mais aussi le style ou le thème actuel. Cependant, il se peut qu’une partie de la communauté du design s’oppose activement à la conception des matériaux, ou du moins au style stéréotypé, tout en continuant à appliquer les principes. Un bon exemple de la forme la plus pure de design matériel est le blog de design matériel (surprise, surprise). Vous pouvez voir ici que la plupart des principes de conception des matériaux fonctionnent. Mise en page audacieuse et créative 2016 a été témoin d’une utilisation très créative de la mise en page et 2017 est susceptible de continuer à pousser les limites de ce que les concepteurs vont faire
Croissance annuelle depuis 2013. Je m’attends à une augmentation de l’utilisation de ce format en 2017, ainsi qu’à une augmentation du nombre d’articles sur le sujet. Pourquoi utiliser SVG? La raison principale est que l’image SVG devrait être rendue parfaitement, quelle que soit sa taille. De plus, les images SVG ont souvent de très petits fichiers; Parfait pour votre vitesse de page. Si vous voulez voir SVG en cours d’exécution, ne dépassez pas le logo wpmudev dans le coin supérieur gauche de cette page. Si vous zoomez avec le navigateur, peu importe combien vous zoomez, vous verrez que le logo n’est pas pixelisé. Au lieu de cela, le logo wpmudev reste distinctif et de haute qualité. Flexbox flexbox est un mode de mise en page CSS3 qui est plus efficace et prévisible lorsque vous utilisez des mises en page qui sont affichées avec une variété de tailles d’écran et d’appareils. Flexbox continue de faire l’objet d’une attention soutenue et, comme tous les navigateurs modernes le supportent maintenant, il est probable qu’un plus grand nombre de développeurs frontaux l’utiliseront. Vous pouvez en savoir plus sur flexbox dans notre guide pour en savoir plus sur CSS3 flexbox pour la conception propre et sans hacker de réponses, et sur css Grid pour la conception de sites WordPress modernes. 2016 360 vidéo et réalité virtuelle est l’année de la réalité virtuelle. De nombreux écouteurs de jeux VR ont été publiés et l’intérêt pour la recherche sur la vidéo 360 augmente. J’espère que les concepteurs trouveront des façons intéressantes d’intégrer 360 vidéos sur le site en 2017. Si vous ne le savez pas encore, Google VR view est une api javascript qui vous permet d’ajouter facilement une expérience vidéo 360 degrés à votre site Web. Vous pouvez en savoir plus sur Google VR views ici. Le nouveau film Blair Witch crée une expérience de réalité virtuelle Web interactive à 360 degrés. Il est préférable d’utiliser des écouteurs VR pour les voir sur votre appareil mobile. Microinteractions les microinteractions sont: