“The details are not the details. They make the design.”
?Charles Eames
Tendances webdesign 2017
On ne cesse de le dire, le web est un environnement continuellement changeant, de tous les points de vue (référencement, développement, webdesign…). Tous les ans de nouvelles modes ou techniques apparaissent, certaines juste en rapide coup de vent, d’autres perdurent un peu plus. Nous allons nous intéresser dans cet article aux tendances webdesign qui feront l’année 2017. Voici mes quelques conseils graphiques. En avant !
1 – Des couleurs vives et des dégradés
En 2017, vous verrez apparaitre de plus en plus sur les sites web de belles couleurs riches et brillantes, bien pep’s ! La mode est aussi aux dégradés de couleurs vives, qui viennent souvent se placer en background de quelques sections du site, ou par dessus une image de fond, pour lui donner un peu de chaleur, de dynamisme et d’énergie. Tout cela vous permettra de vous démarquer des autres sites.
Un exemple de marque hyper connue qui est passée par là cette année : Instagram, avec son beau logo multicolore 😉
2 – Material design et les ombres
Nous sommes passés dernièrement du flat design (aplats, pas de profondeur, minimalisme), au material design, qui apporte un brin de perspective, avec des formes géométriques, des ombres et du mouvement. En 2017, on reste dans cette optique d’utilisation de profondeur et de perspective, en travaillant avec de belles ombres visibles, plus marquées et plus foncées, qui permettront d’aérer et d’ajouter des zones de respiration dans vos designs.
3 – Des typos grandes et bold
Chaque année on voit de nouvelles tendances typographiques émerger sur le web. Tout le monde est bien conscient de l’importance de la typographie dans l’UX design. Il ne s’agit pas simplement d’assembler de jolies polices ensemble, la typographie est une partie essentielle de chaque design, elle permet de faire véhiculer une ambiance ou un message, et le choix de votre typo peut vraisemblablement faire basculer votre projet. Pour cette tendance webdesign 2017, misez sur des typos bien voyantes et originales, utilisez des font-size XXL, et du bold.
4 – Adieu les menus hamburgers !
Le menu hamburger a son avantage sur les écrans des smartphones, mais sinon, il n’est vraiment conseillé sur les sites et applications web, malgré son utilisation intempestive ces derniers temps… On préfèrera donc les menus classiques sous formes d’onglets horizontaux, quitte à repenser et optimiser son arborescence pour rester dans la limite des 7 ou 8 onglets maxi conseillés en terme d’UX.
5 – Micro-interactions
Retenez bien ce mot, car ce sera lui le roi de cette année 2017 ! Qu’est ce que les micro-interactions ? Ce sont les animations interactives qui accompagnent une interface pour la rendre plus attrayante. Mais attention, elles servent surtout à l’UX : communiquer une situation, visualiser un état ou un résultat, mettre en valeur un changement ou une action de l’utilisateur… Elles permettent aux utilisateurs de comprendre et reconnaître ce qui se passe, s’est passé ou va se passer au moment où ils interagissent avec l’interface.
Tout est dans le détail, car c’est le détail qui fera votre design.
6 – Animation
Ce point rejoint le précédent : insufflez de la vie à votre design, en utilisant (avec beaucoup de parcimonie) des GIFS animés, ou un effet parallaxe (défilement de l’arrière plan moins rapide que le contenu, ce qui crée un effet de profondeur, style 3D, et anime votre page. Grâce à ces techniques, attirez l’attention sur les éléments importants de votre site.
7 – Long scrolling / Mono-page
Le scroll n’est pas nouveau, c’est une fonctionnalité web majeure déjà à la mode depuis quelques années, et ça le restera. Le site « one-page » permet d’éviter les navigations complexes et permet une expérience utilisateur plus simple, fluide et facile à utiliser. Aujourd’hui le scroll est devenu un réflexe pour tout le monde.
Ce mécanisme de navigation a de grands atouts : faire passer très rapidement un maximum d’information à votre utilisateur, sur n’importe quel type d’appareil (ordinateur, tablette, smartphone), de façon narrative et immersive, et surtout je le répète, fluide.
8 – Cassez la grille
Tout design est conçu sur une grille (habituellement on travaille en « 12 colonnes », qu’on regroupera par exemple par 4 pour diviser la page en tiers, ou par 6 pour deux demie-pages, etc…). Cette fameuse grille est une base pour la conception du webdesign du site, et permet de garder de la cohérence, de l’équilibre et de l’ordre dans la construction.
Même si cette grille est donc importante pour l’UX, elle est aussi restrictive et rigide, et limite les options créatives. En s’éloignant de la grille et des structures de base rigides, on peut créer des interfaces plus originales, intrigantes et expérimentales. Faites toutefois attention à garder en tête l’UX et à ne pas mettre de confusion dans votre interface. Aussi, pensez responsive ! 😉
9 – Design adaptative
Et oui, on ne parle presque plus de responsive design, mais plutôt d' »adaptative« . Avec l’efflorescence des appareils et donc des tailles d’écrans, il ne s’agit plus ici de faire une version mobile, une version tablette et une version desktop. Votre design doit s’adapter (quasiment) au pixel près, pour être optimisé sur n’importe quel device… Oui, il y a du travail derrière tout cela !
En résumé, ces tendances webdesign 2017 nous amènent à la même conclusion : nos interfaces doivent se complexifier dans leur conception, avec l’ajout d’animations et la prise en compte du design adaptative, pour se simplifier dans leur utilisation, et surtout innover et donner encore plus envie à votre utilisateur (on s’oriente UX design avant tout).
Référencement de votre site, ce que je vous propose
On me pose souvent la question (pendant la phase pré-projet d’analyse des besoins du client), sur les actions que je mets en place pour optimiser le référencement des sites que je livre.
Voici donc des éléments de réponse.
Les bonnes pratiques que j’applique sur votre site
– Premièrement, et puisque c’est mon coeur de métier et ma valeur ajoutée, je m’applique à réaliser un site ergonomique, orienté vers l’utilisateur (UX design), avec une navigation optimisée, et un design clair et beau. C’est très important, puisque cela permet d’une part de capter vos internautes, et d’autre part cela permet de les aider à avancer dans votre site, à y naviguer, et bien évidemment à y rester (on diminue le taux de rebond, on optimise les conversions).
– Ensuite, je mets en place tout ce que l’on appelle SEO « on-page » : je choisis un template adapté et optimisé, que je personnalise et améliore. C’est à dire que la structure du code doit être bien pensée, propre, pour aider Google à analyser vos pages, et à les référencer.
J’optimise avec des mots clés pertinents (ceux sur lesquels vous souhaitez être positionnée) les titres de pages (balise title principale, celle qui apparait dans l’onglet de page du navigateur) et les titres et sous titres contenus dans les pages (balise H1, H2, H3, etc).
Via un module que j’installe systématiquement (je travaille généralement avec Yoast SEO, le plus utilisé par la communauté WordPress), j’optimise aussi les balises meta description (ce sont celles qui apparaissent dans les résultats de Google) :
Ces balises n’impactent pas forcément directement votre référencement, donc inutile d’y placer une pléthore de mots clés. Non, le but dans cette courte description est d’attirer votre internaute, lui donner envie de cliquer sur votre lien, plutôt que celui du dessus ou du dessous !
Lorsque je vous livre votre site internet (si vous avez choisi de l’administrer vous-même), vous aurez accès à ce module, et pourrez optimiser vous même le titre de page et la méta description, qui apparaissent donc dans les snippets (résultats Google, comme expliqué plus haut).
– Il est aussi important d’optimiser le poids des images et la vitesse du site. Je retravaille donc les images pour les alléger, le code est structuré de telle sorte que tous les scripts soient chargés après le contenu important (le plus possible), et d’autres astuces de ce genre sont mises en place afin d’optimiser votre site au maximum.
– Je crée un fichier sitemap.xml (fichier qui liste toutes les pages du site, dynamiquement), et je le soumets à Google (cela permet d’avoir toutes vos pages indexées), je crée un compte Google Analytics + Webmaster Tools pour contrôler les statistiques de votre site, ainsi que les éventuelles erreurs ou optimisations.
– Et enfin, j’optimise la partie « partage » de votre site, en intégrant les balises nécessaires pour Facebook (balises og:, qui permettent d’optimiser l’affichage des éléments partagés via Facebook), et en installant un module de partage sur les réseaux sociaux. Les réseaux sociaux sont sélectionnés en fonction de votre activité sur ces derniers, mais aussi en fonction de leur pertinence par rapport à votre secteur d’activité et à votre cible (grand public, business, etc).
(liste non exhaustive…)
D’autres optimisations à mettre en place
Pour résumer le tout, je me charge vraiment de la partie dite technique du référencement.
Pour tout ce qui concerne le choix de vos mots clés, la rédaction de vos textes, l’optimisation de vos contenus, etc… il faut dans le meilleur des cas faire appel à un rédacteur web, dont c’est le coeur de métier (ou le faire vous même de façon très sérieuse).
Gardez bien en tête que le pilier principal d’un bon référencement aujourd’hui, est le CONTENU. Des textes fournis et étoffés, optimisés, mais surtout écrit par vous pour vos internautes. Pas de secret…
Si ce n’est pas votre fort et que vous ne vous sentez pas l’âme d’un écrivain, je vous propose de contacter une de mes partenaires, rédactrice web et consultante en communication digitale :
Lucie Laval, contentactic.com.
N’oubliez pas, il ne faut absolument pas passer à côté de la qualité de vos contenus si vous souhaitez être bien référencé.
Pour être bien référencé, il faut aussi penser à être actif sur les réseaux sociaux (partager vos produits, parler de vous, de votre actualité, de vos clients, etc…).
C’est pour cela qu’il est aussi intéressant dans la plupart des cas, d’avoir une partie Actualités/Blog sur un site. Cela vous permet de proposer des contenus optimisés assez régulièrement, de mettre votre site à jour (Google apprécie cela), et également de les déléguer sur les réseaux sociaux, puis que les gens les relayent, parlent de vous, etc… Et c’est là le second pilier d’un bon référencement : la NOTORIÉTÉ.
N’hésitez pas à me contacter pour avoir plus de détails sur le travail de référencement que je mets en place dans mes créations web !
Les astuces 2016 pour votre référencement
On le sait, le maître mot est « contenu » ! Il faut un contenu original et attractif pour attirer des utilisateurs, et pour permettre à son site internet d’être bien positionné dans les moteurs de recherche (#bonjourGoogle). Alors que toutes les entreprises investissent dans leur marketing numérique, et donc dans la création de contenu attractif, il se pourrait bien que d’autres sujets attirent encore plus les moteurs en 2016. Je parle entre autres de la convivialité des sites web : l’expérience utilisateur (UX design).
Voici donc un petit top 5 des tendances SEO à suivre cette année pour rester dans les clous !
1 – Pensez mobile !
Eh oui, on ne passera plus à côté, le référencement mobile devient une des priorités. Le web « desktop » et le web mobile ne feront plus qu’un d’ici quelques temps, votre site se doit d’être pensé pour la consultation sur mobile (responsive design). Un site qui ne s’adapte pas à la résolution des appareils mobiles ? Une police trop petite ? Une image trop lourde à charger ? Pour Google, ce n’est pas sérieux, et ce site est « out » illico-presto !
Le critère de « mobile friendly » deviendra une condition sinequanone pour qu’un site soit simplement référencé.
2 – Focalisez-vous sur du contenu haute qualité :
Avant, on tournait tous les textes d’une page autour d’un même mot-clé pour le répéter encore et encore, et lui donner du poids. Ce n’est clairement plus ce qu’il faut faire aujourd’hui. Place aux contenus pertinents, qui répondront mieux à une recherche intuitive. Qu’est-ce que je veux dire par là ? Il ne s’agira plus de travailler un mot clé, mais une intention. N’oubliez pas, l’utilisateur est au centre du référencement. S’il recherche « quelle est la meilleure cafetière ? », le but n’est pas de lui fournir un texte de 50 lignes qui décrit ce qu’est une cafetière, avec x répétitions du mot cafetière. Non, mais par contre il sera bien plus intéressé par un texte qui compare quelques marques, identifie les différentes attentes ou besoins par rapport au produit, et propose un ou deux sites pour trouver la cafetière idéale.
Vous avez compris ? Vos contenus doivent être rédigés pour votre internaute. C’est le contenu utile pour les utilisateurs qui sera bien positionné par Google.
3 – Plus de contenu, et plus d’interaction :
L’utilisateur veut un contenu qui s’adapte à lui, et qui réagit à ses actions. Les moteurs de recherche valoriseront un site qui propose un contenu interactif et qui offre une expérience fluide à ses visiteurs. Par exemple, proposez un système de recherche avancée, où l’internaute pose une question quelconque : « Vendez-vous des livres ? », et est directement renvoyé sur la page concernée qui répondra à ses attentes. Cela l’incitera à l’action, et permettra de mettre en place un process de fidélisation. C’est ça l’interaction !
En plus de cela, il faudra dire adieu aux textes trop courts, dupliqués ou sans intérêt. Maintenant, Google veut un vrai contenu, bien écrit, intéressant et long. Il se pourrait qu’un contenu soit considéré comme pertinent qu‘à partir de 1200 mots… Alors à vos plumes ! Et ce n’est pas tout, dernière petite astuce : votre texte sera mieux considéré s’il est accompagné de formes diverses de contenus. J’entends par là, images, infographies, vidéos. Plus votre contenu sera diversifié, et mieux il sera classé !
4 – Votre référencement local, vous y prêtez attention ?
Vous devriez en tout cas ! Le référencement local prend de plus en plus d’ampleur, et voit vraiment tout son intérêt avec l’utilisation croissante des mobiles (donc je vous renvoie à mon point n°1 !). Les utilisateurs cherchent de plus en plus des enseignes à/de proximité, et Google l’a compris. Prenez donc la peine d’intégrer des informations locales sur votre site web, comme une Google Map, une page dédiée à votre activité locale… Grâce à la géo-localisation, les recherches localisées deviennent de plus en plus courantes, et les résultats de recherche en tiennent de plus en plus compte. D’ailleurs, l’algorithme Pigeon de Google, qui sert à afficher les résultats locaux (géolocalisés) de type ‘restaurant Paris’ ou ‘hôtel Marseille’ sur le moteur de recherche, nous montre clairement que l’emplacement géographique prend une place importante dans le positionnement d’un site.
5 – Autre sujet important, le temps de chargement :
Ce point conclut un peu l’article puisqu’il rejoint les points précédents. Pour offrir une expérience agréable et fluide à l’utilisateur, il faut également mettre l’accent sur les performances de votre site. Pour optimiser l’affichage de votre site sur mobile, il faut faire attention à son temps de chargement. Le temps de chargement de votre site web est un point essentiel pour l’expérience utilisateur, et il va impacter votre taux de conversion ou votre taux de rebond. N’hésitez donc pas à utiliser Google Page Speed pour voir combien de temps met votre site web à se charger. Vous pourrez ainsi par la suite optimiser votre site pour améliorer ses performances et influer sur votre référencement.
Tendances des logos pour 2016
Comme chaque année, les experts design étudient les tendances graphiques qui vont marquer les prochains mois : webdesign, typographies, couleurs,….
Voici une infographie très intéressante réalisée par la plateforme Creads qui nous montre les tendances des logos pour 2016.
On retiendra ces quelques idées :
- Le noir est la couleur la plus utilisée, avec le bleu, le vert, le rouge et le gris.
- Les logos sont en général bicolores, et pensés en flat design.
- A la mode : les logos pictographiques, en transparence ou en fil de fer.
- On aime les logos avec une typographie épurée et sans serif.
Vous avez en projet la création d’une entreprise ? Ou vous souhaitez redonner un coup de jeune à votre marque ? N’hésitez surtout pas à me contacter, je vous proposerais plusieurs pistes graphiques en fonction de votre charte et de vos goûts, et nous créerons ensemble votre nouveau logo !
Les 7 erreurs à éviter pour vos voeux de fin d’année
Voilà la nouvelle année, une occasion pour vous de renouveler l’intérêt de vos clients, de motiver vos équipes ou de remercier vos partenaires. C’est un outil marketing très intéressant, qui envoie un message fort à vos collaborateurs. Puis c’est aussi une façon de faire passer un message plein de sens pour bien commencer la nouvelle année !!
Voici donc une petite infographie (signée Popcarte) qui vous explique les erreurs à ne pas commettre pour votre carte de voeux d’entreprise :
1 – S’y prendre à la dernière minute,
2 – Envoyer un simple email,
3 – Créer vos cartes avec Paint…
(non ! Faites plutôt appel à un professionnel du design comme moi ! 😉 ),
4 – Utiliser des design vus et revus,
5 – Ne pas vous présenter clairement,
6 – Négliger les spécificités du destinataire,
7 – Ne pas personnaliser votre carte de voeux.
Pensées d’un designer…
« Designer problems »… Les problèmes d’un designer illustrés !
Voilà ce qui trotte tous les jours dans les pensées d’un webdesigner ! Les problèmes de tous les jours :
recherche de créativité & d’imagination,
le manque de café !!,
chercher des palettes de couleurs qui vont bien ensemble,
se souvenir des raccourcis Photoshop,
établir les prix & les devis,
penser à prendre son déjeuner,
avoir besoin de petits encas (pour tenir le coup !),
trouver des polices sympas (et pas Helvetica !),
pas mal de rêveries qui viennent perturber notre productivité (on est tellement curieux !)…
Rendez les choses aussi simples que possible, mais pas plus simples…
C’est aussi une des règles principales en UX design ! Merci Mr Einstein !