9 min de lecture
Codes et visuels, ce sont 2 termes contradictoires. Pourtant, je vais fréquemment les utiliser dans la même phrase dans cet article : coder visuellement pour concevoir un site web. Est-ce réellement possible ? Je vous apporte la réponse dans ce guide.
Est-ce que vous y croyez vous ? Coder visuellement pour créer un site web, une application mobile, un logiciel… ?
Non, c’est impossible !
Oui, tout devient possible quand on y croit !
Franchement, je n’en sais rien. C’est ce que je veux savoir à travers votre article
Vous pouvez coder visuellement lorsque vous n’avez pas besoin d’écrire des lignes de code pour développer un site web, une application mobile ou un logiciel. C’est ce que nous appelons aussi du no code. Au lieu des codes écrits manuellement, il suffit d’une interface visuelle avec la fonctionnalité glisser-déposer.
Le no code permet donc à tout type de personnes, qu’elle soit programmeur, webdesigner ou encore, chef d’entreprise, d’accéder facilement à la technologie.
Il existe évidemment des outils spécifiques en no code. J’en ai parlé dans un de mes guides sur les principaux outils no code que je connaisse. Ce qui nous intéresse particulièrement ici est celui qui peut nous aider à la création d’un site web : Webflow.
J’ai eu l’occasion de tester différents outils de création de sites internet par le passé, comme Wix, Shopify, Wordpress, etc. Mais Webflow fait partie des plus faciles à manipuler un fois la plateforme prise en mains. Car pour être honnête, il y a une “petite” courbe d’apprentissage tout de même qu’il faut traverser.
Pour en créer un, vous n’avez qu’à vous baser sur un modèle, et ensuite, le modifier. En général, ce sont les débutants qui font cela.
Plus vous gagnez en expérience, plus vous êtes capable de créer un site entièrement personnalisé, basé sur aucun modèle préexistant. Dans ce cas, les modèles de site web vous serviront comme des sources d’inspiration. Vous procédez alors comme suit pour la création de sites.
En même temps, encore toute une panoplie de fonctionnalités avancées est présente :
Tout ce qui peut vous aider à créer un site web interactif (un blog, une boutique en ligne, et bien d’autres encore).
Tout est bien sûr plus facile si vous êtes guidé pas à pas, alors n’hésitez pas à vous inscrire à la formation gratuite!
La première fois que je me suis connecté sur Webflow, sur son tableau de bord, j’étais un peu perplexe. On me vantait sa facilité, et pourtant, ce n’était pas l’image que reflétait son interface. Beaucoup de gens pensent d’ailleurs ainsi. C’est ce que je vois sur beaucoup d’avis publiés sur internet en tout cas.
En réalité, l’apprentissage de coder visuellement peut se faire aisément sur Webflow. Pendant que vous glissez et déplacez les fonctions sur une page, des lignes de codes sont automatiquement générées en arrière-plan. Alors, si vous voulez en profiter pour apprendre à coder (HTML, CSS et JavaScript), Webflow vous le permet entièrement.
En effet, vous avez accès à ces codes. Vous pouvez même les exporter pour ensuite les importer ailleurs. À chaque modification, les codes sont modifiés instantanément. Ainsi, vous aurez une meilleure compréhension de leur signification.
Attention qu’une fois exporté, vous ne serez plus en mesure de le réimporter sur Webflow.
Webflow est bien plus qu’un outil no code. Il est constitué d’une très belle communauté, ce que j’ai pu expérimenter moi-même. J’ai vu que tous ceux qui partagent la même passion pour la créativité, animés par un esprit d’entraide et d’échange, sont réunis dans cette communauté. Ici, je ne parle pas seulement du sentiment d’accomplissement qu’on peut avoir en sachant qu’on fait partie d’une telle communauté, mais aussi, des avantages dont on peut tirer.
En voici un exemple : quand je bloque sur quelque chose, je sais où me tourner. Bien sûr, vers la communauté. Cerise sur le gâteau : il y a des membres expérimentés qui sont prêts à vous aider sur le forum !
Comme tout se passe en anglais, j’ai créé pour vous un groupe privé sur Facebook et la communauté sur Circle (accessible par la formation gratuite uniquement).
Un des meilleurs moyens d’apprentissage est aussi le fait de s’inspirer des travaux des autres. Cela pousse à essayer de donner le meilleur de soi, à se dépasser et à rester motivé. Mais de quels travaux s’inspirer ? Comment savoir si un site a été conçu sur Webflow ou non ?
Je vous ai parlé de communauté tout à l’heure. Sachez que les membres de cette communauté envoient régulièrement leurs sites web sur le site de Webflow. Vous aussi, vous y êtes le bienvenu ! Pourquoi ne pas poster vos récents travaux, ceux dont vous êtes le plus fier ? Vous aurez alors des retours qui vous permettront d’avancer, mais également, vous serez une source d’inspiration pour les autres. Découvrez le Webflow showcase à cet effet
Enfin, Webflow University, la plateforme qui regroupe toutes les informations dont vous avez besoin pour exceller sur la plateforme : vidéos tutos, articles tutos, etc. Ils sont détaillés, exactement adaptés pour les débutants.
Même si vous ne connaissez Webflow que depuis peu, vous pouvez être sûr de le maîtriser rapidement. C’est vrai que je répète souvent que Webflow est destiné aux Webdesigners, mais en réalité, une fois la courbe d’apprentissage passée, quel que soit votre métier, vous pouvez vous en sortir sur un projet simple.
La durée entre le prototypage et la construction du site web ne prend plus beaucoup de temps. Vous allez pouvoir transformer les semaines en jours !
Par ailleurs, comme vous n’écrivez aucun code, vous gagnez beaucoup de temps dans la conception de site web. Je l’ai expliqué dans la partie précédente : il suffit de glisser et déposer les éléments composants votre future page web. La création de formulaires par exemple ne nécessite aucune action supplémentaire telle que : la création de bases de données, la connexion de cette base au formulaire, etc.
Tout cela se fait automatiquement. Tout ce que vous avez à faire est de vous occuper de vous concentrer sur les recherches, analyses, sondages… et de concevoir le design en fonction. Pareillement pour tous les autres éléments, il n’y a aucune configuration technique à réaliser.
Utilisez donc ce gain de temps de la meilleure manière qui soit, c’est-à-dire, concentrez-vous sur des choses plus importantes encore. Par exemple, vous pouvez en profiter pour élargir vos connaissances en code en visionnant les codes générés automatiquement en arrière-plan, peaufiner votre business, apprendre d’autres compétences, etc.
Les webdesigners trouveront leur bonheur dans Webflow, c’est sûr et certain ! Au lieu de nous focaliser sur les codes et le côté technique du site, nous avons beaucoup de temps pour penser au design du site. D’autant plus que l’inspiration est énorme. On n’en manque jamais!
Comme je vous l’ai dit plus tôt, vos sites ne se limitent pas à de simples sites statiques. Pour permettre aux internautes une meilleure navigation, profitez du fait que vous pouvez créer facilement des animations sur la page.
En code, vous auriez utilisé le langage JavaScript ; or, ici, il suffit de déplacer, glisser et configurer chaque élément.
Gérer les contenus d’un site web n’est pas chose facile. Pourtant, c’est possible avec Webflow. Avant, Worpdress était le CMS par excellence. Aujourd’hui, je dirais que Webflow est sur le point de le surpasser. D’ailleurs, j’ai récemment écrit un guide sur les principales différences entre Wordpress et Webflow,si cela vous intéresse.
Webflow offre aussi de larges possibilités, par exemple : avec lui, l’usage d’extensions tierces est possible. Dans le volet marketing, il y a Mailchimp (pour l’intégration de formulaires et l’envoi de mails à vos abonnés). Ensuite, n’oublions pas le widget d’Elfsight (si vous voulez faire apparaître le flux instagram de votre compte sur votre site). Et de bien d’autres extensions encore et à venir.
Prenons un cas concret de prise de risque : la conception de landing page.
J’ai écrit un guide sur la création de landing pageau cas où cela vous intéresse. J’y ai mentionné que pour assurer la réussite d’un landing page, il faut réaliser différents tests (évidemment basés sur les données que vous avez).
Lors de ces tests, sentez-vous libre de tester différentes hypothèses, quelle que soit l’envergure des risques encourus.
Qu’est-ce qui vous permet ces prises de risques ? En fait, vous avez plus de temps (j’y reviendrai plus tard) grâce à la facilité d’usage de Webflow. Ainsi, vous pouvez optimiser votre temps.
Pour les grands projets, il est fort probable que vous travailliez avec une équipe :
La collaboration devient encore plus facile avec Webflow, car vous pouvez partager l’accès au projet. De cette manière, vos tâches seront allégées. Ce n’est plus à vous de terminer manuellement les étapes de création de sites. Chaque intervenant remplit son rôle, directement sur Webflow, un véritable outil collaboratif.
Pour les développeurs notamment, ni vous ni eux ne galérez, grâce aux codes générés automatiquement par Webflow. Il suffit en effet de les exporter pour ensuite les communiquer aux personnes qui en ont besoin.
Le temps, c’est de l’argent. Avec toute la simplicité que Webflow offre, vous pouvez être sûr de gagner du temps. C’est alors que vous serez vite rentabilisé !
En effet, l’apprentissage de Webflow (que ce soit gratuit ou payant) vaut l’investissement d’effort et de temps.
Vous pouvez créer un site web extrêmement personnalisé. Aujourd’hui, grâce à Webflow, vous allez pouvoir réaliser 99,99% de vos idées.
Le fait que Webflow soit relativement simple à prendre en mains ne signifie pas qu’il est dénué de fonctionnalités performantes. Au contraire, cette simplicité fait toute la différence. Elle est celle qui nous permet de coder visuellement, de créer un site web facilement. Et pour ceux qui sont à la recherche de technique, de complexité, etc., ils seront toujours servis !
En effet, Webflow revêt encore d’autres facettes plus sophistiquées bien sûr.
Dans la joie et la bonne humeur
Que vous soyez débutant ou expérimenté, la Happy.webacademy vous donne l’énergie, les stratégies et les outils pour avoir plus de liberté et générer des résultats qui propulseront votre chiffre d’affaires dans les étoiles.
