4 minutes

Initiation Web : Création d’un site internet sans coder

#nocode #initiation
Ecrit par
Behind The Skills

Le média vidéo qui déniche les meilleures solutions en Marketing, Sales et Social Media 🦁

Behind The Skills


Trouver les bonnes ressources

La première chose à faire est de trouver un outil pour monter votre idée. Dans cette vidéo, l’idée est de créer un quiz, rapide et simple.
Voici quelques ressources que vous pouvez utiliser comme les services en ligne qui sont sourcés par la communauté chatons (et non, on ne parle pas d’animaux) qui vont parler de partages d’images, tableurs collaboratifs, de chose qui peuvent raccourcir les liens, mais il n’y a pas l’outil pour créer un quiz.

La deuxième ressource est le site des No Coders, et dans le menu toutes les ressources No-Code, pour créer ce quiz vous allez avoir besoin d’un typeform, mais vous ne pouvez pas le mettre en ligne tout seul, vous avez besoin d’un site pour l’héberger, l’habiller et le mettre dedans.


Ce qui pourrait nous intéresser ici est une option pour avoir une Landing Page, c'est-à-dire une page web simple que l’on peut agréger de contenu. 
Sur le site des No Coders, une des références qui est proposée en Landing Page est Carrd. C’est un outil gratuit, et hyper facile à utiliser. Un site, même si vous avez quelque chose pour l’héberger, il va falloir du contenu. Dans cette vidéo, notre experte nous parle de deux ressources pour des contenus :

Si vous avez besoin de faire de la créa (Exemple: créer un logo ou enlever le fond d’une image), Canva est la meilleure des solutions et c’est surtout GRATUIT ! Caroline Mignaux en parle d’ailleurs très bien quand il s’agit de créer du contenu.

Le deuxième site pour avoir de belles photos, des beaux contenus est Unsplash. On peut mettre n’importe quel mot-clé et on peut trouver des photos libres de droits qu’on peut utiliser sur Internet.

Vous arrivez sur le site de Carrd, et vous allez directement regarder les types d’intégrations possibles, pour savoir ce qui peut fonctionner. En scrollant, vous allez tomber sur la section Pro, vous pouvez voir qu’il est compatible avec Stripe, Paypal, Gumroad, Typeform. Mais pour cela, vous devez prendre la version Pro. Ce n’est pas un abonnement mensuel mais annuel, donc pour 19 $ par an, vous allez pouvoir créer autant de Landing Pages que vous souhaitez.


Comment personnaliser votre site web ?

Pour commencer, vous allez vous inscrire pour par la suite ouvrir votre Dashboard. C’est ici que vous allez donc créer votre nouveau site.

La première étape va être de choisir son template. Vous avez le choix entre plusieurs types, mais ici, l’expert choisit de prendre un template dans la catégorie Sectioned, c’est un site qui va être en one page, mais qui va permettre de créer de petites sections dans le site où lorsque la personne va cliquer dessus, cela va simuler d’avoir plusieurs pages alors qu’en réalité, il n’y a qu’une seule page avec des blocs qui s’affichent différemment. Choisissez celui qui vous plaît le plus sinon ce n’est pas drôle ;)

Carrd prépare votre template et vous allez enfin pouvoir commencer à travailler sur le template choisi. La première chose à faire est d’insérer sa charte graphique, c'est-à-dire un logo, des couleurs et une typographie.

Vous allez enfin pouvoir mettre du contenu ! Vous pouvez utiliser beaucoup d’images afin d’illustrer au mieux votre site. Des images que vous allez chercher sur Unsplash par exemple. 

Au niveau des couleurs, vous pouvez faire quelques choses de très coloré, engageant (couleur flashy) ou alors de très basique, neutre, comme par exemple le noir et blanc.

Après avoir choisi tous les détails, vous allez enfin pouvoir vous lancer sur la piste ! Commencez par donner un titre à votre page, puis argumentez dans un petit paragraphe ce que vous allez présenter.

Pour les couleurs, à chaque fois que vous voulez en changer une, vous allez simplement cliquer sur la zone concernée, puis, vous pouvez enfin mettre les photos. Vous cliquez donc sur la zone Image et vous mettez les images que vous avez choisis au préalable.

Vous pouvez aussi rajouter des boutons, afin de simplifier encore plus votre page ! Dans la partie Section, quand vous allez lancer le site, toutes les sections sont des zones que vous allez pouvoir afficher et/ou cacher. 

Ensuite, dans les autres sections, vous allez pouvoir mettre le TypeForm, ainsi qu’une section À Propos. N’oubliez pas de mettre en pied de page les crédits !
Elodie a d’ailleurs proposé un Focus sur l’intégration d’un formulaire avec Typeform et Carrd.


Comment mettre votre site web en ligne ?

L’heure de sauvegarder votre chef-d'œuvre est arrivée. Sur Carrd, vous êtes obligé de mettre un titre et une description de votre site. Vous avez ensuite la possibilité, soit de l’enregistrer en tant que template, soit de le publier avec un URL carrd.co, soit de lui mettre un nom de domaine personnalisé.

Vous n’avez donc pas besoin de l'héberger ailleurs vu que Carrd s’occupe de tout!

Comment partager votre site web ?

La dernière étape, va être de réfléchir et de savoir comment votre site va être partagé. Pour le partager à un maximum de gens, vous allez dans le petit onglet Média, avant de le publier, et choisir une image de partage que vous allez créer et choisir une icône, et ensuite, vous pouvez publier vos changements.

Une fois que c’est publié, vous avez le choix entre rester sur votre page ou alors d’aller consulter votre site pour tester en live ce que ça donne, voir si tout ce que vous avez mis marche et est à votre goût. 

And done! Vous testez votre idée et votre site fonctionne!

En conclusion, vous avez pu créer une page ou alors un morceau de site internet sans une ligne de code, seul, pour avoir des premiers retours, des retours sur le contenu que vous avez mis, sur le fond, la forme.

Le No-Code vous intéresse? Cette vidéo d’Alexis Kovalenko qui utilise Adalo va clairement vous plaire.

Pour découvrir toutes les vidéos des meilleures solutions du Digital en Marketing, Sales et Social Media, c'est par ici.

Behind The Skills
Behind The Skills
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.