Selon le type de site que vous souhaitez, vous ne vous tournerez pas sur le même éditeur

Etsy

Plateforme internationale qui a remplacé A Little Market. Etsy est spécialisé ecommerce. On y trouve des produits artisanaux. Il a le gros avantage d’être traduit dans toutes les langues et de permettre aux artisans de recevoir des commandes du monde entier. Cependant, Etsy peut couter cher à un artisan ; les frais occasionnés ne sont pas moindres. Il faut compter 0,20€ par fiche ajoutée, Etsy récupère XX% par commandes

Wix

Laura Calu vous le répète régulièrement dans les pubs, Wix permet de créer des petits sites vitrines et très petites boutiques. Facile d’accès, il est également très (trop ?) bon marché. Vous aurez le choix parmi un large choix de maquettes de sites web et il pourra être utilisé comme site e-commerce si vous ne dépassez pas 100 produits. Niveau tarifs on se place entre gratuit et 24€ /mois.

Jimdo

Plus discret et ayant un catalogue moins fourni, il reste équivalent à Wix. Il reste « freemium » c’est-à-dire que certaines options seront payantes. Vous pouvez également vendre des produits gratuitement sur Jimdo avec une limite de 5 articles. Si votre but est de créer un site internet professionnel permettant de vendre en ligne une large gamme de produits, cet éditeur ne sera pas le bon choix. D’un point de vue personnel, je trouve les sites Jimdo moins attirants visuellement que Wix, ce qui pour moi est un gros point noir. En effet, le design est important pour votre image de marque.

1and1

Certaines pubs vous ont peut-être attiré. Cet hébergeur de site internet, vous propose également une plateforme avec des thèmes très limités.  Leurs offres vous proposent un design restreint et peu moderne. Attention donc à l’image que votre entreprise renverra.

Pages Jaunes

Je ferai un article complet sur cette arnaque plateforme. Il faut quand même avouer que l’apparence de leurs sites solocal a quand même évolué. Ils proposent des templates de sites plus moderne. Au delà de cet aspect gardez votre argent, un site freelance vous coûtera moins cher sur le long terme.

Je vous dirai non, évitez. Mais là vous me regardez et me dites que je veux tout simplement vendre mes prestations

Dans un sens ce n’est pas faux, il faut bien vivre et défendre son métier. Mais je me mets aussi à la place du client. Ce dernier voit ce que lui coûte le site à l’instant présent. Les tarifs d’une agence ou d’un freelance sérieux, vont lui faire peur. Là où la facture peut s’élever à plusieurs milliers d’euros, ces plateformes cassent les prix à la manière d’über.  Quand on a aucune connaissance technique, on peut se dire que les plateformes suffiront pour ce que l’on souhaite pour son entreprise. C’est loin d’être le cas. Détaillons un peu plus l’argumentaire concernant ces sites webs. Il faut avouer que leur conception du site internet présente de très gros avantages sur le papier.

• Un site très simple d’utilisation
• Une interface intuitive pour créer votre premier site internet en tant que novice.
• Aucunes connaissances techniques demandées
• Nul besoin de savoir coder ! Vous pouvez créer votre propre design grâce à un système qui « code en langage web tout seul ». Ce sont des principes de glisser déposer et de WYSIWYG (what you see is what you get ) comme les blogs ou les forums.
• En cas de soucis, le support client intervient
• Pas besoin de faire des recherches durant des heures sur internet pour venir corriger les bugs.
• Un site responsive adaptable sur vos smartphones et tablettes
• Les designs sont souvent épurés et « de qualité professionnelle »
• Vous trouvez souvent un guide gratuit pour apprendre à utiliser votre interface
• Des tarifs plus qu’attractifs débutant à quelques dizaines d’euros par mois

On peut également noter que les éditeurs vous fournissent tout. Vous n’aurez pas besoin de chercher une offre d’hébergement avec un serveur web qui vous correspond, d’utiliser un logiciel ftp,  vous pourrez réserver votre nom de domaine directement depuis leur interface. Pour résumer; un site web professionnel, sans avoir besoin de payer une prestation d’une agence web.

On se retrouve dans le même cas de figure que toute prestation low-cost. Je vais rester dans un argumentaire général, je m’attarderai plus sur le cas de Wix et pages jaunes plus tard. Ces deux derniers étant les plus présents sur le marché français.

Pour la partie code (PHP, HTML et CSS), en effet vous n’aurez pas besoin de connaitre les langages web. Vous aurez également un beau site avec un rendu professionnel. Mais en ce qui concerne le reste, on vous vend de la poudre aux yeux. La conception du site ne s’arrête pas à la mise en page, mise en ligne d’une page internet.

• Vous devez avoir des connaissances en UX pour vous assurer une bonne arborescence.
• Vous devez connaitre le référencement web 

Vous pouvez tester gratuitement leurs services. Ainsi vous aurez un aperçu de ce qu’ils sont capables de faire. Mais ne doit pas devenir votre choix définitif. Un site gratuit vous imposera de lourds sacrifices, vous aurez des fonctions plus que limitées, de la publicité intempestive et un nom de domaine en monsite.wix.fr.Je pense que le côté fonctions limitées, tout le monde peut facilement se rendre compte si l’offre lui convient ou pas. Ils vous donnent un panel d’outil mais pour d’autres, il faudra payer. Mais quand ce n’est pas notre métier, il est difficile de se rendre compte de l’impact de la publicité et du nom de domaine. Comment réagissez-vous quand un encart publicitaire vient perturber votre navigation sur un site ? Une fois c’est un peu dérangeant mais à force ça agace l’utilisateur. Ce dernier pourrait quitter votre page web sans avoir envie d’y revenir. De plus d’un point de vue SEO ce n’est pas bon du tout. Un nom de domaine en monsite.wix.fr ou monsite.jimdo.fr par exemple, ne mettra pas votre image de marque en avant. Contrairement à un nom de domaine en monsite.fr. De plus, ils vous fournissent une version gratuite de votre site et de votre hébergement. Cependant, ceux qui se référencent grâce à vous ce sont les éditeurs de site.  Faire appel à un hébergeur gratuit et ne pas payer de nom de domaine revient à obtenir ce que l’on appelle un sous domaine. Même si, le nom de domaine n’est pas l’élément déterminant ultime, le nom de l’éditeur est présent dans l’adresse de votre site. Ça aide à son référencement personnel ; chaque site hébergé chez eux est rattaché à leur marque. Cependant, ça ne sert pas vraiment le vôtre.

Toutes les plateformes fonctionnent de la même manière ; vous louez une belle maison avec les meubles.Si cette maison est vendue, que vous changez de propriétaire ; vous devrez vous plier aux nouvelles exigences de votre propriétaire ou déménager. Pour un cas concret, vous connaissiez peut-être A Little Market. Ce dernier a fermé et a été racheté par Etsy. Sur ALM, les artisans postaient gratuitement leurs articles. Quand Etsy a racheté l’entreprise, ils ont dû se plier au fonctionnement d’Etsy et ont vu des frais s’appliquer à chaque article ajouté à leur boutique.

C’est la grosse différence avec une prestation freelance. Une fois votre site payé il vous appartient et reste en ligne temps que vous payez « votre facture d’électricité » (votre hébergement et nom de domaine).Vous souhaitez changer d’hébergeur et de nom de domaine ? Vous partez avec votre site dans votre valise. Si vous changer de nom de domaine, il faudra retravailler un peu votre SEO pour rediriger sur les bonnes pages. Avec un éditeur de site web, c’est impossible. Sur ces plateformes, vos mensualités comprises de 30 à plus de 300€/mois (selon les éditeurs) sont totalement perdues si vous résiliez votre contrat. Eh oui, il faudra recréer un site à zéro ailleurs. Cela comprend notamment votre référencement naturel, tous vos textes et images. Tout le contenu présent sur le site, appartient à la plateforme !

Le problème principal c’est que le client n’a pas forcément accès au contenu de son site. Selon les plateformes, la moindre modification, comme une image de fond, doit être faite par le service client.Ensuite, on vend les sites comme étant simples et facile. Le client n’ayant aucune notion en référencement, son site n’est pas optimisé et pensé pour le seo. Au final, il se retrouve avec un site qui lui coute de l’argent mensuellement mais qui est visible à la 10^ème page de Google. Dernier problème également, certaines offres gratuites principalement ou peu cher, vous imposent de la publicité. En terme de référencement vous vous tirez une grosse balle dans le pied. Les sites en multilingues ne sont pas prévus pour ce genre de plateformes. Il est possible de le faire sur le papier. Mais d’un point de vue pratique, votre rendu viendra porter préjudice à votre SEO. Je ne dirai pas qu’il est impossible de trouver un exemple de site sous Wix ou Jimdo ne peut pas finir en première page Google. Si en face de vos concurrents ont un site très mal référencé, que vous avez un référencement minimum ou que vous avez peu de concurrents; vous pourrez ressortir sur des recherches locales. Dans le cas contraire, ce sera extrêmement difficile pour vous.

La plupart des sites utilisent des CMS. Logiciels CMS faits maison, open source… le choix est très vaste. Ils sont la solution idéale en terme de gestion de contenu.Afin de vous expliquer simplement les choses ; prenons un exemple qui vous parlera : Facebook.
Si le site était entièrement en HTML ; pour chaque utilisateur qui se crée, il faudrait passer un coup de fil à facebook pour lui demander de créer une page profil.
En utilisant du php, on crée une page modèle et dans cette page le nom de la personne et ses informations viendront s’y insérer de manière dynamique. Ainsi le modèle de la page profil de Paul sera le même modèle que celui de Tom ou de Julie. Seules les informations contenues différeront.
Les CMS utilisent, entre autre, du php. Ils vous permettent d’avoir une administration pour gérer les options que vous souhaitez, ajouter du contenu … Le tout de manière intuitive.

Reprenons notre exemple. Lorsque vous mettez à jour votre statut facebook,  vous n’utilisez pas de langage informatique mais uniquement un traitement de texte ; ce que vous saisissez apparaît à l’écran. C’est un éditeur WYSIWYG (what you see is what you get).
C’est la magie des CMS.
Alors bien entendu, on peut le fabriquer soi-même en PHP. C’est d’ailleurs ce que font beaucoup d’agences web. Mais, ça vous demandera un autre niveau de connaissances techniques. Tous les cms ont leur spécificité ; certains seront plus axés ecommerce, d’autres blogging ou encore forums.
Maintenant que vous connaissez la définition d’un CMS, il vous faudra choisir celui qui vous correspond et apprendre à l’utiliser.

Chaque CMS opensource ou payant a ses qualités et ses défauts mais surtout son utilité.
Comparons les principaux cms:

WordPress

Gratuit et plutôt simple d’utilisation il ne nécessitera pas d’un gros bagage en connaissances techniques. Sa force vient également de sa grande communauté. On trouve des tutoriaux ou des plugins (fonctionnalités) gratuits ou payants à rajouter à votre site.
De plus WordPress est SEO friendly. Il permet également de créer un site e commerce.
Cet outil, vous permettra de créer un site web facilement. Cependant pour des très grands sites, WordPress aura ses limites. Victime de son succès il faudra également être vigilants sur la sécurité. Le CMS qui occupe les plus grosses parts de marché est forcément celui qui attirera les hackers. Mais là encore, si vous vous formez correctement sur ce logiciel, vous éviterez les problèmes.

Pour ceux qui ont les moyens, une des références reste la gamme Adobe, principalement pour le graphisme. La plupart des « web agency » ou graphistes travaillent avec Photoshop. Cependant, si vous avez un budget limité, Gimp pourra faire le travail.  Notez toute fois que les tutoriels sont plus difficiles à trouver pour ce logiciel.
Pour le code, vous pourrez utiliser Dreamweaver même si je trouve que ce dernier reste trop lourd, pour une utilisation simple.
Dans mes débuts en autodidacte, je l’utilisais surout pour sa partie  » ça code tout seul  »  (wysiwyg). Malheureusement, le code n’était pas propre et apportait plus de soucis qu’autre chose. Le logiciel a peut-être évolué à ce niveau, je ne pourrais vous le dire. En effet, je l’ai abandonné depuis longtemps.
Il existe alors une multitude d’outils gratuits. Un simple bloc-notes windows ou mac peut suffire mais j’ai une petite préférence pour Notepad ++ qui est un bon outil gratuit et simple d’utilisation pour un débutant.

Avant de commencer la conception du site, familiarisez-vous avec le HTML5 et le CSS3. Ces deux éléments sont les bases absolues pour apprendre à développer son site internet soi-même. Bien entendu, pour être performant, il faudra vous spécialiser en approfondissant vos connaissances.
Une page HTML se présente sous cette forme :

<!DOCTYPE html>
<html>
<head>
<title>Title de la page qui apparait dans la barre d'adresse</title>
</head>

<body> 
<div id="Nom-d-identifiant-unique" class="nom-uitilise-plusieurs-fois-dans-le-site">
<!-- Le contenu de votre site-->
</dv>
</body>

</html>

  L’HTML correspond à la structure de votre page ; son squelette. Vous allez construire les fondations de votre maison.
L’habillage et la construction des murs, quant à lui, se place du côté du CSS. Grâce à ce langage web, vous pourrez attribuer des couleurs, des polices ou encore de créer votre mise en page.
Il y a 20 ans, on indiquait le CSS directement dans le code HTML de cette manière :

<!DOCTYPE html>
<html>
<head>
<title>Ma page d'accueil</title>
</head>

<body style=" background-color:red;">
<div style=" background-color:blue;">
</div>
</body>

</html>

 

<!DOCTYPE html>
<html>
<head>
<title>Ma page de contact</title>
</head>

<body style=" background-color:black;">
<div style=" background-color:yellow;">
</div>
</body>

</html>

Cependant, cette technique avait un gros défaut ; si vous deviez faire des modifications il fallait modifier pages par pages…
C’était donc un travail très fastidieux et pas adapté à des gros sites.
J’en avais fait les frais à l’époque en fabriquant moi-même mes premiers sites internet au collège. Croyez-moi rajouter 1 page par épisodes d’une série que vous adorez à la main… imaginez un peu le temps perdu.
La solution est de créer un fichier CSS unique que nous appelons dans notre HTML afin de modifier vos éléments à un seul endroit.

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="monstyle.css">
<title>Ma page d'accueil</title>
</head>

<body>
<div id="identifiant-unique" class="identifiant-reutilisable">
</div>
</body>

</html>

  Ainsi si toutes vos pages possèdent la même structure. On identifie nos éléments grâce à des classes et d’ ids qui sont paramétrés dans le fichier monstyle.css.  

#identifiant-unique{
background:blue;
}

.identifiant-reutilisable{
background:yellow;
}

  En changeant les propriété dans ce fichier unique, tous les éléments portant le nom de « identifiant-reutilisable », par exemple, changeront de propriété.

CSS3 et HTML5 ou CSS et HTML ?

HTML5 et CSS3 font partie des normes web mises en place. L’HTML5 reste du HTML et le CSS3 restent du CSS mais ils ont des propriétés plus poussées . Ces derniers sont surtout reconnus par les différents navigateurs. Ils obéissent à une norme appelée W3C.
Ce dernier point est très important. Vous ne saviez probablement pas, mais chaque navigateur (chrome, firefox…),  interprète le code à sa manière. Internet explorer / Edge est la bête noir de l’intégrateur.  Utiliser les normes W3C, limite les soucis d’affichage entre les différents navigateurs.
De plus, notre ami Google favorisera un code « propre » donc respectant les normes pour le référencement.

L’HTML et le CSS vous fournissent la base. Cependant pour rajouter de la dynamique; un site plus vivant ou des fonctionnalités particulières et répétitives vous aurez besoin du Javascript et/ou du PHP.  Ainsi vous pourrez créer des formulaires de contact,  avoir un site sécurisé, des pages de même apparence mais avec une gestion de contenu automatique.

Le responsive design est la capacité de votre site à s’adapter aux différentes tailles d’écran. De nos jours, 70% des clients potentiels vont visiter votre site depuis leur smartphone et tablettes. Certains même auront un écran 4K.
Ce sont tous ces paramètres qui font que votre site doit s’adapter à toutes les tailles d’écran.
Pour faire un site, il faudra coder en pensant web et mobile.

En langage moins technique, on parlera « d’interface utilisateur » et « d’expérience utilisateur », il s’agit de réfléchir à votre webdesign.
Il faudra construire la structure de votre site afin qu’il soit le plus intuitif possible pour votre visiteur et avoir un design qui plaira à l’internaute .
Statistiquement, un visiteur reste 4 secondes sur un site avant de partir s’il ne trouve pas les informations recherchées. Il faudra réfléchir intelligemment à la place de chaque élément.
Mettez-vous à la place de vos visiteurs.
Vous entendrez parler alors de « zones chaudes » ou encore de « ligne de flottaison ».
Dans l’UI design, on prend également en compte l’arborescence (la structure de votre site) qui est un élément très important pour votre référencement.
Une fois ces parties théoriques acquises, penchez-vous sur le design.

Le site internet de votre entreprise doit être moderne. Pour cela différents outils s’offrent à vous afin de rechercher les designs du moment.

Utilisez tout simplement Google avec une recherche simple « template website 2018 » par exemple ou pinterest, behance qui seront une source d’inspiration.

Mais attention, vos recherches doivent être uniquement une d’inspiration ; venir copier entièrement un webdesign ou un graphisme est une infraction aux droits d’auteurs.

Bien entendu cette étape nécessite la maîtrise de ces deux logiciels. Réalisez le design de chaque page type (celles ayant un design différent) et aidez-vous d’une grille afin d’aligner correctement vos éléments et d’avoir une homogénéité dans votre design.

Une fois ce dernier prêt, il vous suffira de découper vos éléments pour les intégrer.

Vous travaillerez en local, donc sur votre PC, réalisez votre mise en page à l’aide de vos éléments de graphisme découpés et vos connaissances en langage web.

Avant de mettre votre site en ligne, renseignez-vous sur les bases de référencement et modifiez votre contenu, vos images et votre code afin de rendre votre site « SEO Friendly ». Pourquoi est-ce important ?
De nos jours avoir un site internet est devenu plus facile, cependant il faut que vos clients puissent vous trouver parmi les milliards de pages web existantes. C’est ici que votre SEO entre en œuvre. Un bon référencement travaillé, vous permettra d’apparaître devant vos conurrents dans les recherches google.

Votre site est prêt mais il faut encore le rendre disponible sur internet. Il existe plusieurs hébergeurs sur le marché. En France les deux principaux sont OVH et 1and1.
Inscrivez-vous sur la plateforme de votre choix et achetez un nom de domaine en monsite.fr ou monsite.com ainsi qu’un hébergement adapté à votre besoin.

Graphikart vous fourni un excellent tutoriel bien détaillé sur le sujet