Transfonumérique – Transformation Digitale et Numérique

Comment passer son site WordPress en HTTPS (gratuitement)

Savez-vous ce qu’est le protocole HTTPS ? Sinon, il est temps de vous mettre à la page. Les navigateurs modernes mettent en avant des sites de confiance grâce à des pictogrammes très reconnaissables ce qui dégrade le référencement des sites non sécurisés.


Le HTTPS Qu’est que c’est ?

Le HTTPS (pour HyperText Transfer Protocol Secure), est la version sécurisée du protocole HTTP. Maintenant que cela est dit, passons à la description du HTTP !

Le HTTP est un protocole de communication de communication entre le client et le serveur web. Ce n’est qu’un protocole, pas un logiciel, ce qui fait qu’il peut exister de nombreux clients HTTP(Chrome, Safari, Firefox etc..) et de nombreux serveurs différents (Apache HTTP Server, Nginx, ….).

Le HTTPS, donc, est l’utilisation du HTTP couplé avec une couche de sécurité (par exemple SSL) qui permet non seulement de chiffrer toutes les données échangées entre le client et le serveur, mais aussi de confirmer l’identité de votre site web

Pour faire simple le HTTPS est la version sécurisée du http, elle permet de chiffrer les informations que le client donne au serveur pour éviter les attaques pirates.


Quel est l’impact du HTTPS sur le Référencement ?

Vous avez sûrement remarqué ce petit cadenas à coté d’un URL :

Il s’agit d’un site en https, sur ce site vos données sont sécurisées. De plus en plus de personnes reconnaissent ce pictogramme et l’associe à un site sûr et crédible, surtout dans l’optique de réaliser un achat.

Les bénéfices sont intéressants, puisque l’obtention d’un bon certificat SSL peut avoir des impacts indirects sur le référencement naturel.

Notamment en pesant sur le choix des utilisateurs. Ceux-ci sont susceptibles de choisir un site en HTTPS plutôt qu’un autre en HTTP. Plus les sites seront signalés comme non-sécurisés, plus il deviendra important pour les sites marchands d’afficher haut et fort leur sécurisation HTTPS.

 

Maintenant, imaginez : un utilisateur clique sur un lien dans les résultats de recherche google, se rend compte que le site n’est pas sécurisé, et revient en arrière pour en sélectionner un autre. Google perçoit ce revirement comme une marque d’insatisfaction, ce qui impactera le ranking du site en question donc perte de trafic, baisse du CTR dans la SERP et pour les e-commerçants chute complète du taux de conversion.

 


Comment installer le HTTPS sur votre site WordPress ?

 

Pour installer le HTTPS sur votre site WordPress il faut procéder à quelques étapes simples en ce servant de la plateforme CloudFlare.

Mais CloudFlare qu’est-ce que c’est ?

Voici un schéma représentant le fonctionnement de CloudFlare : 

Comme on peut le voir les utilisateurs ne sont pas directement en lien avec le serveur ce qui permet de sécuriser les données personnelles.

Installation

En premier temps on va ce donner rendez vous sur le site de CloudFlare pour créer un compte (si vous n’en avez pas encore un!)

  1. Scan de votre site

Une fois connecté à votre compte vous aller pouvoir ajouter votre site à la plateforme.

Entrer l’URL de votre site, dans mon exemple je vais utilisé l’url « monsupersite.com »   

2. Choix d’une offre

Une fois l’url ajouté a votre compte vous devez choisir une offre, pas d’inquiétude, l’offre gratuite est suffisante pour activé le https.

 

Apres avoir confirmé l’offre, CloudFlare va scanner votre site et afficher toutes les connections DNS de votre site.

 

3. Activation du SSL, Redirection et changement des serveurs avec CloudFlare

3.1. Activer le SSL :

Dans la section SSL/TLS cocher le mode Flexible pour le chiffrement de données.

3.2. Activer les redirections HTTPS

Pour activer les redirections de page « http://monsupersite.com »

vers https://monsupersite.com »

Il faut ce rendre dans la partie « Certificats de périphérie » et cliquer sur le bouton associer à « Toujours utiliser HTTPS »

 

3.3. Changement des serveurs

Dans la section Aperçu vous pouvez remarquer que CloudFlare viens de créer des nouveaux noms de serveur DNS, ces pseudos serveurs vont permettre a CloudFlare de filtrer les données entrante et sortantes afin de sécurisé votre site.

Il faut maintenant remplacer le nom des serveurs pour cela, notre deuxième rendez-vous sera sur le site de votre hébergeur, pour ma part OVH.

Premièrement cliquer sur votre nom de domaine

Ensuite aller dans la partie dédiée au serveur DNS

Pour finir cliquer sur « modifier les serveurs DNS »

Pour finir il vous suffit de copier/coller le ou les nom(s) des serveurs CloudFlare à la place de vos serveurs DNS et d’enregistrer les modifications chez votre hébergeur.

⚠️ Les modifications de serveur peuvent prendre jusqu’à 24h pour être validé (vous serai informé par un email de la part de CloudFlare)

Bravo !  La laison entre votre hébergeur et CloudFlare est faite, maintenant il ne nous reste plus qu’à informer votre site wp de ce changement.

4. WordPress

Dans WordPress on va installer un plugin « CloudFlare Flexible SSL »

Pour installer un plugin -> Extension -> Ajouter

Une fois le plugin activer et la validation reçu de la part de CloudFlare le https est en place.

Votre site est à présent mieux sécurisé grâce au protocole https.

En Conclusion :

La migration de votre site web vers le HTTPS est un vrai plus pour votre business, une mesure de confort et de confiance pour vos utilisateurs. Installer un certificat SSL sur votre serveur ne va pas booster votre SEO ni transformer votre site web en une forteresse inviolable. Mais cela permettra à vos visiteurs de se sentir en sécurité lorsqu’ils vous confieront des données personnelles, qu’il s’agisse d’identifiants de connexion ou de coordonnées bancaires.

Améliorer la mise en cache de votre site WordPress

Comment optimiser la vitesse de chargement de son site?

Tirer parti de la mise en cache du navigateur signifie configurer votre hôte Web pour permettre aux navigateurs de ne télécharger que les fichiers nécessaires, lorsque quelqu’un utilise votre site Web.

Lorsque quelqu’un tente de naviguer sur un site Web à l’aide de son navigateur préféré, celui-ci commence à télécharger le site Web à partir du serveur Web. Au cours de ce processus, le navigateur télécharge non seulement le code HTML de la page Web donnée, mais il télécharge également certaines ressources nécessaires. Ces ressources sont utilisées pour styler et concevoir la page et y activer parfois certaines fonctions javascript.

Nos navigateurs Internet téléchargent tous ces fichiers ensemble et construisent la page dans notre navigateur, afin que nous puissions voir la page conçue avec d’autres éléments multimédias attachés. Chaque fois, notre navigateur télécharge tous ces fichiers sur le serveur Web pour nous en afficher le nouveau contenu. Le cache du navigateur permet à votre navigateur d’ignorer des parties de pages Web précédemment téléchargées. Par conséquent, nous constatons une bonne vitesse de téléchargement de site Web la deuxième fois que nous utilisons le même site Web. Généralement, le cache du navigateur ignore les ressources de la page Web lorsque nous parcourons un site Web pour la deuxième fois. Voici une liste des ressources de page Web téléchargées avec la page Web :

  • Pages HTML
    Fichiers javascript
    CSS (feuilles de style)
    Images
    Vidéos
    Les polices
    Autres fichiers (DOC, PDF, RTF, TXT)

Fonctionnement du cache du navigateur

Il y a une communication cachée entre le navigateur de l’utilisateur et le serveur Web. Lorsque vous chargez une page Web dans votre navigateur, le serveur Web lui indique quand le fichier en cours de téléchargement a été modifié pour la dernière fois sur le serveur.

La dernière heure modifiée joue un rôle majeur dans l’utilisation du cache du navigateur. Pendant que le navigateur télécharge chaque fichier pour créer une page, le serveur Web envoie le dernier horodatage modifié avec le fichier.

Les navigateurs téléchargent et conservent toutes les pages Web et tous les actifs dans des fichiers Internet temporaires. La prochaine fois que vous essaierez de naviguer sur le même site Web, votre navigateur comparera le fichier sur le serveur avec la version locale des fichiers Internet temporaires. Et il ignorera les fichiers distants de la file d’attente de téléchargement.

Votre navigateur est doté d’une fonction intégrée permettant d’ignorer les fichiers de la file d’attente de téléchargement, qui n’ont pas été modifiés sur le serveur, depuis le dernier téléchargement par le navigateur.

Comment exploiter la mise en cache du navigateur?

Les navigateurs Web ont un cache intégré appelé «cache du navigateur». Vous pouvez tirer parti de la puissance du cache du navigateur pour augmenter le débit de votre site Web. Pour accomplir cette tâche, vous devez identifier les fichiers qui ne sont pas souvent modifiés sur votre serveur Web. Vous pouvez également configurer votre serveur Web pour envoyer un en-tête «non modifié» lors de la navigation sur le site Web.

Si le serveur envoie l’en-tête «non modifié» lorsque le navigateur le demande, le navigateur ignore ce fichier. Ainsi, le navigateur de l’utilisateur ne télécharge que les pages et les ressources nécessaires qui sont encore dans la mémoire cache du navigateur et ne sont pas modifiées sur le serveur.

Tirer parti du cache du navigateur dans WordPress à l’aide du fichier .htaccess

Vous pouvez configurer votre serveur Web pour tirer parti de la puissance du cache du navigateur. Cette configuration est normalement effectuée à l’aide d’un fichier sur votre serveur, appelé «.htaccess». Pour configurer votre serveur Web à l’aide de cette méthode, procédez comme suit.

Ouvrez le répertoire de base de votre site Web à l’aide du logiciel FTP.
Ouvrez et éditez le fichier dans votre répertoire personnel.
Rendez-vous à la racine de votre site en ouvrant le dossier « www »

htaccess_transfonumerique_filezilla

Mettez le code suivant et enregistrez le fichier. Vous avez fait la bonne configuration maintenant.

<IfModule mod_expires.c>
Expires Actif sur
ExpiresDefault A0
ExpiresActive On
ExpiresDefault A0

<FilesMatch "\.(txt|xml|js)$">
ExpiresDefault A691200


<FilesMatch "\.(css)$">
ExpiresDefault A691200


<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$">
ExpiresDefault A691200


<FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$">
ExpiresDefault A691200




<FilesMatch "\.(txt|xml|js)$">
Header set Cache-Control "max-age=691200"


<FilesMatch "\.(css)$">
Header set Cache-Control "max-age=691200"


<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$">
Header set Cache-Control "max-age=691200"


<FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$">
Header set Cache-Control "max-age=691200"


Configurer le cache du navigateur avec un plugin WordPress

Si vous ne pouvez pas éditer le fichier .htaccess et mettre le code ci-dessus vous-même, vous pouvez toujours essayer quelques plugins WordPress pour configurer votre serveur. Cette méthode n’est pas seulement facile et pratique pour les utilisateurs débutants de WordPress, elle les aide également à contrôler les comportements des autres serveurs.

Le plugin WP Super Cache fait la même chose pour vous. Si vous souhaitez optimiser la vitesse de chargement de votre page de blog, ce plugin peut le faire avec une méthode en un clic. Ils affirment que vous pouvez effectuer tout le travail fastidieux en un clic et optimiser chacun des éléments nécessaires au chargement rapide de votre blog WordPress. Je reste un partisan du fichier .htaccess qui pour moi reste la solution la plus directe.

Le plugin Humming Bird vous aide à configurer manuellement votre blog dans WP Admin. Ce plugin vous permet également de contrôler l’utilisation de la fonctionnalité de cache du navigateur. Ainsi, les lecteurs de votre blog pourront charger rapidement vos messages dans leur navigateur Web.

 

Pour conclure

L’optimisation des performances de votre site est un enjeu majeur quand on sait que les internautes sont plus de 50% à quitter un site lorsque son temps de chargement est intérieur à 3 secondes, et la norme évolue encore avec l’avènement des smartphones et des connexions 4G. Le premier indicateur à ne pas négliger reste cependant vos images !