Développer et mettre en oeuvre un site Web

(Tous les liens inclus à cette page renvoient à des sites web qui méritent d’être reconnus pour leur apport à l’élaboration de www.savoiretcroire.ca et à son évolution.)

Voilà c’est fait ! Mon premier site web est en ligne depuis aujourd’hui le 20 mai 2013. J’aimerais documenter brièvement dans cette page quelques-unes des principales étapes d’autoformation par lesquelles je suis passé pour parvenir à ce qui semblait hors de ma portée il n’y a pas longtemps encore.

Les repères qui suivent ont balisé ma démarche et pourraient aider d’autres à développer un minimum de capacité et d’autonomie pour publier leur propre site web ou pour modifier un site web qu’ils ont payé un ou des tiers pour mettre en ligne.

1. HTML et CSS

J’ai d’abord pris le temps d’essayer de comprendre les grandes lignes des conventions html et css en m’exerçant à l’aide de tutoriels accessibles gratuitement sur le web comme W3C Web Standard Curriculum, me référant concurremment à d’autres pages comme  W3C Web Design and Applications, puis aux tutoriels html et css du site  HTML Dog.

Ces lectures et exercices m’ont permis de m’y retrouver. Ils m’ont aussi appris où chercher des réponses aux questions qui surgissent lors de l’élaboration d’un site web à partir de fichiers css et html produits par d’autres.

2. Modèles de sites Web et éditeurs HTML

Ce n’est que vers le début de février 2013 que j’ai été en mesure de commencer à pouvoir mettre en forme une page web à partir d’un modèle de gabarit produit par un tiers, Arcsin, à l’aide d’un éditeur html trouvé au hasard de mes recherches, Page Breeze.

C’est par essai et erreur que je progressais et apprenais les rudiments css et html à la base de mon premier site web. J’en vins à trouver plus simple d’éditer mes pages css et html avec Windows Bloc-notes, jusqu’à ce que je découvre  Notepad++ et l’adopte inconditionnellement. Ces outils peuvent, pour la plupart, être utilisés gratuitement, dans le respect de certaines conditions.

3. Transfert de fichiers sur l’Internet et hébergement Web

Ensuite vint la recherche de renseignements précis sur les façons de publier un site web, ce qui me conduisit vers l’outil de téléchargement FTP dit « client »  Filezilla et enfin vers Register4less.com pour l’achat du nom de domaine savoiretfaire.ca, ainsi que pour l’hébergement du présent site dans des conditions intéressantes.

4. Consultation d’un site par des appareils mobiles

J’ai aussi découvert qu’il existe des façons de faire moins complexes que l’on ne pourrait le croire pour rendre un site web compatible aux tablettes et aux téléphones intelligents. C’est une avenue que j’ai longtemps voulu explorer sans avoir le temps de le faire, malgré les pistes découvertes sur Bootstrap.

Depuis le 15 avril 2015, c’est à l’aide du module Mobile Theme du plug-in JetPack et d’un outil de test que j’ai pu, non sans quelque investissement et tâtonnement, atteindre l’objectif souhaité. Depuis le 27 février 2018, WP Touch Mobile offre une interface de navigation mobile cohérente et conviviale.

L’article Google AMP: What Is It and Is It Right for Your WordPress Website? m’aide à faire le point sur la manière de m’y prendre pour avoir recours à la technologie AMP. Mais ces outils interfèrent avec le thème et la navigation de WP Touch Mobile .

5. Enjeux généraux liés au référencement

J’ai développé savoiretcroire.ca sans trop me préoccuper des critères utilisés par les engins de recherche comme Google, Bing, Yahoo, ou Safari, jusqu’à ce que je m’aperçoive que mes pages de langue française étaient faciles à trouver, mais pas celles de langue anglaise ou espagnole. La découverte de Yakaferci.com m’a rapidement aidé à comprendre pourquoi et à cerner les enjeux techniques afférents.

6. Annuaires de sites Web

Je remercie Francité d’avoir rendu mon site accessible depuis le 25 mai 2013, sous la rubrique Francité > Culture et Société > Religion > Bible. Je suis particulièrement reconnaissant à Chrétiens.org d’avoir bien voulu rendre accessible mon site web depuis le 22 décembre 2013 par l’entremise de leur répertoire de sites chrétiens, sous la rubrique : Accueil > Théologie > Herméneutique.

7. Passage d’un site HTML et CSS à un site WordPress

Je me suis rendu compte au fil des mois qu’il était très exigeant de faire évoluer un site Web strictement basé sur les technologies css et html comme l’avait été www.savoiretcroire.ca depuis sa mise en ligne le 20 mai 2013 jusqu’en février 2014, moment où je me suis mis à la recherche d’un système de gestion des connaissances. La difficulté principale était le peu de souplesse pour faire évoluer la structure du site. Ajouter un élément de menu ou en modifier le libellé requérait une modification à chacune des pages du site.

J’ai d’abord élaboré une prototype de site Web à l’aide de Drupal. Les évaluations que j’avais pu lire sur l’Internet m’ont conduit à cet outil duquel l’on semblait privilégier les fonctionnalités multilingues par opposition aux autres produits comparables. J’ai ensuite expérimenté avec un autre outil du même genre, WordPress. C’est ce dernier que j’ai utilisé pour développer la nouvelle interface de www.savoiretcroire.ca qui est en ligne depuis le 13 juin 2014.

8. WordPress (1 de 3) : notions incontournables pour débuter

Mon passage de la logique d’élaboration de sites Web apprise sous Drupal vers celle de WordPress a été facilité par les conseils techniques reçu sur le forum Christianity Board entre le 15 mai et le 15 juin 2014, dans un fil de discussion intitulé Technical Platform for Web Site.

Les réponses ainsi obtenues ont contribué à orienter mes choix et grâce à d’autres ressources m’ont permis de démystifier le mode opératoire de WordPress dont la logique me déroutait au début. Parmi ces autres ressources, il y a eu ThemeShaper. Mon effort pour chercher à comprendre comment utiliser Thematic m’a permis de saisir les enjeux et de les appliquer ensuite au thème que j’ai finalement retenu.

En m’appliquant à suivre les consignes trouvées sur la page Thematic, A WordPress Theme Framework, sous le le lien How to Make a WordPress Theme vers l’article intitulé The Themeshaper WordPress Theme Tutorial.

Par la suite, des sites comme celui de Dominique Leweb m’ont aidé à mieux comprendre ce que je faisais et à identifier des solutions techniques.

9. Gestion de sites Web ou de sites Web chrétiens

Au moment de rédiger la mise à jour de cette page du 14 décembre 2014, j’amorçais une recherche  de forums ou blogues dédiés aux administrateurs de sites Web en général, par ex., Site Owners Forums, the Webmaster Forums,  Advanced HTML for Beginners, Webmaster University, et de sites web chrétiens en particulier, par ex. : Christian Website, Christian Web Resources et Internet Evangelism Day.

La recherche de forums pour webmaster m’a conduit vers un forum pour administrateurs de forums : the Admin Zone (TAZ). Comme il contient aussi beaucoup d’information utile pour le maintien de sites Web en général, je m’y suis inscrit. Il m’aider à explorer la possibilité d’ajouter une dimension interactive au présent site, en lieu et place de la formule qui consiste à laisser un commentaire au bas des pages des articles de blogue, technique que je n’utilise pas et n’aime pas au plan esthétique.

Je m’inscrivais ensuite au WebSiteForums – The ultimate forum for website owners!  pour sa couverture de thèmes liés aux sites Web ainsi qu’aux forums de discussion.

10. WordPress (2 de 3) : gestion d’un site WordPress

Fréquenter the Admin Zone m’a permis d’identifier des ressources utiles pour administrer le présent site Web, par exemple, WP Beginner et Tips and Tricks HQ, puis de comprendre de mieux en mieux les enjeux de sécurité afférents, à l’aide d’outils comme All in One WP Security and Firewall Plugin et WordFence.

Autres découvertes : WordPress Manuals de wpmudev.org; le site Hongkiat.com; le blogue de Mike Matera Dot Com; le Guide Google pour les sites mobiles permettant de tester la compatibilité d’un site (par exemple celui-ci) avec les appareils mobiles; la base de connaissance et le blogue de ClickWP proposent aussi des articles intéressants.

Gérer un site Web c’est aussi demeurer dans un processus d’autoformation pour s’ajuster aux virages que prennent les outils avec lesquels nous travaillons, soit WordPress, ses thèmes, ses extensions ou son infrastructure globale. La sortie de WordPress 5.0 m’a obligé à parcourir le web à la recherche de quelques renseignements pour m’aider à décider si j’adoptais ou non cette mise à jour et son nouvel éditeur Gutenberg. Voici quelques-uns des principaux documents consultés à cette étape de la vie du présent site:

Cette dernière recherche a attiré mon attention sur les mises à jour automatique faites par WordPress pour les sous-versions mineures et même entre versions incrémentales. J’ai découvert dans des articles comme les suivants qu’il est possible de reprendre le contrôle de la manière dont WordPress traite les différents niveaux de mise à jour :

11. Présence Web (1 de 5) : outils d’analyse de l’utilisation d’un site par des tiers

Une recherche sur la manière d’interpréter les temps d’accès et de chargement rapportés par Google Web Masters Tools m’a conduit vers le forum Web Rank Info et à son fil de discussion intitulé Comprendre le temps de chargement d’une page où était mentionnée l’outil Page Speed Insights de Google Developers.

Le besoin de discerner la manière dont le site Savoir et croire .ca est utilisé par les internautes m’a conduit très rapidement vers l’outil Google Analytics, même si ma compréhension des données accessibles par cet outil demeure tout à fait parcellaire.

L’article, Piloter son site avec les statistiques : Découvrir Google Analytics, de Marie Benêteau, offre une introduction intéressante à cet outil, notions approfondies et nuancées par Removing Referral Spam from Google Analytics de Viget, ainsi que par Speed, Focus, Insights: 5 Google Analytics Custom Reports de Kaushik.  Ces articles m’ont aidé à comprendre la nature des visites de durée nulle ou quasi nulle et leur augmentation progressive sur le présent site entre mai 2013 et août 2015.

Cette recherche s’est poursuivie par la lecture d’articles comme 11 Best Web Analytics Tools  de Lou Dubois, The Top 10 Best Web Analytic Tools de Gregory Ciotti, How to Choose the Right Analytics Tools for You? de Search Engine Land et Free and low-cost social media monitoring tools for your business du site canadien BDC Entrepreneurs First.

Les renseignements obtenus par les articles ci-dessus et la recherche afférente m’ont conduit à adopter un certain nombre de nouveaux outils : Piwik et WP-Statistics, pour compléter les résultats obtenus par Google Analytics, notamment pour identifier et comptabiliser mes propres visites (WP-Statistics).

12. Présence Web (2 de 5) : distribution des accès par des serveurs autour du globe

Mes recherches concernant les outils d’analyse d’un site Web m’ont également conduit vers un outil dans une classe tout à fait à part : CloudFlare. Il s’agit en fait d’un service Internet qui consiste à distribuer l’accès à un site Web tout autour de la planète. Si une personne accède depuis l’Asie à un site hébergé en Amérique du Nord, les pages du site canadien lui seront servies depuis un serveur localisé dans ces régions du monde.

Ce service Internet permet donc d’accélérer l’accès pour certains visiteurs de Savoir et croire. ca, puisqu’ils n’ont plus à attendre le délai de quelques secondes supplémentaires pour que les données parcourent la moitié de la surface du globe.

Ce service permet aussi d’enrayer les visites fantômes, c’est-à-dire les fausses visites provoquées par des systèmes conçus pour générer des revenus publicitaires par n’importe quel moyen et comptabilisées par les outils d’analyse des visites humaines.

13. Présence Web (3 de 5) : difficultés de cerner les usages d’un site par des tiers

L’article How to Use Google Analytics: Getting Started de Kristi Heins, publié sur le site Social Media Examiner, m’a aidé à mieux comprendre certaines des fonctions de Google Analytics que j’utilisais déjà, et d’en découvrir de nouvelles.

L’article, Ces chiffres qu’il ne faut pas trop croire dans Google Analytics – publié par Le Journal du Net (JDN) et consulté dans sa révision du 26 janvier 2016 –, fournit des renseignements complémentaires et plus à jour que plusieurs des liens précédents. De plus, il propose une section regroupant plusieurs articles sur les statistiques Web.

14. Présence Web (4 de 5) : accélérer l’accès à un site Web pour ses visiteurs

C’est dans la foulée de cette même recherche visant à comprendre ce qui se passait sur mon site en termes du volume et de l’origine des visites que j’ai découvert les plug-ins suivants : W3 Total Cache et P3 (Performance Plug-in Profiler). L’un aide à accélérer la rapidité d’accès au site, le second mesure l’impact des plug-ins sur les temps d’accès.

15. Présence Web (5 de 5) : identifier les pannes et mesurer les temps d’accès

Le site Is it Down Right Now? permet de vérifier un lien de mon site vers un autre site, tandis que proxy et kproxy  offrent une voie de contournement lorsqu’un site ne m’est plus accessible pour des raisons techniques. Quant au site App Synthetic Monitor, il offre la possibilité de mesurer la rapidité d’accès à mon site Web à partir de dix serveurs répartis à divers endroits de la planète. Par ailleurs What’s My IP Address .org, What is My IP Address .com, MX ToolBox, geoiplookup.net et vpnMentor fournissent d’autres outils utiles à la gestion d’un site.

Outre PageSpeedInsight, mentionné plus haut, d’autres outils permettent de vérifier la performance d’un site Web et sa rapidité d’accès, notamment à partir de diverses régions du monde : Pingdom,  GT Metrix, Web Page Test et App Synthetic Monitor. Ces outils sont intéressants en ce qu’ils permettent de vérifier l’impact de l’intégration de nouvelles fonctionnalités par l’ajout d’extensions (plugins) WordPress.

L’article How to Fix the Leverage Browser Caching Warning in WordPress m’a aidé à comprendre et à résoudre certaines des erreurs identifiées par les outils ci-dessus.

16. Vérifier l’intégralité des liens d’un site Web

Le travail de développement et d’entretien d’un site Web n’est jamais terminé et l’on identifie souvent des besoins auxquels nous n’avons pas immédiatement la possibilité de répondre. Les liens ci-dessous correspondent à des projets de lecture et d’élaboration non encore réalisés, au moment d’écrire ces lignes, le 16 mars 2016 :

Parmi les outils énumérés ci-dessus Online Broken Link Checker est celui qui m’aide le plus à identifier les liens brisés pour des pages extérieures à mon site WordPress, comme par exemple celles du forum PhpBB.  Le nombre limite de pages web qu’il vérifie est supérieur au nombre de pages qu’il y sur mon site et mon forum combiné. De plus, il fournit un accès relativement convivial aux pages web contenant des liens brisés.

17. WordPress (3 de 3) : instance locale de WordPress

Jusqu’ici, lorsqu’un besoin de développement me pousse à vouloir expérimenter avec de nouveaux gabarits ou de nouvelles extensions WordPress, je crée un site dans un espace privé chez mon hébergeur. Mais avec le temps, ces espaces privés se sont mis a consommer de plus en plus de ressources, ce qui me conduisait à les retirer provisoirement tout en conservant une copie récupérable en temps voulu.

Il m’a fallu très longtemps avant de pouvoir découvrir comment procéder pour créer une instance locale de WordPress, c’est-à-dire une version de WordPress qui fonctionnerait indépendamment de mon site Web et même de mon site d’hébergement.

Pour y parvenir il m’a d’abord fallu installer Linux Ubuntu sur mon poste de travail, ce qui est expliqué à même le présent site sous le titre Apprivoiser Linux.

Voici quelques-unes des principales références qui m’ont aidé à atteindre cet objectif :

Les références qui suivent m’ont permis d’identifier les ajustements nécessaires pour terminer la démarche amorcée à l’aide de la série précédente de ressources. Ils m’ont servi non pas à faire l’installation de quoi que ce soit, car l’approche préconisée exige beaucoup d’interventions manuelles réalisées automatiquement à l’aide des présentations précédentes. Par contre, ils m’ont permis de faire les ajustements requis en lien avec, par exemple, l’emplacement des fichiers nécessaires au fonctionnement de WordPress localement sur mon poste, alors que les automatismes n’avaient pas pris en compte certains facteurs précis. Voici ces articles, publiés sur le site de DigitalOcean :

Après avoir réussi mon installation de LAMP sur Ubuntu 14.04, j’ai découvert quelques autres ressources, complémentaires à celles mentionnées jusqu’ici. Par exemple, le fil de discussion, Explication de l’utilisation de LAMP ou XAMP Ubuntu 14.04.4, publié sur le Forum de Ubuntu français, entrecoupe quelques difficultés que j’ai connues moi-même à installer LAMP localament sous Ubuntu. Il propose des pistes de solution qui pourraient m’être utiles à l’avenir, notamment les liens ci-dessous,  tirés des articles 6 et 12 :

18. Services d’indexation web

J’explore le service d’indexation ActiveSearchResult, auprès duquel j’avais soumis mon site web très peu de temps après l’avoir publié en ligne, en mai 2013. Je recevais régulièrement des mises à jour concernant le statut de mon site. Toutefois ce n’est que depuis le 8 février que je me suis formellement inscrit à ce service. Veuillez consulter le lien ci-dessus pour obtenir des renseignements plus précis concernant leurs services.

19. Service de vérification du rang d’un site sur le Web

L’outil Free Alexa Rank Checker vérifie le rang d’un site web par rapport aux autres.

20. Générateur de carte de site (sitemap.xml)

Le service de Online XML Sitemap Generator permet de préciser si l’on veut que les sous-répertoires soient inclus à la carte de site. Cette approche me permet d’inclure le forum et le site à la même carte de site.

21. Outils de mesure de la lisibilité des contenus d’un article

L’un des outils que j’utilise pour m’aider à rendre les contenus de mon site Web accessible aux moteurs de recherche et par eux aux lecteurs potentiels de mes textes a publié un article dans lequel sont rappelés quelques-uns des principes de base pour rendre une communication écrite accessible au plus grand lectorat possible. L’article  s’intitule: How to Use Yoast SEO — The Readability Analysis (en anglais). L’article présente les principes de base de l’analyse de lisibilité de Yoast SEO pour WordPress et fournit des liens vers d’autres articles dont les contenus sont plus détaillés sur le sujet.

L’article Content Analysis: Methodological Choices Explained (en anglais) quant à lui permet de comprendre sur quels métriques précis se fonde l’outil d’analyse de lisibilité.

L’on considère une publication optimisée si elle rencontre les conditions suivantes* :

  • une publication web (un article ou une page) devrait être divisé en sous-sections et chacune des sous-sections devrait contenir moins de 300 ou 350 mots;
  • chaque paragraphe contient moins de 150 ou 200 mots;
  • la longueur optimal d’une phrase est considéré ne pas dépasser 20 mots; un article peut toutefois contenir jusqu’à 25 % ou 30 % de phrases plus longues que 20 mots;
  • de 30 % à 20 % des phrases devraient contenir un ou des mots de transition;
  • de 10 % à 15 % des phrases peuvent être à la voie passive, mais pas plus;
  • l’indice du Flesh Reading Ease doit être au minimum entre 50 et 60, car plus le pointage de ce test est bas, plus l’article est considéré difficile à lire; à noter que ce test a été développé en premier lieu pour la langue anglaise, les résultats obtenus dans les autres langues doivent être soupesés à la lumière des indications de Yoast.

Une pénalité de 2 ou 3 points est accordé pour chacun des critères qui ne répond pas aux barèmes maximaux; toutefois, un article est considéré optimal dans la mesure où les points de pénalité pour l’ensemble d’un article ne dépasse pas les 4 à 6 points. C’est ainsi qu’il faut interpréter les indicateurs de lisibilité rouge, orange ou vert, dans Yoast SEO.

(*) Les chiffres indiqués en gras ci-dessus correspondent à l’optimisation idéale.

22. Passer du protocole HTTP au protocole HTTPS

Selon l’article de langue anglaise, How to Properly Move WordPress from HTTP to HTTPS, Google annonçait que les sites sans SSL (ce qui présuppose le protocole HTTPS) seraient identifiés comme non sécuritaires à compter de juillet 2018. Ce n’est qu’en décembre 2018 que j’ai pris connaissance de ce besoin potentiel d’adopter ce protocole et commencé à recueillir les renseignements dont j’aurais besoin pour aller en ce sens. Mais, il me faut tenir compte également de l’impact de cette modification sur mon forum Phpbb. C’est ici même dans cette section que je documenterai cette transition, si je l’adopte.

Voici donc le début de ladite recherche :

  • Moving (Phpbb) Site Over htpps … Advice (consulté le 19 décembre 2018).
  • Je prends note que «la modification htaccess doit se faire à la racine du domaine» (selon l’inscription du 27 mars 2018, à 23:24, par Steph, dans Redirection Https).
  • L’HTTPS et le référencement naturel sur le site Yakaferci.

23. Autoformation et vie

Savoir et croire .ca requiert des améliorations techniques, j’en suis conscient. Mais il a au moins une vertu non négligeable : il est en ligne, en conséquence de quoi, il peut être consulté par celles ou ceux qui s’intéressent aux thèmes qui y sont traités.

Dans la perspective d’un site qui s’intéresse à la formation autodidacte des adultes incluant l’apprentissage technique, je considère que la motivation fut un des éléments clés qui a permis la réalisation des apprentissages faits pour aller en ligne. Croire que je parviendrais aux résultats attendus a été un autre facteur très important.

Bien que ce site s’intéresse intrinsèquement aux thèmes annoncés par les rubriques Apprendre, Savoir, Croire, Agir, sa préoccupation centrale est exprimée par son titre. Chacun comprend qu’il est impossible d’atteindre des résultats concrets comme la mise en ligne du site web www.savoiretcroire.ca sans adopter une démarche suivie. Ainsi, la connaissance de Christ présentée comme possible dans les Écritures exige non seulement l’œuvre de l’Esprit dans une personne, mais également un effort conscient et soutenu afin de matérialiser cette attente, cette visée, ce désir (2 Pi 1).

N’hésitez pas à participer au forum chrétien la Rencontre, une communauté de dialogue à propos de la foi chrétienne, dont la mission prolonge celle de Savoir et croire .ca. L’une des sections du forum est réservée à certains des aspects techniques discutés ici. Votre participation peut y être faite en français, en anglais ou en espagnol.

Pour me contacter, veuillez suivre les indications sous Questions ou commentaires.

Daniel Garneau,
B Th, B Com, MA,

Mise à jour le 2 mai 2021 : retiré des lien cassé vers :

    • Yakaferceci (Yakaferceci.com (retiré d’une des premières sectinos de l’article et de la sectino 22, Passer du protocole HTTP vers le protocole HTTPS); 
    • Webmaster University (retiré de la section 9. Gestion de sites Web ou de sites Web chrétiens).