Comment sécuriser son site WordPress et anticiper les attaques ?

Comment sécuriser son site wordpress et anticiper les attaques ?

 

 

WordPress est le CMS le plus répandu sur le marché. Sa popularité fait de lui une cible de choix par les hackers.
Malheureusement, beaucoup installent leur site internet et ne prennent pas en compte toute cette partie sécurité de leur interface.

 

mon site wordpress s'est fait hacké

 

Vous avez créé votre site il y a des mois et puis un jour, on se connecte sur son site et patatra… plus rien, plus de site web, tout est cassé…. Avec en prime un joli message d’un hacker…. Et la vous vous dites que vous avez négligé un point important : la sécurité de votre site et sa sauvegarde !

 

Pensez à créer des sauvegardes

Tout d’abord, il va falloir faire des sauvegardes de votre interface.

En tant que particulier ou agence de création de site web, cette étape est nécessaire. Ainsi, vous pourrez récupérer votre site internet en l’état à une date donnée. Pour les professionnels, cela vous donnera une roue de secours si votre client vient faire une mauvaise manipulation.

OVH vous propose une sauvegarde automatique de votre base de données. Cela vous donne déjà une première sécurité.

Ne vous reposez pas uniquement sur cet élément. Pensez à faire vous-même vos propres sauvegardes.

Ne mettez pas tous vos œufs dans le même panier

Lorsque vous mettez en place un système de sauvegarde, veillez à le faire sur des plateformes différentes. Si vous mettez tout sur votre FTP, que le pirate arrive à récupérer ce qu’il souhaite, il va corrompre vos données et vous n’aurez plus rien.

Certains plugins vous proposent de le faire sur un cloud comme dropbox ou google drive ou encore sur votre boite e-mail. Cela vous donnera plusieurs bouées de secours sur lesquelles vous reposer.

 

Quel plugin pour sa sauvegarde ?

 

BackWPup plugin de sauvegarde wordpress

Ce  plugin allemand vous permettra de faire des sauvegardes dans un dossier de votre FTP mais également sur sur des serveurs distants comme :

  • un serveur FTP distant
  • Dropbox
  • Amazon S3
  • Microsoft Azure
  • RackSpaceCloud
  • SugarSync

Dans sa version pro, vous pourrez même envoyer vos données sur

  • Amazon Glavier
  • Google Drive
  • Sur votre boite e-mail

Il vous faudra cependant, dépenser la somme de $69.00 annuelle pour un seul site pour la version pro.

 

 

Updraft plus, sauvegardez votre site wordpress

 

De manière native, ce plugin inclue des sauvegardes planifiées sur différents serveurs distants dans sa version gratuite. En premier abord, il pourra vous donner l’impression d’être une usine à gaz. Mais une fois configuré, il regroupera les fonctionnalités nécessaires à ce dont un utilisateur aura besoin.

  • Dropbox
  • Google Drive
  • Amazon S3
  • UpdraftVault
  • Rackspace Cloud
  • FTP, DreamObjects
  • Openstack Swift

 

Pour ceux souhaitant pousser plus loin, la version payante vous permettra de cloner votre site, de l’utiliser sur des multi sites et de faire des sauvegardes sur

  • Microsoft OneDrive,
  • Microsoft Azure,
  • Google Cloud Storage,
  • Backblaze B2,
  • SFTP,
  • SCP

 

La version payante quant à elle se chiffre à €66 annuels pour un seul site.

Cependant, la version gratuite suffira dans la plupart des cas.

 

Sécurisez votre site web

Le sécuriser avec un plugin

 

Sécurisez votre site wordpress avec Sécupress

J’aime favoriser les acteurs locaux dans mes prestations à mes clients, dans notre cas présent utiliser des plugins français.

Une des références dans le domaine et sans aucun doute Sécupress. Il a la capacité de scanner votre site web et de déterminer le potentiel de sécurité de votre site internet.
Dans sa version gratuite, il résoudra la majeure partie des failles de sécurité.

Cependant, pour certains points, vous devrez coupler ce plugin avec d’autres éléments que je vous indiquerez dans la suite de cette article.

Ce que sécupress ne prend pas en charge dans sa version gratuite :

  • La double authentification
  • Les headers
  • Le scan anti virus de vos données
  • Les attaques de brute force

 

Sécuriser manuellement

Les notions de base :

  • Maintenez votre WordPress et plugins à jour
  • Beaucoup de sites hackés proviennent de cette faille. Un site abandonné, est une porte ouverte aux pirates.
  • Évitez également les plugins qui n’ont pas été mis à jour avec la dernière version de wordpress.

Supprimez les plugins et thèmes non utilisés

Même s’ils sont en veille, ils sont des sources potentielles de passerelles pour les hackers.

Passez votre site en https

A l’heure actuelle, google vous impose une adresse en https, si vous ne le faites pas, il sera perçu comme un site potentiellement dangereux et feront fuir vos visiteurs.

 

L’https est indispensable.
Pour basculer votre site en https, il vous faudra générer un certificat SSL depuis votre hébergeur. Différentes offrent s’offre à vous ; gratuites ou payantes. Il suffira de choisir votre offre parmi celles qu’ils vous proposent comme c’est le cas sur OVH

Les comptes utilisateurs :

Il faut toujours créer votre compte admin avec un nom et mot de passe sécurisé. Le compte administrateur est celui qui aura plus de droits sur votre site internet. C'est pourquoi, si un pirate en prend le contrôle, vous risquez de perdre beaucoup de choses.

Afin de créer un compte admin sécurisé, n'utilisez pas « admin » ou « administrateur » ou administrator ». Les hackers lancent des requêtes à ce niveau. En faisant ainsi, vous créez donc des failles.

Pour le mot de passe, il faut utiliser des caractères complexes.  Cependant, ce n'est jamais facile de retenir un mot de passe complexe. La petite astuce est d'utiliser une phrase ou une expression familière où vous remplacez certains caractères par des chiffres ou caractères spéciaux et en alternant majuscules et minuscules.

Ainsi évitez « Jaimeutiliserwordpress123 »

Mais favorisez « J@iM3uTiL!s3rW0rdPr3ss123! »

 

Désactivez l’inscription de nouveaux utilisateurs si ce n’est pas nécessaire

 

Empêcher la réinitialisation du mot de passe

Nous sommes bien d’accord, cela peut-être contraignant si vous avez perdu votre mot de passe. Mais en cas de hacking, ça évitera à un pirate de changer les accès.

Pour cela, saisissez dans votre fichier functions.php :

function reinitialiser_mdp() {
return false;
}
add_filter ('allow_password_reset',' reinitialiser_mdp');

 

Mais si vous avez perdu votre mot de passe comment faire ?

Un petit tour dans votre base de données et dans la table « votreprefixe_users », sélectionnez votre utilisateur. Dans la table mot de passe saisissez le nouveau avec un encodage MD5.

 

La double authentification :

 

 

Le principe de la double authentification permet de vérifier que vous êtes bien la personne qui demande à se connecter sur le site. De nos jours les hackers ont différents moyens d’essayer de deviner votre identification. Ainsi ces plugins, vous permettent d’utiliser un autre système indépendant de votre site web : sms, QR code, clé cryptée…

 

Google Authenticator – Two-Factor Authentication ou encore  Two Factor Authentication

Sont deux excellents plugins remplissant leur rôle respectif.

Renommez les tables WordPress de votre base de donnée :

Par défaut, lors de l’installation, wordpress vous pré-rempli la base en commençant vos tables par wp_. Cela constitue une faille en soit, donnez-lui un autre nom comme par exemple « sitePlombier5675_ »

Si vous avez déjà fait votre installation, il va falloir renommer vos tables et modifier votre fichier wp-config.php.

Wp channel vous offre un tutoriel détaillé prévu à cet effet 

 

 

Protégez-vous des attaques de force brute

Un des manières d’attaquer votre site c’est de lancer des centaines de requêtes jusqu’à trouver les bons accès grâce à des robots.
Il faudra donc vous munir d’un plugin d’attaque force brute qui bannira une adresse IP au bout de X tentatives de connexion infructueuses.

Il existe beaucoup de plugins de ce genre, comme Brute Force Login Protection ou JetPack

 

Utiliser des clefs de sécurité secrète.

Si ces codes ne sont pas présents dans votre fichier wp-config.php, il existe des générateurs : https://api.wordpress.org/secret-key/1.1/salt/

 

Cacher l’accès à vos fichiers :

Si votre pirate saisi l’adresse http://www.votresite.fr/wp-content il aura accès à tous vos dossiers. Il faut l’en empêcher en modifiant son fichier .htaccess

<Files wp-config.php>
order allow,deny deny from all
</Files>

Options All -Indexes
<Files .htaccess>
order allow,deny  deny from all
</Files>

Cachez votre version WordPress

Dans votre fichier functions.php, indiquez :

remove_action("wp_head", "wp_generator");

 

Cacher les erreurs php  dans votre wp-config.php

ini_set('display_errors','Off');
ini_set('error_reporting', E_ALL );
define('WP_DEBUG', false);
define('WP_DEBUG_DISPLAY', false);

Cacher les erreurs de connexion dans functions.php :

add_filter('login_errors',create_function('$a', "return null;"));

Déplacez votre page de connexion

Par défaut, votre page de connexion se situe à cet endroit :
https://www.votresite.fr/wp-admin.php ou : https://www.votresite.fr/wp-login.php. 
Rien de plus facile pour un pirate de faire des tentatives de connexion.

On évitera de faire la manipulation manuellement pour éviter des soucis lors de mise à niveau. Plusieurs plugins vous le proposent comme par exemple Secupress ou  WPS Hide Login

 

Retirez les erreurs de connexion, le lien de réinitialisation de mot de passe sur votre formulaire de connexion

Certains vous proposent la solution en css, mais cela ne fait que masquer votre lien et ne ne supprime pas. Pour des robots ou des pirates, ce n’est pas une solution efficace.
Mieux vaut supprimer définitivement ces options.

pour cela rendez-vous dans votre fichier functions.php :

Pour la version française de votre site web, saisissez ces lignes :
function supprimer_mot_de_passe_oublie ( $text ) {
if ($text == 'Mot de passe oublié&nbsp;?'){
$text = '';
}
return $text;
}
add_filter( 'gettext', supprimer_mot_de_passe_oublie);

function cacher_erreurs_login(){

return '';

}

add_filter( 'login_errors', ' cacher_erreurs_login');

Utilisez un captcha pour la connexion

Pour ajouter un peu plus de sécurité ; n’hésitez pas à coupler avec Login No Captcha reCAPTCHA qui rajoutera un captcha sur votre page. C'est également une des fonctions proposées par Sécupress.

 

Sécurisez vos headers

Cette partie est bien souvent négligée par la plupart des sites et WordPress a pas mal de failles à ce niveau.

Commencez par faire une analyse de votre site internet sur ce site web :

Un site non sécurisé aura ce résultat :

Sécurirez les headers de vos sites wordpress
Sécurirez les headers de vos sites wordpress

 

Le site vous propose alors les différents éléments à corriger pour rendre votre site plus sécurisé.

Je ne saurais que vous conseiller http-headers

 

Il vous permettra de couvrir tous les soucis de sécurité de votre site internet. Cependant, la mise en place peut paraître quelque peu fastidieuse pour un novice.

Ce petit tutoriel pourra donc vous être utile

 

Voilà vous possédez les outils nécessaires pour obtenir un site interner wordpress sécurisé.
Bien entendu, nul n’est à l’abri d’une attaque malveillante.

Pensez toujours à effectuer vos mises à jour, sauvegarder vos données et utiliser Wordfence comme antivirus de manière régulière pour prévenir toutes les attaques éventuelles.

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

pack icones gilets jaunes

Pack icônes Gilets jaunes

Que l'on soit partisan ou pas du mouvement des Gilets jaunes qui vise à dénoncer la hausse des taxes sur les ménages, personne n'a pu passer à ce coté de ce sujet d'actualité.

Pour l'occasion, je vous propose  un pack d’icônes vectorielles

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

Spiritualdogs, toilettage

superhero

Spiritualdogs, toilettage

Communication web

Campagne de display

Réalisation de différentes bannières pour promouvoir l'ouverture du salon de toilettage de l'entreprise.
Ces bannières ont servi pour la promotion sur la page facebook mais également pour les campagnes de référencement.

 

Elles ont été conçues à partir du flyer réalisé pour l'occasion

logo spiritualdogs educateur canin a perouse

Spiritualdogs

Centre d'éducation canine situé à Perouse dans le Territoire de Belfort. L'entreprise est spécialisée dans le comportement canin

Site web

bannieres salon de toielttage spiritualdogs a perouse inu media a montbeliard dans le doubs

Bannières Salon de toilettage

Spiritualdogs centre d’éducation canine

superhero

Spiritualdogs centre d’éducation canine

Communication web

Intégration du site web

Spiritualdogs,situé à Pérouse dans le Territoire de Belfort, est un centre d'éducation canine proposant des services d'éducation,de toilettage et de pension canine.

Ce projet a été réalisé en collaboration avec Scorpiografx qui a réalisé l'identité visuelle de l'entreprise.

Le site a été entièrement intégré sous WordPress et optimisé pour le référencement.

Afin de répondre aux besoins du client, un système de réservations aux sessions de cours et au toilettage a été mis en place. Les réservations sont synchronisées avec le compte Google Agenda afin que les gérants puissent suivre leurs rendez-vous sans avoir à se connecter au site internet.

spiritualdogs

Spiritualdogs

Centre d'éducation canine situé à Perouse dans le Territoire de Belfort. L'entreprise est spécialisée dans le comportement canin

Site web

site internet spiritualdogs education canine inu media a montbeliard dans le doubs

Site internet responsive Spiritualdogs

Un freelance ou une agence web pour créer votre site internet

Faire appel à une agence spécialisée en communication digitale ou à un freelance pour créer son site web

faut il choisir un freelance ou une agence de communication web pour réaliser son site internet ?
Vous l’aurez compris, créer un site internet demande des connaissances mais surtout du temps à y accorder. Surtout si vous voulez que les choses soient bien faites. Un site internet bien conçu, pourra vous apporter rapidement un retour sur investissement  s’il est bien référencé. C’est pourquoi vous souhaitez confier votre projet web à un professionnel.

Faire appel à une agence de communication ou une agence web.

Une agence digitale est composée d’une multitude de professionnels qui ont chacun leur responsabilité et fonctionnalité :

  • Les chefs de projets coordonnent les équipes, il s’occupe de la gestion de projet
  • Le directeur artistique donnera les pistes à suivre aux graphistes dans la conception de votre identité. Il vérifiera également le travail des graphistes afin de veiller à une cohérence graphique sur travail réalisé.
  • Des graphistes réaliseront le design de votre site internet
  • Les développeurs s’occuperont des fonctions techniques de votre interface. Ils interviennent dans votre développement web afin de créer des fonctionnalités spécifiques à votre site internet.
  • L’intégrateur va réaliser votre site web à partir du travail des graphistes et du développeur.
  • Le rédacteur prendra en charge la création de contenu. La rédaction web est à prendre en compte pour votre référencement
  • Référenceur web s’occupera du référencement naturel ou payant (SEA) de votre site web.

Vous l’aurez compris, au sein d’un même projet, il faudra compter pas moins de 11 intervenants différents qu’il faudra bien entendu rémunérer sur leur temps de travail.
C’est pourquoi le budget alloué à votre site web sera plus conséquent que celui d’un freelance.

Faire appel à une agence ne signifie pas spécialement avoir un site internet à 10 000 €

Bien entendu, le prix dépendra du type de projet dont vous avez besoin. Mais les agences possèdent également des « formules petits prix ». Pour des projets plus communs type sites vitrine, les agences travaillent avec leurs propres templates préfabriqués en internes.

Ces étapes leur permettent d’économiser du temps « homme » sur vos projets. Ainsi, ils auront un panel de sites web ou une structure permettant de créer des sites web rapidement.

Bien entendu vous serez limité dans le rendu final mais cela vous permettra de réaliser un site web à moindres coût par rapport à une formule création de site web complète.

Une agence digitale plus sure ?

Les agences de communication ont également la réputation d’être plus sérieuses, d’avoir pignon sur rue et une grosse société aura plus confiance dans une agence qu’un freelance. En effet, on peut toujours craindre que le travailleur indépendant mette la clé sous la porte. Pour une agence, on accordera plus facilement sa confiance pensant qu’elle sera plus stable économiquement. Cet argument n'est pas forcément valable. Nul n'est à l'abri d'une faillite dans un secteur où la concurrence est rude.

Trouver un freelance pour réaliser votre communication web

Le freelance est un professionnel à son compte (auto entrepreneur ou entreprise individuelle ) qui occupe toutes les casquettes d’une agence (commercial, chef de projet, consultant seo, webdesigner…).

Bien entendu, son côté polyvalent ne fait pas de lui un spécialiste. Travailler en freelance impose de savoir utiliser toutes les techniques des métiers du web en aillant des connaissances plus ou moins approfondies dans chaque domaine.

Un profil se dégagera parmi toutes ses capacités. Certains seront plus graphistes, plus développeurs …

Pour des projets très complexes et très pointus, le freelance ne sera pas forcément adapté. S’il est professionnel et soucieux de vous fournir un travail de qualité, il devra sous-traiter certains aspects de votre projet (surtout s’il nécessite un développement spécifique). Au final la facture sera peut-être plus élevée qu’une agence.

Cependant, pour des projets plus simples type petite boutique e commerce ou encore site vitrine, un freelance correspondra parfaitement à ce dont vous avez besoin. En effet, ce sont des projets plutôt simples à mettre en place qui sont à la hauteur d’un indépendant.

 

Ne cherchez pas le freelance le moins cher !

Malheureusement, ce qui fait la faiblesse des freelances c’est que l’on trouve de tout et n’importe quoi. Trouver quelqu’un de compétent n’est pas chose facile.

Certains vont vous vendre des sites à 100€ et d’autres à 3000€. Au final, le client ne sait plus quoi penser. De plus, l’arrivée sur le marché des plateformes low cost viennent rendre les choses encore plus compliquées et perdent encore plus le client.

Pourquoi sur wix je vais payer mon site 300€/ans alors qu’un freelance, ou une agence, va me facturer le projet dix fois plus cher ? J’ai déjà apporté une partie de cette réponse dans mon précédent article.

 

Alors combien coûte un site concrètement ?

Un site internet vitrine, un tant soit peu sérieux, ne peut descendre en dessous de 1000€. Que l’on soit clair, un site à 500€ est un travail bâclé.

Sur l’instant T cela vous paraîtra intéressant mais vous risquez de ressentir les effets sur la durée. Un travail bâclé vous demandera de faire des sacrifices sur un ou plusieurs de ces points :

  • Sur l'optimisation seo (référencement naturel)
  • L’intuitivité / l’ergonomie
  • Vous n’aurez peut-être pas un site responsive (même si ça se fait rare)
  • Le design
  • Les fonctionnalités
  • La sécurité

Pour des petits tarifs, la majeure partie du temps le freelance achète un thème complet sur une plateforme type themeforest et vous le revend. De son côté, il aura juste à installer votre site web et le remplir avec vos données. En bref, un travail rapide mais pas forcément optimal sur le long terme.

Un des soucis majeurs avec cette technique, au-delà des sacrifices techniques, c’est que votre thème dépendra de ses développeurs. En effet, pour vous garantir un site sécurisé, un des facteurs à prendre en compte c’est la mise à jours de vos éléments que cela soit thème ou plugin. Le jour où votre thème n’est plus mis à jour par ses créateurs, vous devrez repayer votre graphiste pour refaire votre site web.

Ces thèmes comportent le plus souvent des plugins. C’est une porte d’entrée à des bugs. Il peut en effet arriver qu'une mise à jour du thème / plugin  vienne vous créer des soucis de compatibilité et casser votre site.

On peut également compter que des thèmes de ce type peuvent comporter des failles de sécurité si ils ont été mal développés, même si ils sont rares.
Je ne le répéterai jamais assez : un thème doit être l’apparence de votre site et ses fonctionnalités dépendent des plugins. Les tout en un sont à éviter.

Quelle est la meilleure offre pour créer mon site internet ?

Auprès du freelance, assurez-vous que dans le devis :

  • Votre site soit ergonomique
  • Qu’il respecte votre identité visuelle et votre charte graphique
  • Votre site doit être sécurisé et sauvegardé régulièrement.
  • On vous propose des fonctionnalités qui vous correspondent
  • Que votre site soit référencé. Un site non référencé ne sert absolument à rien ! C’est comme acheter une maison mais ne dire à personne autour de vous où vous habitez…
  • On doit vous former sur son utilisation. Lorsque l’on est correct avec son client, la moindre des choses est de montrer une transparence totale et de laisser son client gérer son site internet. Il n’y a rien de pire pour un client de devoir vous contacter pour changer une simple image. Cependant, le freelance doit pouvoir vous proposer une formule de maintenance du site annuelle où il intervient sur votre site si, malgré la formation, vous ne vous sentez pas à l’aise avec l’outil.

 

Attention aux offres mensuelles !

attention aux sociétés de leasing pour votre site web

Freelances ou agences web, certaines vous proposent des mensualités.

A titre d’exemple « votre site pour 150€ par mois avec un engagement de X mois ». Faites bien votre calcul. Un site à 150€/mois sur 5 ans ne vous coûtera pas moins de 9000€. A titre d’exemple, je propose des prestations de création de site vitrine plus de 3 fois moins cher. Le calcul est vite fait…
De plus, chez certains, si vous arrêtez le contrat vous perdez tout. Vous êtes donc engagé à vie !

Ces agences de leur côté passent par des sociétés de leasing C’est-à-dire qu’elles revendent votre projet aux leasers et vous dépendez d’eux pour les mensualités et non plus de l’agence.

Pour être plus claire :
Prenons un site qui coûte 200€/mois au restaurant de Paul. L’agence fait signer le contrat à Paul avec un engagement de 4 ans.
Au bout des 4 ans, le site internet de Paul lui aura coûte 9600€.
L’agence va donc, avec son contrat,  chez son leaser et ce dernier lui rachète le projet un peu moins de 9600€. Ainsi l’agence encaisse directement la totalité de votre projet et il ne dépendra plus d’elle. Paul de son côté sera redevable à un banquier la somme de 200€ par mois sur 4 ans.

Là où ça se complique, c’est si vous devez résilier le contrat. Il est difficile de se débarrasser des contrats avec les leasers. Il existe de nombreux cas de plaintes d’artisans qui essaient de stopper les prélèvements et rompre leur contrat. Et même si vous arrivez à rompre le contrat, parfois votre nom de domaine ne vous appartient pas. Vous le perdez en plus du contenu de votre site internet.
Réfléchissez et lisez bien les petites lignes avant de signer.

A présent, vous aurez tous les paramètres en main pour faire le bon choix dans la création de votre site internet.

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

Créer son site internet avec Wix ou Jimdo ?

Utiliser des éditeurs de sites web

créer son site web c'est compliqué et ennuyant

Pour les très petits budgets et les personnes qui n’ont pas le temps ou l’envie de se former, une des solutions web qui s’offrent à vous sont les éditeurs de sites. Ils vous permettent d’avoir votre propre site internet facilement et rapidement.

Ces plateformes utilisent des CMS; pour rappel il s’agit d’un système de gestion de contenu intuitif.  Ainsi vous pourrez mettre à jour votre site sans aucune compétence technique.

Quel éditeur pour mon site web ou ma boutique en ligne ?

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é e-commerce. 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 coûter cher à un artisan ; les frais occasionnés ne sont pas moindres. Il faut compter 0,20€ par fiche ajoutée (à renouveler), Etsy récupère 5% 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 est é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.

Jetez un œil à ce comparatif: Jimdo ou Wix

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.

Faut-il choisir une plateforme ?

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

c'est pas faux!

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 n'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.
  • Pas de 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.

Mais dans les petites lignes, ça donne quoi ?

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.

« Votre site ne nécessitera aucune connaissances techniques »

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

Une grosse différence entre les offres payantes et gratuites

Vous pouvez tester gratuitement leurs services. Ainsi vous aurez un aperçu de ce qu’ils sont capables de faire. Mais ça 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 tout ça.

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. Ça donne également à votre client/visiteur un côté prestations lowcoast.

Calculez bien votre budget

En premier abord, quand le client novice voit ce que lui coûte un site internet fait par un professionnel; ça lui fait peur.

Il se tourne alors vers ces plateformes pour 30 à 200€ mensuels. Cependant, cumulez toutes ces mensualités sur 5 ans et regardez combien ça vous aura coûté mais également ce que ça vous aura rapporté.

Un de mes clients pages jaunes, a payé pas loin de 800€ par mois sur 3 ans pour un site internet vitrine avec du "référencement". Au final, son site internet lui aura coûté pas loin de 20 000€ pour 300 visites. Sur le devis qu'il lui a été adressé par des professionnels; nous sommes a moins de 5000€ content pour un site similaire et un seo propre.
Vu qu'il est locataire Pajes jaunes, tout ce qu'il aura payé, n'aura servi à rien. En rompant son contrat, son site  so local a été fermé.

Le budget, qu'il aura sauvegardé entre les prestations pro et de la plateformes, il pourra réinvestir dans des campagnes payantes. Les 300 visites en 3 ans pourront devenir des visites mensuelles.  Le budget de son site internet est donc vite amorti.

Vous êtes locataire

Comme je l'ai précisé dans le point précédent, 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.

Si vous voulez déménager vous perdez absolument tout.

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 référencement, la grosse bête noire

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 coûte 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  en première page Google. En effet, wix par exemple, conserve encore des lacunes en référencement naturel mais a clairement fait des efforts à ce niveau. De plus, si en face vos concurrents ont un site très mal référencé, que vous avez un contenu optimisé avec un référencement minimum ou que vous avez peu de concurrents; vous pourrez ressortir sur des recherches locales. Cependant dans un milieu où la concurrence est rude, face à des sites très bien référencés, ce sera extrêmement difficile pour vous.

Il faut bien garder en mémoire que ce n'est pas parce que vous avez un site internet, fait sur une plateforme ou créé par un pro, que tout le monde viendra dessus. Toute prestation devra comprendre un référencement soigné pour avoir des résultats.

Pour conclure, je conseillerai Wix ou Jimdo pour un petit blog familial ou une petite association locale sans prétention. Pour une entreprise, mettez quelques sous de côté et contactez un freelance ou une agence web.

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

Créer son site internet avec un cms

Créer son site internet avec un cms

Vous avez suivi à la lettre mon précédent article et vous vous êtes formé comme une bête sur le sujet pour apprendre à créer votre site en statique. Cependant dans le milieu professionnel, nous n’utilisons plus les sites statiques, nous utilisons des CMS.

J’entends déjà vos pleurs de désespoirs vu que vous n’avez pas dormis depuis 3 mois pour vous former.

Pas de panique ! Vous n’avez pas perdu votre temps mais pour acquérir la technique il faut avoir les bases.

Utiliser un CMS de manière bête et simple sans toutes les notions vues précédemment serait comparable à utiliser un chewing-gum pour coller votre tuyau de canalisation. Ça fait le travail mais pas de manière optimale, on ne sait pas si on aura le résultat attendu dans la durée et ça peut vite tourner au vinaigre en cas de soucis.

 we have a problem

Même en utilisant un CMS, il vous faudra probablement mettre un peu les mains dans le cambouis en retouchant le CSS, l’HTML ou encore le PHP ou Javascript. C'est pourquoi il faut être formé à ces langages. Vous ne serez pas limité dans le rendu souhaité.

Pourquoi utiliser un CMS ?

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.

Lequel choisir ?

Chaque CMS opensource ou payant a ses qualités et ses défauts mais surtout son utilité.

Comparons les principaux:

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 apprendre à utiliser WordPress, je ne saurai que vous conseiller WP Marmite qui vous a mijoté des tas de tutoriels

Joomla

Gratuit et un peu plus complexe que WordPress mais accessible. Il était le plus utilisé avant l’arrivée de WordPress. Mais il reste plus performant pour des sites plus pointus que son concurrent. Joomla a veillé à renforcer sa sécurité depuis quelques années ce qui est devenu son gros point fort. Ainsi grâce à son coté sécuritaire et sa gestion des droits utilisateurs, permettra de réaliser des plateformes intranet ou extranet.

Apprenez toutes les ficelles de Joomla avec web-eau

Prestashop

Il vous permettra de créer un site ecommerce.

Pour des boutiques je ne saurai que vous conseiller Prestashop. Il est plutôt facile à mettre en place également et on trouve des templates pour le personnaliser. Prestashop possède beaucoup de plugins mais malheureusement, beaucoup sont payants et les prix pouvant atteindre 200 à 300€.

 

Choisissez votre apparence et présentez un beau site à vos clients

L’avantage de connaitre les langages de programmation web de base et de maîtriser la documentation de votre CMS, vous permettront de réaliser vous-même votre propre template. Ce sera la meilleure chose à faire pour créer votre mise en page.

Vous pourrez vous baser sur la maquette du site que vous aurez réalisé sous photoshop.
Si cela vous parait trop complexe vous pourrez trouver sur des sites comme codecanyon (themeforest) des thèmes et plugins payants ou utiliser les thèmes de bases de vos CMS.

Cependant prenez garde, obtenir un thème payant peut vous apporter certains problèmes :

  • Tous les thèmes ne sont pas seo friendly
  • Tous les thèmes ne sont responsive, même si cela devient plus rare, certains ne s’adaptent pas aux smartphones et tablettes
  • Certains thèmes payants sont fournis avec des plugins ce qui peut engendrer des soucis techniques.
  • Les thèmes payants sont dépendants des mises à jour du développeur et de votre CMS. Si le développeur arrête de faire évoluer son thème en fonction du CMS, vous pouvez faire face à des soucis de sécurité ou devoir racheter un autre thème.
  • Même dans les thèmes gratuits non officiels, vous pouvez trouver certains contenant des failles de sécurité. Mieux vaut se contenter des thèmes officiellement reconnus comme « sécurisés » par le logiciel.

Je ne saurai que vous conseiller de personnaliser, pour WordPress, les thèmes de bases et officiels. Ces derniers sont gratuits, sécurisés et toujours maintenus à jour.

Pour résumer le thème doit concerner l’apparence de votre site et les plugins les fonctionnalités. Évitez ceux qui font tout en un.

Achetez votre nom de domaine et votre hébergement

Tout comme un site statique, vous aurez besoin de mettre en ligne votre site et d’acheter un nom de domaine pour avoir votre site en monsite.fr ou monsite.com. L’avantage est que certains hébergeurs comme OVH, vous proposent de vous installer WordPress, Joomla ou encore Prestashop sur votre serveur lors de la création de votre compte. Cela vous évite d’apprendre toute cette partie technique.

Installez votre CMS

Si votre hébergeur ne vous le propose pas, il vous faudra installer votre CMS.
Certains vont travailler en local donc sur leur PC et migrer ensuite sur leur serveur en ligne. D’autres installeront et travailleront directement en ligne. L’avantage de la première méthode, c’est que vous pourrez travailler sans être connecté à internet. Cependant, cela vous demandera un peu plus de connaissances techniques.

Pour travailler avec un CMS en local vous devrez :

  • Installer un serveur sur votre machine
  • Créer une base de données
  • Installer votre CMS
  • Remplir et modifier votre site
  • Transférer le tout sur votre nouveau serveur (en ligne) en modifiant les tables de votre base de données.
  • Transférer vos fichiers en ligne via un ftp

 

Pour travailler avec un CMS en ligne vous devrez :

  • Installer votre CMS sur votre serveur
  • Créer votre base de données
  • Remplir votre site

N’oubliez pas l’UX Design

Réfléchir à votre arborescence sera indispensable avant de vous lancer tête baissée. Pensez avant tout référencement naturel!

Révisez vos connaissances en référencement naturel

Les plateformes de création de site (Wix, Jimdo, Weebly..) et les CMS ont la fâcheuse tendance de faire penser à un entrepreneur novice que créer un site c’est facile et qu’on n’a besoin d’aucunes connaissances.
Détrompez-vous! Si vous vous arrêtez à cette étape, vous n’aurez pas le résultat escompté. Il faudra penser à votre SEO en optimisant votre contenu. Vous pourrez vous aider également de certains plugins pour paramétrer votre référencement naturel.

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

Comment créer un site internet ?

Comment créer votre site internet ?

Tout le monde vous le dit autour de vous, avoir un site vitrine pour son entreprise c’est indispensable ! Si vous n’avez pas de site web, vous n’êtes pas visible.

Vous voulez coder votre site internet vous-même

Dans ce premier article, nous allons détailler les étapes pour développer son propre site statique (notez bien ce terme).

Vous êtes motivé et vous voulez vous lancer dans l’aventure de créer votre site de A à Z.

 

Pour créer un site web professionnel, il vous faudra endosser plusieurs étiquettes : intégrateur, UX/UI designer, graphiste et référenceur web. C’est à cette étape que certains d’entre vous se rendent compte que ça sera probablement plus difficile qu’il ne le paraît.

En effet, vous faudra vous familiariser avec les connaissances techniques et théoriques

Installez les bons outils nécessaires à votre projet

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.

Apprenez les langages web.

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-->
</div>
</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.

Donnez un côté dynamique, tournez-vous vers le Javascript et le PHP.

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.

Familiarisez-vous avec la notion de « site responsive »

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.

Il existe de nombreuses plateformes qui vous proposent des cours payants ou gratuits afin de vous former.

L’UI/ UX Design

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.

Recherchez les tendances

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.

Réalisation  de la maquette sur Gimp ou Photoshop

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.

 

Intégrez votre site internet

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.

 

Familiarisez-vous avec le référencement naturel

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 concurrents dans les recherches google.

Achetez un nom de domaine et un hébergement et mettez votre site en ligne

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. Je dois avouer que certains commencent à se faire un nom comme O2switch. Il vous faudra alors trouver la bonne offre.

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.

Utilisez un logiciel FTP pour mettre votre site en ligne.

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

A présent vous avez les connaissances informatiques, graphiques pour créer votre page web optimisée.

 

Comment font les professionnels ? Utilisent-ils les mêmes techniques pour créer un site internet ?

 

aurelieschmitt

Après 10 années en temps qu'infographiste salariée, j'ai ouvert ma société freelance après la naissance de mes jumeaux. Ainsi, j'accompagne mes clients dans la conception de l'identité de leur entreprise

logos

Une identité visuelle

Besoin d'un logo pour votre entreprise ? Inu Média réalise une identité forte vous démarquant de vos concurrents.

encart-suppers-commnication

Vos supports de communication dès 150€

Faites réaliser vos flyers, cartes de visite ou logos professionnels par Inu Média à Montbéliard

site internet pas cher pour collectivites inu media a montbeliard dans le doubs

Votre site vitrine clé en main dès 1400€

Un site web intuitif, responsive, sécurisé et optimisé SEO

Mon kiné connecté

Mon kiné connecté

Webdesign

Conception d'une maquette web

Tout comme la plateforme mon docteur, Mon Kiné Connecté a pour but de trouver les praticiens de kinésithérapie autour de chez soit.

Le logo fourni par le client était dans des couleurs pourpres et bleu. Le pourpre symbolise la principale cible: les femmes. Le bleu rappelle les couleurs du monde médical. Dans la majeur partie des cas, les femmes ou parents sont ceux qui ont besoin de leur service pour notamment trouver un professionnel pouvant traiter la bronchiolite du nourrisson.

Chaque professionnel pourra donc s'y inscrire en indiquant son adresse, les horaires d'ouverture du cabinet. Ils pourront également préciser si ils effectuent ou non des visites à domicile. La plateforme tient également à rassembler le noms des kinés de garde dans les départements. Les couleurs utilisées sont en adéquation avec celles présentes dans le logo.

Le client souhaitait la présence d'un google map afin de cibler directement les cabinets dans une zone géographique prédéfinie par le moteur de recherche. L'utilisation d’icônes a également été demandé par le client afin de symboliser les différentes spécialités des kinés.

logo_kine

Aurélien Thomas

Kinésithérapeute en Loire Atlantique

site-internet-mon-kine-realise-par-inu-media

Page d'accueil mon kine

icones-du-site-internet-mon-kine-realise-par-inu-media

Icônographie