mercredi 12 août 2026

Randonnées à Rolleville : un exemple de site de randonneurs

 Voici trois hébergements de ce site :

Sur netlify : https://rollevillerando.netlify.app/
Sur Cloudflare : https://rollevillerando.bhoyez.workers.dev/
Sur Github : https://bernardhoyez.github.io/rollevillerando/

Pour héberger un site, il est nécessaire de disposer d'un compte qui peut être par exemple :

  • Github
  • Netlify
  • Cloudflare
On suppose donc que vous disposez d'un hébergement votre site statique.

Voici le workflow :

1) Enregistrement avec Orux Maps de la randonnée, trace + photos géolocalisées, au format KMZ.

2) Avec Google Earth, simplification du KMZ original : Suppression des tracks, nommage des waypoints. Puis sauvegarde sous un fichier KMZ épuré.

3) Import du KMZ épuré dans la PWA geotour.

Ajout de commentaire, aidé par IA intégrée.
Sauvegarde sous forme d'un nouveau KMZ (pas nécessaire, mais par sécurité)
Déploiement > un fichier ZIP (package)  est créé.


4) Dézipper le package fourni par geotour.

Le site "Randonnées à Rolleville" est bébergé par exemple : 

 https://rollevillerando.bhoyez.workers.dev/ a été généré par l'IA Claude.

ou encore : https://bernardhoyez.github.io/rollevillerando


Accéder à la racine du site, voici un exemple des fichiers :




Dans ce dossier, il y a :

  • un fichier randonnees.json
  • un dossier randonnees

randonnees.json contient par exemple : 

[
  "rolleville-montivilliers",
  "autour-de-villainville_villainville",
  "le_tour_de_l_etang_du_moulin_rolleville",
  "hermeville-maneglise","turretot_rolleville",
  "2026-08-25_090205_rolleville_rolleville"
]

On pourra lui adjoindre d'autres randonnées après une virgule

Le dossier randonnées contient des dossiers de différentes randonnées, en voici le contenu de l'une, généré par geotour :


Un dossier de randonnée contient un fichier rando.json et un fichier vignette.jpg que nous allons ajouter.

Ce fichier rando.json type sera écrit et modifié à partir du fichier suivant, puis téléversé dans la randonnée ajoutée :

{
  "titre": "Autour de Villainville",
  "vignette": "vignette.jpg",
  "visite": "autour-de-villainville.html",
  "kml": "autour-de-villainville.kml",
  "gpx": "autour-de-villainville.gpx",
  "distance": "5 km",
  "duree": "2 h 10"
}

1) Choisir un titre parlant et accrocheur

2) On crée une vignette 800x800 pixels (avec Photoshop par exemple). Cette vignette (on peut laisser vignette.jpg) apparaîtra dans la page d'accueil.

3) On copie/colle les 3 noms de fichiers HTML, KML et GPX

4) On simplifie les distance et durée

5) On ajoutera le dossier de déploiement généré par geotour.

Et voici le portage du site rollevillerando à un autre site de randonnée randovar
 :

https://bernardhoyez.github.io/randovar/
https://randovar.bhoyez.workers.dev/
https://randovar.netlify.app/

Une simplification pour créer une fiche de randonnées avec generateur-fiche.html dans randovar

dans randovar :

generateur-fiche.html est un outil autonome livré pour randovar : on y dépose le zip « Déploiement » exporté depuis geotour, et il :

  • calcule automatiquement la distance et le D+ à partir de la trace,
  • propose une vignette par défaut avec recadrage glisser/zoom,
  • ne demande que le titre et la durée à saisir manuellement,
  • télécharge en retour un zip prêt à déposer dans le dossier randonnees/ du site.

Son but était de remplacer le travail manuel pénible (écriture à la main de rando.json + recomposition manuelle de la vignette).

Aucun commentaire: