Webflow - crédits Webflow
19 janvier 2022

Webflow, le CMS pour les webdesigners ?

Partager l'article

Apporter la richesse fonctionnelle pour concevoir des designs puissants tout en ne sacrifiant en rien à la simplicité d’utilisation, c’est l’ambitieux pari de Webflow. Ce CMS en mode SaaS permet, à l’image d’un Wix, de créer un site Web facilement comme un Lego en utilisant un arsenal se rapprochant d’un constructeur de page de type Elementor. Son interface WYSIWYG (What You See Is What You Get) est particulièrement attrayante et simple à comprendre pour celui qui a déjà utilisé un CMS de type WordPress. Fondé à San Francisco par deux frères en 2013, Webflow mise sur une approche No Code bien qu’il soit possible d’ajouter du code pour plus de personnalisation et de l’interfacer avec un headless CMS (Storyblok, Contentful, Prismic, etc.) ou encore une plateforme tierce afin d’étendre ses fonctionnalités (comme l’ajout d’un CRM, d’Hubspot, etc.).

« Intelligence sans code »

Un leitmotiv et la pierre angulaire de la plateforme Webflow. L’outil disponible exclusivement en ligne et sans possibilité de l’installer sur une solution d’hébergement tierce, s’oriente clairement vers les webdesigners qui privilégient l’aspect graphique sans avoir à toucher le code source du site, tout en travaillant sur une solution robuste, bien codée et réactive. L’objectif de Webflow consiste à proposer une expérience optimale libérant l’imagination des concepteurs sans à devoir passer des heures sur une maquette réalisée sous Sketch, Figma ou encore Adobe XD (des formations à Adobe XD à découvrir ici), bien que ce soit conseillé ne serait-ce que pour l’UX Design. Webflow s’inscrit au carrefour des outils de type Wix, de création de contenu classiques comme WordPress et le développement de site from scratch. Et ça marche ! Webflow revendique plus de 3,5 millions d’utilisateurs dans le monde.

À qui s’adresse ce CMS ?

Webflow s’adresse aux utilisateurs souhaitant se concentrer sur l’aspect fonctionnel et graphique d’un site. Les nombreuses fonctionnalités le place dans la catégorie des CMS no code, mais avec la possibilité d’aller plus loin si la personne dispose de connaissances en développement Web. L’outil se positionne entre la simplicité d’un Wix et la richesse fonctionnelle d’un WordPress (dont vous pouvez approfondir son usage à travers nos tutoriels WordPress). Il se destine à un public qui possède déjà des rudiments en création de sites Web même s’il dispose de plusieurs tutoriels permettant de se former à la plateforme. Une fois cette étape franchie, l’expérience utilisateur s’avère fluide ce qui ravira en particulier les webdesigners.

Une interface s’adaptant au besoin des utilisateurs

L’application s’articuler autour de trois composants principaux :

  • L’outil de design visuel no code ;
  • Le système de gestion de contenus dynamique (le CMS proprement dit permettant d’aller plus loin dans la personnalisation du site) ;
  • L’hébergement.

Lors de son ouverture, l’utilisateur atterrit sur une page ressemblant par bien des côtés à une hybridation entre Photoshop et Elementor (vous pouvez apprendre à maîtriser Elementor à travers cette formation). Intuitive, elle fonctionne par glisser-déposer ou chaque élément constituant la page peut être posé plus ou moins librement. L’utilisateur établit la structure de la page par des « section », des contenants <Div> où l’on place les divers autres éléments (image, texte, call to action, etc.). Un panneau permet d’indiquer sa position, sa taille, son padding et les marges tandis que panneau de création recense l’ensemble des propriétés CSS (taille et type de police, couleurs…). Une option lors de l’inscription sur la plateforme (je ne code pas) permet d’automatiser une bonne partie de la création du site comme la génération automatique des points de rupture afin de créer un site responsive (s’adaptant à la taille de l’écran), mais aussi de simplifier les paramètres en se concentrant sur les plus fréquemment utilisés. À cela s’ajoute une large bibliothèque de template (plus de 1000) dont la plupart s’avèrent payants (allant de 40 $ à 80 $).

Webflow interface
L'interface de Webflow s'oriente clairement vers la conception graphique de site. crédits: Weblfow

Du côté du CMS, Webflow laisse la main aux utilisateurs plus avertis avec la possibilité de définir manuellement les types de contenus personnalisés (page d’article, projets, membres de l’équipe…). En bref, ce sont des blocs déjà créés qu’il est possible d’insérer et de modifier librement dans une page. Facile, mais limité tout de même sans compter qu’il n’est pas possible de faire nativement un site multilingue sans extension tierce.

À l’image de Wix, Webflow ne s’installe pas sur un hébergeur de votre choix. Vous serez donc captif de l’outil, mais bien moins que sous Wix. L’application génère un sous-domaine gratuit se terminant en .webflow.com tout en permettant à l’utilisateur de prendre son propre nom de domaine et de le rattacher à la plateforme. L’hébergement est gratuit jusqu’à deux pages statiques, payant au-delà (12$/mois pour 25 000 visites ou 36 $/mois pour un million de visites mensuelles). L’hébergement intègre un CDN, un certificat SSL tout en étant basé sur infrastructure distribuée diminuant fortement les temps de latence tout en s’adaptant au trafic.

Du site dynamique au e-commerce

Si Webflow est à l’aise pour la création de sites vitrines, il intègre également une partie e-commerce plutôt bienvenue et nettement plus simple que ses concurrents tout en n’ayant pas les options d’un CMS dédié tels que Prestashop ou encore Shopify. L’ajout étant récent, certaines fonctionnalités sont encore perfectibles. La plus-value de Webflow réside dans sa possibilité de personnaliser entièrement et en détail votre boutique en ligne et les pages de paiement à l’apparence des notifications d’achat. D’autres ajouts sont prévus tels que la récupération de commande abandonnée, le support multi devises, l’intégration Amazon, ainsi que les comptes clients ou encore l’ajout des codes et bons de réduction. D’autant plus que la possibilité de créer un espace membre est annoncée sous peu.

Un référencement SEO Friendly

Le référencement naturel (SEO) étant la bête noire de Wix, qu’en est-il sous Webflow ? L’ensemble des designs créés avec l’application sont responsive, les sites créés intègrent un certificat de sécurité SSL ainsi qu’un sitemap (plan de site) et la gestion simplifiée des redirections 301. Particulièrement bien codé et rapide d’exécution, l’application possède tous les outils basiques permettant de réaliser un bon référencement (balise h1, h2, alt, slug de la page, etc.) Seul hic, si la personne ne connaît pas leur utilité, il pourra être difficile de les remplir !

Une offre (trop) dense ?

En dernier lieu et non le moindre, Webflow n’est disponible qu’avec une interface en anglais et une offre tarifaire pas toujours très claire. Ainsi, il est important de comprendre que la plateforme dispose de deux systèmes différents :

  • Account plans : les formules pour le compte global ;
  • Site plan : les formules pour chaque projet (chaque site réalisé).

L’option gratuite permet de se familiariser avec les options basiques de l’outil tandis que la première offre débute à 12$/mois. La formule CMS est à 16$/mois et celle Business à 36$. À cela s’ajoute des offres spécifiques pour le e-commerce (à partir de 29$/mois).

Les formules de comptes sont payantes à partir du troisième projet et débute à 16$/mois pour 10 sites hébergés et à 35$/mois pour héberger des sites en illimité. À noter la présence d’offres collaboratives qui offre la possibilité de gérer la création d’un site à plusieurs (35$/personne/mois).

Webflow s’avère une bonne alternative à d’autres CMS, mais qui peut vite devenir onéreuse selon le type de projet souhaité. Sa puissance et le fait d’être no code permet aux webdesigners de se concentrer sur l’aspect visuel et fonctionnel du site et ce, relativement simplement. Un calcul à prendre en compte, mais le mieux est encore de se faire une idée en testant l’offre gratuite !

 

Nos dernières formations No Code

  • Maîtriser FlutterFlow - De l'Idée à l'Application
    Découvrir
    Cette formation en FlutterFlow est l'outil idéal pour tout développeur souhaitant créer des applications mobiles robustes et interactives sans coder de manière complexe. Grâce à des modules complets et structurés, vous apprendrez à utiliser FlutterFlow et Firebase, à sécuriser vos données, à concevoir des interfaces utilisateur élégantes et à intégrer des API telles qu'OpenIA. Rejoignez-nous pour transformer vos idées en applications innovantes et performantes.
    4h08 57 leçons
  • Webflow - Créer la landing Page d'OpenAI
    Découvrir
    À l'issue de cette formation, les participants seront capables de créer de manière autonome une landing page sophistiquée, similaire à celle d'OpenAI, en utilisant les fonctionnalités avancées de Webflow pour le design responsive et les interactions.
    3h48 19 leçons
  • Apprendre ChatGPT
    Découvrir
    Ce cours vise à fournir une compréhension approfondie de l'intelligence artificielle, en se concentrant sur l'utilisation pratique de ChatGPT et DALL-E. Les participants découvriront comment l'IA peut transformer des domaines variés tels que le marketing, le développement web, et le design graphique. Le contenu couvre les bases de l'IA, l'art de créer des prompts efficaces, l'utilisation de plugins avancés, et le codage assisté par IA. Des projets pratiques permettront d'appliquer ces connaissances dans des scénarios réels. Destiné aux professionnels de la technologie, aux marketeurs, aux développeurs, et à toute personne intéressée par l'IA, ce cours est une opportunité d'acquérir des compétences innovantes et applicables dans divers contextes professionnels et créatifs. Les prérequis incluent une compréhension basique de l'informatique et un intérêt pour l'IA. Le cours promet une aventure d'apprentissage enrichissante, ouvrant de nouvelles perspectives dans l'utilisation de l'intelligence artificielle.
    3h12 30 leçons
  • Créer sa boutique de e-commerce avec Shopify
    Découvrir
    À la fin de cette formation, vous aurez les compétences nécessaires pour créer et gérer votre propre boutique de e-commerce prospère avec Shopify. Transformez vos idées en succès commercial en ligne !&nbsp;
    4h10 39 leçons
  • Apprendre Typeform : Les fondamentaux
    Découvrir
    Apprendre à créer un formulaire avec Typeform
    1h16 3,3 / 5
  • Apprendre Airtable : Les fondamentaux
    Découvrir
    Être capable de créer et modifier des bases de données avec Airtable.
    2h26 5 / 5
Partager l'article