Multimedia

Création du site web

Multimédia • le 29/02/2020

L'objectif de ce site web est de partager avec ma famille, mes amis, les personnes avec qui j'aimerais travailler, et mes futurs clients l'évolution de ma transition écologique.

Le site en lui même accueille aujourd'hui ma présentation et mes projets. Il évoluera ensuite pour être une vitrine de mes activités professionnelles. Le blog est plus orienté vers les formations, les expérimentations et les échanges que je ferai tout au long de mon parcours.

Inspirations

Le site web est entièrement conçu par mes soins et je me suis inspiré des sites LOW←TECH MAGAZINE, Low-tech Lab, et de mes plateformes que j'ai créé pour mon travail (LifeBoard). J'ai également récupéré des bonnes idées auprès du livre de Frédéric Bordage "Écoconception web / les 115 bonnes pratiques". N'étant pas expert en développement informatique, j'ai fait du mieux que je pouvais pour avoir une interface sobre et ergonomique et utiliser le moins de ressources possible pour éviter de surcharger les pages.

Développement

Langage de programmation : j'ai codé le site en html et css. Je ne me suis pas orienté vers un cms ou un site de création de site web qui m'aurait certainement facilité la tâche. J'utilise le framework Bootstrap pour avoir une architecture "responsible". Le librairie du framework a été allégée pour contenir uniquement les objets dont j'ai besoin pour le site. Je code sur l'éditeur de texte sublime text avec lequel j'ai l'habitude de travailler.

Architecture : le site est développé en statique. Contrairement à un site dynamique qui génère une page web sur demande du client, un site statique stocke de simples fichiers accessibles à tout le monde. Ce qui nécessite moins de puissance de calcul et donc moins d'énergie.

Matériel : le site repose sur un raspberry pi 3 avec une redirection de ma box internet. Un serveur nginx est installé dessus. Des améliorations pourront être apportées plus tard à la manière du Low Tech Magazine ou en choisissant un hébergement "écologique" (Infomaniak, Hostpapa, Ikoula)

Flux RSS : Un flux RSS sera développé pour permettre de suivre les actualités du blog sur un lecteur de flux RSS comme Feedly (pour obtenir le contenu sans avoir à télécharger toute la page web).

Images : Le site utilise un nombre limité d'image et les images sont compressées et redimensionnées pour prendre le moins d'espace possible. Pour ma photo de présentation je suis passé de 192,1ko à 16,1ko avec cette pratique. Soit une image quasiment 10x moins grosse en gardant une qualité raisonnable.

Tests : Plusieurs tests ont été réalisés afin de savoir si le site ne disposait pas d'erreur :