Les tendances webdesign 2021 pour les professionnels du droit, du patrimoine et de l'assurance

07/07/2021
Thumbnail [16x6]

Poussé par les nouvelles technologies et la nécessité d'optimiser l’expérience utilisateur, le webdesign est sans cesse questionné et réinventé par de nouvelles tendances. Certaines se complètent quand d’autres s’opposent ; certaines sont éphémères quand d’autres s’affirment comme nouvelles normes de l’UX (User Experience) et de l’UI (User Interface) design. Dans cet article, découvrez les tendances webdesign attendues sur nos écrans en 2021.

 

#1 : Les typographies et l'utilisation des gros caractères

 

Bien que les images soient un point important de votre site, le contenu ne doit pas être négligé ! Les typographies Bold (comprenez large, que ce soit en serif ou en sans serif) font leur grand retour sur le devant de la scène ! N’hésitez pas à afficher vos titres en grand, mais toujours avec style ! À l’heure du contenu roi, il paraît tout à fait logique que les mots tendent à être mis en avant de manière à être mieux vues.

 

#2 Le mode sombre 

 

Tendance apparue en 2020 et qui se confirmera en 2021. Utilisé à la base pour améliorer la durée de vie des batteries des mobiles (en affichant une majorité de couleurs sombres, ce qui consomme moins d’énergie), aujourd’hui le « dark mode » est une vraie tendance esthétique ! Vous pouvez l’implémenter dans votre site pour créer un design ultra moderne, jouer avec des contrastes de couleurs originales…

 

#3 Le minimalisme

 

En 2021, le webdesign se veut résolument simple !

Exit les interfaces ultra-chargées et les barres de navigation trop complexes. L’heure est à la simplification pour rendre l’expérience utilisateur (UX) toujours plus fluide. Et ceci pour une raison simple : plus l’utilisateur trouvera facilement ce qu’il cherche, plus il sera susceptible de rester sur le site (et donc, d’avoir une navigation plus longue). Pour ce faire, les barres de navigation sont de plus en plus minimalistes et améliorent leurs fonctionnalités.

De leur côté, les grandes zones de texte laissent place aux vidéos et aux photos grand format pour présenter ou préciser un concept. Ce qui permet d’attirer davantage l’attention sur les objectifs de l’entreprise ou de la marque.

Une tendance qui s’explique en partie par l’utilisation grandissante des technologies « portables » (tablettes, smartphones, smartwatches…).

Dans ce contexte, la navigation web doit désormais être pensée pour ces devices et s’adapter à des formats d’écran de plus en plus petits.

 

#4 : la sobriété et les espaces blancs

 

Au placard les éléments trop intrusifs. 

Quand on sait que les interfaces en webdesign tendent à devenir de plus en plus minimalistes, rien d’étonnant à ce que les espaces blancs fassent eux aussi partie des tendances pour 2021 !

Si les designs « full frame » (qui occupent la totalité de l’écran) étaient jusqu’ici très répandus, les web designers privilégient désormais des mises en page plus épurées en y intégrant notamment des cadres blancs.

Cette tendance permet, d’une part, d’apporter davantage de structure aux designs et, d’autre part, de mettre en valeur les éléments compris à l’intérieur du cadre (message, produits, valeurs, etc.) Les espaces blancs peuvent être utilisés sous différentes formes pour apporter une certaine respiration à l’expérience de navigation et laisser plus de place à l’utilisateur.

 

#5 Les formes organiques

 

Si les formes géométriques étaient tendance en 2019 et 2020, 2021 verra une autre tendance se confirmer en webdesign : les formes organiques. Ce sont des formes fluides, des formes rondes, asymétriques, sinueuses qui vont aider à compartimenter des sections d’un site Web sans utiliser d’angles durs ou de lignes droites.

 

#6 : La data-vizualisation

 

En 2021, les diagrammes, jauges, cartes et autres outils de data-visualisation devraient dominer nos écrans : un chiffre ou un graphique impactants valent bien souvent un long discours.

 

Et côté fonctionnalités ? 

 

#1 Le chat-bot 

 

Un chatbot est un service, configuré avec des règles et parfois de l'intelligence artificielle, avec lequel vous pouvez interagir via une interface de discussion. Les avantages d'un chatbot dans la relation client :

  • Il permet d'automatiser le service client
  • Il fournit une assistance à vos visiteurs 24h/24 et 7J/7
  • Il dynamise les ventes
  • Il peut influencer la décision d'achat
  • Il vous aide à mieux connaître vos clients
  • Il peut augmenter l'engagement client

 

#2 La prise de rendez-vous en ligne

 

Installer un module de prise de rendez-vous sur votre site Internet c'est vous adapter aux nouvelles attentes des usagers. Cet outil, va vous permettre de gagner du temps, mais aussi d'en faire gagner à vos visiteurs qui apprécient de plus en plus l'utilisation de ce type d'outil. Plus besoin de répondre au téléphone, vous retrouvez tous vos rendez-vous directement dans votre agenda. En plus de vous faire gagner du temps, ce type d'outil vous permet d'améliorer votre référencement sur Internet. Car, en plus d'avoir le module sur votre propre site Internet, les internautes pourront également vous trouver via la plateforme que vous aurez sélectionnée. Vous permettez alors aux internautes de vous trouver plus facilement.

#3 Le module de paiement en ligne

 

Que ce soit pour le versement d'un acompte, le paiement d'un acte, d'une prestation, le règlement d'un contrat... le paiement en ligne n'offre que des avantages :

  • Vous élargissez vos moyens de paiement et vous vous munissez d'un système moderne de plus en plus utilisé pour payer
  • Les paiements peuvent-être effectués instantanément par toute personne partout en France et à l'étranger
  • Votre société est référencée sur Internet et votre image professionnelle est améliorée

Pour recevoir régulièrement des informations sur les bonnes pratiques du digital, inscrivez-vous à nos communications

#_form_153_ { font-size:14px; line-height:1.6; font-family:arial, helvetica, sans-serif; margin:0; } #_form_153_ * { outline:0; } ._form_hide { display:none; visibility:hidden; } ._form_show { display:block; visibility:visible; } #_form_153_._form-top { top:0; } #_form_153_._form-bottom { bottom:0; } #_form_153_._form-left { left:0; } #_form_153_._form-right { right:0; } #_form_153_ input[type="text"],#_form_153_ input[type="date"],#_form_153_ textarea { padding:6px; height:auto; border:#979797 1px solid; border-radius:4px; color:#000 !important; font-size:14px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } #_form_153_ textarea { resize:none; } #_form_153_ ._submit { -webkit-appearance:none; cursor:pointer; font-family:arial, sans-serif; font-size:14px; text-align:center; background:#179afb !important; border:0 !important; -moz-border-radius:30px !important; -webkit-border-radius:30px !important; border-radius:30px !important; color:#fff !important; padding:16px !important; } #_form_153_ ._close-icon { cursor:pointer; background-image:url('https://d226aj4ao1t61q.cloudfront.net/esfkyjh1u_forms-close-dark.png'); background-repeat:no-repeat; background-size:14.2px 14.2px; position:absolute; display:block; top:11px; right:9px; overflow:hidden; width:16.2px; height:16.2px; } #_form_153_ ._close-icon:before { position:relative; } #_form_153_ ._form-body { margin-bottom:30px; } #_form_153_ ._form-image-left { width:150px; float:left; } #_form_153_ ._form-content-right { margin-left:164px; } #_form_153_ ._form-branding { color:#fff; font-size:10px; clear:both; text-align:left; margin-top:30px; font-weight:100; } #_form_153_ ._form-branding ._logo { display:block; width:130px; height:14px; margin-top:6px; background-image:url('https://d226aj4ao1t61q.cloudfront.net/hh9ujqgv5_aclogo_li.png'); background-size:130px auto; background-repeat:no-repeat; } #_form_153_ ._form-label,#_form_153_ ._form_element ._form-label { font-weight:bold; margin-bottom:5px; display:block; } #_form_153_._dark ._form-branding { color:#333; } #_form_153_._dark ._form-branding ._logo { background-image:url('https://d226aj4ao1t61q.cloudfront.net/jftq2c8s_aclogo_dk.png'); } #_form_153_ ._form_element { position:relative; margin-bottom:10px; font-size:0; max-width:100%; } #_form_153_ ._form_element * { font-size:14px; } #_form_153_ ._form_element._clear { clear:both; width:100%; float:none; } #_form_153_ ._form_element._clear:after { clear:left; } #_form_153_ ._form_element input[type="text"],#_form_153_ ._form_element input[type="date"],#_form_153_ ._form_element select,#_form_153_ ._form_element textarea:not(.g-recaptcha-response) { display:block; width:100%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } #_form_153_ ._field-wrapper { position:relative; } #_form_153_ ._inline-style { float:left; } #_form_153_ ._inline-style input[type="text"] { width:150px; } #_form_153_ ._inline-style:not(._clear) + ._inline-style:not(._clear) { margin-left:20px; } #_form_153_ ._form_element img._form-image { max-width:100%; } #_form_153_ ._clear-element { clear:left; } #_form_153_ ._full_width { width:100%; } #_form_153_ ._form_full_field { display:block; width:100%; margin-bottom:10px; } #_form_153_ input[type="text"]._has_error,#_form_153_ textarea._has_error { border:#f37c7b 1px solid; } #_form_153_ input[type="checkbox"]._has_error { outline:#f37c7b 1px solid; } #_form_153_ ._error { display:block; position:absolute; font-size:14px; z-index:10000001; } #_form_153_ ._error._above { padding-bottom:4px; bottom:39px; right:0; } #_form_153_ ._error._below { padding-top:4px; top:100%; right:0; } #_form_153_ ._error._above ._error-arrow { bottom:0; right:15px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #f37c7b; } #_form_153_ ._error._below ._error-arrow { top:0; right:15px; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #f37c7b; } #_form_153_ ._error-inner { padding:8px 12px; background-color:#f37c7b; font-size:14px; font-family:arial, sans-serif; color:#fff; text-align:center; text-decoration:none; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; } #_form_153_ ._error-inner._form_error { margin-bottom:5px; text-align:left; } #_form_153_ ._button-wrapper ._error-inner._form_error { position:static; } #_form_153_ ._error-inner._no_arrow { margin-bottom:10px; } #_form_153_ ._error-arrow { position:absolute; width:0; height:0; } #_form_153_ ._error-html { margin-bottom:10px; } .pika-single { z-index:10000001 !important; } #_form_153_ input[type="text"].datetime_date { width:69%; display:inline; } #_form_153_ select.datetime_time { width:29%; display:inline; height:32px; } @media all and (min-width:320px) and (max-width:667px) { ::-webkit-scrollbar { display:none; } #_form_153_ { margin:0; width:100%; min-width:100%; max-width:100%; box-sizing:border-box; } #_form_153_ * { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; font-size:1em; } #_form_153_ ._form-content { margin:0; width:100%; } #_form_153_ ._form-inner { display:block; min-width:100%; } #_form_153_ ._form-title,#_form_153_ ._inline-style { margin-top:0; margin-right:0; margin-left:0; } #_form_153_ ._form-title { font-size:1.2em; } #_form_153_ ._form_element { margin:0 0 20px; padding:0; width:100%; } #_form_153_ ._form-element,#_form_153_ ._inline-style,#_form_153_ input[type="text"],#_form_153_ label,#_form_153_ p,#_form_153_ textarea:not(.g-recaptcha-response) { float:none; display:block; width:100%; } #_form_153_ ._row._checkbox-radio label { display:inline; } #_form_153_ ._row,#_form_153_ p,#_form_153_ label { margin-bottom:0.7em; width:100%; } #_form_153_ ._row input[type="checkbox"],#_form_153_ ._row input[type="radio"] { margin:0 !important; vertical-align:middle !important; } #_form_153_ ._row input[type="checkbox"] + span label { display:inline; } #_form_153_ ._row span label { margin:0 !important; width:initial !important; vertical-align:middle !important; } #_form_153_ ._form-image { max-width:100%; height:auto !important; } #_form_153_ input[type="text"] { padding-left:10px; padding-right:10px; font-size:16px; line-height:1.3em; -webkit-appearance:none; } #_form_153_ input[type="radio"],#_form_153_ input[type="checkbox"] { display:inline-block; width:1.3em; height:1.3em; font-size:1em; margin:0 0.3em 0 0; vertical-align:baseline; } #_form_153_ button[type="submit"] { padding:20px; font-size:1.5em; } #_form_153_ ._inline-style { margin:20px 0 0 !important; } } #_form_153_ { position:relative; text-align:left; margin:25px auto 0; padding:20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; *zoom:1; background:#fff !important; border:0px solid #b0b0b0 !important; width:400px; -moz-border-radius:0px !important; -webkit-border-radius:0px !important; border-radius:0px !important; color:#1e266d !important; } #_form_153_ ._form-title { font-size:22px; line-height:22px; font-weight:600; margin-bottom:0; } #_form_153_:before,#_form_153_:after { content:" "; display:table; } #_form_153_:after { clear:both; } #_form_153_._inline-style { width:auto; display:inline-block; } #_form_153_._inline-style input[type="text"],#_form_153_._inline-style input[type="date"] { padding:10px 12px; } #_form_153_._inline-style button._inline-style { position:relative; top:27px; } #_form_153_._inline-style p { margin:0; } #_form_153_._inline-style ._button-wrapper { position:relative; margin:27px 12.5px 0 20px; } #_form_153_ ._form-thank-you { position:relative; left:0; right:0; text-align:center; font-size:18px; } @media all and (min-width:320px) and (max-width:667px) { #_form_153_._inline-form._inline-style ._inline-style._button-wrapper { margin-top:20px !important; margin-left:0 !important; } } #_form_153_ ._submit { background:linear-gradient(146deg, rgba(251, 201, 23, 1) 0%, rgba(255, 131, 100, 1) 100%) !important; color:#fff; border-radius:100px; padding:12px 38px; text-align:center; vertical-align:middle; transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out; } #_form_153_ ._submit:hover { background:#fbc917; background:linear-gradient(270deg, rgba(251, 201, 23, 1) 0%, rgba(255, 131, 100, 1) 100%) !important; } #_form_153_ textarea { border-radius:100px; } #_form_153_ ._x81444959 input { border-radius:100px; } #_form_153_ ._form_85 { border-radius:100px; } #_form_153_ ._x75922041 input { border-radius:100px; } #_form_153_ ._x27529088 input { border-radius:100px; } #_form_153_ ._x87224939 input { border-radius:100px; } 

Prénom et Nom 

 

E-mail* 

 

Veuillez vérifier votre demande* 

Je m'inscris

window.cfields = []; window._show_thank_you = function(id, message, trackcmp_url, email) { var form = document.getElementById('_form_' + id + '_'), thank_you = form.querySelector('._form-thank-you'); form.querySelector('._form-content').style.display = 'none'; thank_you.innerHTML = message; thank_you.style.display = 'block'; const vgoAlias = typeof visitorGlobalObjectAlias === 'undefined' ? 'vgo' : visitorGlobalObjectAlias; var visitorObject = window[vgoAlias]; if (email && typeof visitorObject !== 'undefined') { visitorObject('setEmail', email); visitorObject('update'); } else if (typeof(trackcmp_url) != 'undefined' && trackcmp_url) { // Site tracking URL to use after inline form submission. _load_script(trackcmp_url); } if (typeof window._form_callback !== 'undefined') window._form_callback(id); }; window._show_error = function(id, message, html) { var form = document.getElementById('_form_' + id + '_'), err = document.createElement('div'), button = form.querySelector('button'), old_error = form.querySelector('._form_error'); if (old_error) old_error.parentNode.removeChild(old_error); err.innerHTML = message; err.className = '_error-inner _form_error _no_arrow'; var wrapper = document.createElement('div'); wrapper.className = '_form-inner'; wrapper.appendChild(err); button.parentNode.insertBefore(wrapper, button); document.querySelector('[id^="_form"][id$="_submit"]').disabled = false; if (html) { var div = document.createElement('div'); div.className = '_error-html'; div.innerHTML = html; err.appendChild(div); } }; window._load_script = function(url, callback) { var head = document.querySelector('head'), script = document.createElement('script'), r = false; script.type = 'text/javascript'; script.charset = 'utf-8'; script.src = url; if (callback) { script.onload = script.onreadystatechange = function() { if (!r && (!this.readyState || this.readyState == 'complete')) { r = true; callback(); } }; } head.appendChild(script); }; (function() { if (window.location.search.search("excludeform") !== -1) return false; var getCookie = function(name) { var match = document.cookie.match(new RegExp('(^|; )' + name + '=([^;]+)')); return match ? match[2] : null; } var setCookie = function(name, value) { var now = new Date(); var time = now.getTime(); var expireTime = time + 1000 * 60 * 60 * 24 * 365; now.setTime(expireTime); document.cookie = name + '=' + value + '; expires=' + now + ';path=/'; } var addEvent = function(element, event, func) { if (element.addEventListener) { element.addEventListener(event, func); } else { var oldFunc = element['on' + event]; element['on' + event] = function() { oldFunc.apply(this, arguments); func.apply(this, arguments); }; } } var _removed = false; var form_to_submit = document.getElementById('_form_153_'); var allInputs = form_to_submit.querySelectorAll('input, select, textarea'), tooltips = [], submitted = false; var getUrlParam = function(name) { var regexStr = '[\?&]' + name + '=([^]*)'; var results = new RegExp(regexStr, 'i').exec(window.location.href); return results != undefined ? decodeURIComponent(results[1]) : false; }; for (var i = 0; i ')); } } else if (elem.tagName == 'SELECT') { var selected = true; if (elem.multiple) { selected = false; for (var i = 0; i

Contactez nous