Lorsque nous commençons un nouveau projet en ligne, nous devons examiner les les tendances du Web Design de 2016 ou de la prochaine.
Parce que?
Très simple. Nous ne voulons pas que le temps et l'argent investis soient perdus.
Par exemple:
Que se passerait-il si nous ne créons pas un site Web qui fonctionne parfaitement sur les appareils mobiles et les ordinateurs?
Que la usabilidad y por tanto la experiencia del usuario al usar nuestra página web se vería resentida. Lo que nos da como resultado que el Taux de rebond¿Qué es el porcentaje de rebote?Métrica que indica la proporción de sesiones en las que el usuario abandona una página web sin realizar ninguna interacción. Es decir, entra en una página y tras unos segundos en ella, sin clicar en ninguna parte, la abandona.Otras denominaciones: Tasa de rebote, bounce rate Suite aumente y que la tasa de usuarios recurrentes baje.
Comment pouvons-nous le résoudre?
Faire un site Web adaptatif pour s'adapter automatiquement à toutes les tailles d'écran.
Ce n'est qu'un exemple de ce qui peut arriver si nous ne suivons pas l'évolution de la conception Web et ses tendances.
Il est très important de rechercher et de vous documenter avant de vous lancer dans un projet Web.
Peu importe que vous soyez celui qui réalisera le projet ou si vous embauchez une agence de conception Web pour faire le travail à votre place.
Vous devez trouver toutes les informations nécessaires pour ne pas devenir obsolète tout de suite, ou pour vérifier que l'agence que vous engagez est à jour en conception web et que vous ne vous retrouvez pas avec un produit mal fini.
Miguel me ha dado la oportunidad de escribir en su BlogEl término blog se usa para describir un diario virtual en Internet. El autor de un blogger puede publicar posts sobre cualquier tema. Los posts suelen estar presente de forma cronológica. El estilo de redacción de un blog suele ser informal y se escribe en primera persona. No obstante, además son posibles otros estilos, por ejemplo en el caso de los periódicos online, en los que la atención se centra Suite para contarte las les nouvelles tendances du Web Design en 2016.
Ce n'est pas un guide de conception Web que vous devez suivre à la lettre. Chaque projet a des caractéristiques et des besoins différents en matière de conception Web.
Il appartient à chacun de trouver ce qu'il souhaite véhiculer pour réaliser un bon design web.
Vous pourriez aussi être intéressé par:
20 meilleures banques d'images gratuites en haute résolution
Super guide pour créer et optimiser des images et des photos pour un blog ou une page Web [Comprend 5 didacticiels vidéo + PDF]
20 pages pour télécharger des images gratuitement sur Internet
Tendances de la conception Web en 2016
1.- Soyez réactif mon ami
Oui ou oui, vous devez avoir un site Web réactif.
En dehors d'une tendance, c'est une nécessité.
Les visites de nos pages Web à partir d'appareils mobiles sont de plus en plus nombreuses.
Nous avons de nombreuses tailles d'écrans. Nous voulons bien communiquer dans chacun d'eux et que notre site Web soit parfait sur tous les types d'appareils (adaptés aux mobiles).
<noscriptNoScript es un complemento del navegador para Mozilla Firefox, que impide que se cargue en las páginas web contenido como JavaScript, Flash o iFrames. Su objetivo es incrementar la seguridad durante la navegación y quitar la promoción comercial más molesta al cargar sitios web. El términoNoScript tiene un significado distinto en la programación HTML. Cuando JavaScript está desactivado, la etiqueta <noscript> o </noscript> asegura que el usuario pueda ver el Suite>
Photo: Google Webmaster Central
Outre le diseño web responsive es un factor SEO ¿Qué es SEO o search engine optimization? Conjunto de prácticas destinadas a mejorar el posicionamiento de una web en el ranking de resultados de los motores de búsqueda. Al contrario que la estrategia SEM, que contempla la inclusión de enlaces contratados para obtener este objetivo, el procedimiento SEO se ocupa exclusivamente de los resultados naturales (no pagados) localizados por el algoritmo propio de cada buscador. Para esto contempla ajustar Suite Qu'est-ce que Google a pour positionner notre site Web dans les moteurs de recherche?
Puedes comprobar si tu web está optimizada para dispositivos móviles desde este relierConcepto de Dominio¿Qué es un Enlace?En Internet, un link, además conocido como enlace o hipervínculo, es cualquier texto o imagen que se encuentra en una página web y en la que el usuario puede pulsar o clicar para ser dirigido a otro contenido distinto. Es el principal medio de “desplazamiento” en la red, puesto que se encuentra presente en prácticamente cualquier portal que visites a día de hoy, inclusive en Suite:
https://www.google.com/webmasters/tools/mobile-friendly
Comme vous pouvez le voir, la nouvelle conception Web de ce site Web est optimisée pour les appareils mobiles.
2.- Modèles d'interface utilisateur
Les modèles de conception d'interaction pour améliorer l'expérience utilisateur sont à l'ordre du jour. Ils ont toujours été là mais ils sont en constante évolution.
Lorsque nous avons un problème commun, nous devons trouver une solution efficace pour le résoudre.
Cela se concentre sur la conception Web ou la conception d'interface signifie qu'une solution à un problème commun dans le monde de la conception devient la norme.
Vous le comprendrez mieux avec des exemples de conception Web:
- Menu burger. La première fois que vous avez vu ces lignes, vous ne les avez sûrement pas comprises. Mais pour le moment, c'est la première chose que vous recherchez lorsque vous naviguez sur un Web sur nos appareils mobiles. C'était une solution ingénieuse pour afficher les menus de notre site Web sur des écrans plus petits. Comme je vous l'ai déjà dit, la conception Web de 2016 est fortement influencée par les appareils mobiles. Maintenant, il commence à être implémenté afin qu'ils puissent également être vus sur de grands écrans et ainsi avoir le menu de navigation caché pour avoir une vue plus nette du Web.
Exemple de conception Web avec menu hamburger:
Photo: http://silenza.it/
- Longs rouleaux verticaux. Si antes te decían que cuanto menos scrollConcepto de Scroll¿Qué es el Scroll?El Scroll es una definición inglés que se usa para hablar del desplazamiento de los contenidos 2D que se muestran en la ventana de un navegador. Es ese sencillo gesto que el usuario realiza cuando desliza el dedo por la pantalla o usa la rueda del ratón para subir o bajar mientras observa los contenidos de una página.Aún cuando es un concepto que se usa Suite vertical mejor porque los usuarios se suelen cansar ahora son más fáciles de encontrar estos scrolls. Tenemos de dos tipos, parchemins infinis qu'en descendant, ils ressembleront à de nouveaux éléments et rouleaux verticaux bien structurés que a medida que bajas vas pasando por las diferentes secciones de una web, me he llegado a encontrar webs hechas con una única página, sin menús y todo el ContenuEl contenido puede ser muy difícil de definir con precisión. Es una definición que se refiere a las declaraciones contenidas en un documento o publicación de cualquier tipo y puede incluir las tecnologías de la información y la comunicación. Esto cubre todos los tipos de medios como imágenes y texto. A parte de esto, en el campo de la optimización de motores de búsqueda, los términos duplicar contenido, contenido único, Suite va apareciendo con el scroll..
Exemple de conception Web avec défilement infini:
Photo: http://creativecruise.nl/
- Enregistrement du Compte. Ante la proliferación de redes sociales el número de cuentas, de usuarios y de claves para identificarte se ha multiplicado. ¿Qué solución encontraron para solucionar este problema? Seguro que te suena, empezaron a dejar logearse a los usuarios con sus cuentas sociales. Por ejemplo, hootsuiteConcepto de Hootsuite¿Qué es la Hootsuite?Hootsuite es una herramienta pensada para facilitar la labor de administrar perfiles en redes sociales. Es una plataforma que centraliza la gestión de distintos cuentas en Redes sociales. Fácil de usar y con una interfaz bastante intuitiva, posee multitud de funciones pensadas para sacar el máximo partido al lado más social de Internet.Para las empresas, fundamentalmente para los especialistas en Social Media y otras ramas Suite, no hace falta que crees una cuenta nueva, simplemente logeándote con uno de tus perfiles sociales ya puedes empezar a usar su aplicación. De esta forma te ahorras aprenderte un usuario y su clave correspondiente más.
Photo: hootsuite
3.- Animations
Grâce aux améliorations des communications, les bandes passantes permettent désormais d'envoyer davantage de données sur le réseau. C'est pourquoi l'utilisation d'animations dans la conception Web est de plus en plus courante.
Il est de plus en plus courant de voir des vidéos, de petites animations pour mettre en évidence des zones du Web ou de grandes animations pour lesquelles vous avez besoin d'une interaction de l'utilisateur pour montrer une histoire.
Que verrons-nous en 2016?
- Vidéos d'arrière-plan en plein écran. Tout ce sur quoi vous pouvez compter avec une image sera plus facile à retenir qu'avec du texte. Avec ces superbes vidéos, vous parvenez à attirer le lecteur. Problème Je vois que si vous utilisez des images ou des vidéos trop surchargées, vous pouvez distraire l'utilisateur. Donc, si vous l'utilisez, avec modération.
Exemple de vidéo plein écran dans la conception Web:
Photo: http://www.dunckelfeld.de/en/
-
- Utilisation des animations de chargement. Ils ont deux tâches. D'une part, il est conforme à l'un des principes de base de l'utilisabilité Web: afficher à tout moment l'état du système.
- Animations dans les menus, pour rendre les transitions plus fluides. Par exemple, lorsque nous trouvons un menu hamburger et que nous cliquons dessus, le menu complet apparaît.
Exemple de conception web avec animation dans le menu:
Photo: httpEl HTTP (Hyper Text Transfer Protocol) es un protocolo que se usa para transmitir datos en redes. HTTP es un estándar técnico generalmente aceptado que establece cómo un cliente web se comunica con un servidor para que los datos solicitados por el cliente puedan ser cargados y mostrados. Información general Junto con el URL y el HTML, HTTP es uno de los conceptos más importantes de Internet (www). Fue desarrollado Suite://www.etq-amsterdam.com/collection
- Survolez non seulement sur les boutons. Le survol est lorsque nous passons la souris sur un élément. Par exemple, lorsque nous entrons dans un bouton, il change de couleur. Il est également utilisé dans les images pour afficher des textes cachés, ou pour changer l'image, etc. Lorsqu'un utilisateur entre sur un site Web et voit que s'il interagit avec une image elle réagit, il passera instinctivement d'image en image pour voir ce que chacun d'eux fait. On parvient ainsi à fidéliser l'utilisateur.
Exemple de conception Web avec survol:
Photo: http://humaan.com/
- ParallaxeConcepto de Parallax¿Qué es el Parallax?El Parallax es un efecto visual que forma parte del diseño web y que se trata de simular el desplazamiento de los items del fondo de cualquier página para que parezcan dar una perspectiva distinto al usuario mientras este hace scroll por esta. Es algo meramente visual.En Español se le conoce como Paralaje, aún cuando lo más frecuente es recurrir a este concepto por su Suite. C'est une animation qui nécessite une interaction avec l'utilisateur. Ils sont généralement réalisés avec le défilement vertical.
Au fur et à mesure que l'utilisateur descend la page, il affiche des animations qui aident à raconter une histoire ou à afficher le contenu de manière plus conviviale.
Exemple de conception Web avec parallaxe:
Photo: http://vnstar.com.ua/en/
4.- Éléments multimédias
Ce n'est pas en soi une tendance. Mais la prolifération de son utilisation sur le web, vous oblige à le mentionner.
Nous devons nous différencier des autres et nous assurer que les taux de rebond de nos sites sont acceptables. Pour y parvenir, nous devons implémenter l'utilisation d'éléments multimédias dans nos conceptions Web.
L'utilisation de l'infographie est de plus en plus une obligation qu'une suggestion. Ils contribuent à rendre votre contenu viral car ils sont très bien partagés sur les réseaux sociaux.
Si vous souhaitez en savoir plus sur les infographies, je vous invite à regarder la vidéo suivante créée par Claudio Inacio.
En ce qui concerne les images que vous utilisez dans vos conceptions Web, une recommandation: Éloignez-vous des photos d'archives chaque fois que vous le pouvez..
Je ne dis pas de ne pas les utiliser, mais avec autant de blogs ou de sites Web, les sites d'images gratuits en ligne sont à l'ordre du jour. Et par conséquent, vous avez de nombreuses possibilités d'utiliser la même image gratuite que vos concurrents.
Essayez de vous différencier, si vous téléchargez une ressource graphique à partir de ce type de site Web, essayez de la personnaliser pour qu'elle ne soit pas la même.
5.- Conception modulaire
Vous connaissez Pinterest, non?
C'est le meilleur exemple de conception modulaire. Nombreux sont ceux qui ont copié ce système d'affichage des informations. Il est parfait pour afficher de petites informations et être scanné par le lecteur jusqu'à ce qu'il trouve celle qui attire le plus son attention. Ils s'adaptent également parfaitement si vous souhaitez un site web réactif.
6.- Conception plate vs conception matérielle
On voit que tout conduit au minimalisme, c'est une tendance dans tout type de graphisme.
De là est venu le design plat, un design basé sur des couleurs plates et des images simples. Une tendance du design qui est encore bien vivante et qui, je pense, durera encore quelques années.
Surtout parce qu'il est facile à mettre en œuvre dans la conception Web et que l'utilisation de ce type d'images plates génère de petits fichiers lourds. Avec lequel nous améliorons les temps de chargement de nos pages Web.
Exemple de conception Web plate:
Photo: http://flatomedia.com
Mais dans la tentative d'améliorer tout type de conception Web, ils commencent à ajoutez de petites ombres et des dégradés aux motifs. C'est ainsi que le Material Design est né.
Il est de plus en plus courant de voir ces petits détails dans les conceptions Web les plus simples pour mettre en évidence les différents domaines qui les composent.
Exemple de conception matérielle:
De plus, le type de palettes de couleurs utilisées dans ces deux formes de conception est très reconnaissable. Si vous ne voulez pas devenir fou à la recherche d'une palette de couleurs, vous pouvez utiliser ce web pour tester.
7.- Utilisation de polices personnalisées
Parfois, cette ressource graphique n'est pas suffisamment reconnue pour améliorer et mettre en valeur le message que nous voulons transmettre avec notre conception Web.
Énormes polices, majuscules, petites majuscules, italiques gras, vous avez une bonne poignée de possibilités pour mettre en valeur vos textes.
Maintenant, grâce à Google Fonts, nous avons une meilleure chance de trouver la police qui convient le mieux à notre design.
Je pense qu'avec cet exemple, vous verrez mieux l'utilisation des polices dans la conception Web: http://onirim.com/
8.- On revient au rétro
Bon nombre des changements dans les tendances de la conception graphique ont leur origine dans les tendances passées. Il y a quelques années, nous sommes passés à la mode vintage en termes de conception de sites Web. L'inspiration a été recherchée dans les anciennes affiches et dessins des années 20 aux années 50-60.
Maintenant l'inspiration du "rétro moderne" nous fait regarder les années 80, plutôt entre les années 70-90.
Je pense que nous remontons à cette époque parce que de nombreux designers d'aujourd'hui ont grandi à cette époque, et c'est ce que J.
Tant que les épaulettes ne reviennent pas, je reste dans cette tendance.
9.- Les applications inspirent de nouvelles conceptions Web
Si vous êtes arrivé jusque-là, vous aurez remarqué que de nombreuses tendances actuelles sont conditionnées par l'utilisation d'appareils mobiles.
Et au sein de ces appareils, ils sont influencés par la façon dont les applications sont conçues.
Chaque fois que nous verrons des conceptions Web plus simples, sans distractions, avec des menus cachés, du contenu modulaire, etc.
Je suis convaincu que les actions gestuelles vont même commencer à être implémentées sur le web comme s'il s'agissait simplement d'une autre application pour votre mobile.
10.- Convivialité
De plus en plus, nous prenons en compte l'utilisateur dans la conception Web.
Il est prévu que l'expérience avec notre site soit aussi agréable que possible.
Nous recherchons des interfaces transparentes ou ce qui est pareil, que l'utilisateur n'ait aucun problème pour pouvoir se déplacer sur notre site Web.
C'est la fin de la convivialité. Et c'est pourquoi il a de plus en plus de poids dans le design.
Personne ne reviendra sur votre site Web, aussi beau soit-il, s'il n'est pas utilisable.
Nous avons commencé la liste des tendances de la conception Web en 2016 avec lui Conception réactiveEn un diseño responsible, una web se mostrará de forma distinto según el tamaño de la pantalla y/o el tipo de dispositivo, con la finalidad de garantizar la facilidad de uso. Se aplica concretamente a las pequeñas pantallas de visualización de los dispositivos móviles, donde se requiere una representación distinto de la página. Antecedentes El diseño usual de una página web se basa en las pantallas de PC, tal y Suite et nous avons terminé avec le Convivialité Web pour améliorer l'expérience utilisateur (expérience utilisateur UX).
Parce que?
Ce sont les deux axes principaux de la conception Web. Beaucoup d'entre vous peuvent penser qu'ils sont plus que des tendances, de bonnes lignes directrices en matière de design.
C'est peut-être, mais je pense qu'ils ont de plus en plus de poids, et c'est pourquoi nous ne pouvons pas arrêter de les nommer.
Comme je l'ai déjà dit, vous pouvez avoir une conception Web impeccable, la meilleure conception Web en termes d'esthétique. Mais comme la convivialité échoue et ne répond pas, votre conception n'ira nulle part.
Il faut réfléchir plus loin, penser que l'on aimerait qu'il ait un site internet pour ne pas le quitter.
Mieux encore, souvenez-vous des fois où vous avez quitté un site Web sans même le lire car il ne semble pas bien sur votre appareil mobile ou parce qu'il prend beaucoup de temps à se charger.
C'est pourquoi je considère que ce sont les deux piliers de base sur lesquels vous devez forger votre projet web. Le reste des tendances ne sont que cela, des tendances.
J'espère que vous avez trouvé cela intéressant article sur les tendances actuelles de la conception Web. Si c'est le cas, aidez Miguel et moi à le diffuser sur les réseaux.
Quelles sont les tendances de la conception Web qui ont le plus retenu votre attention?
¿Consideras importante hacer un buen diseño web para mejorar la usabilidad y la expérience utilisateurEl término experiencia de usuario (UX) se refiere a la experiencia que un usuario tiene con un producto o servicio. En cuanto a Internet, el término se usa frecuentemente al examinar la experiencia que los usuarios disponen con una web. Esto además puede ser en referencia al uso de un dispositivo smartphone (UX smartphone). Items de la experiencia del usuario La experiencia del usuario y la usabilidad se usan frecuentemente Suite?
Merci à Shutterstock pour avoir fourni l'image. Bloomua.
