Notice technique Corse sauvage 2016
Organisation générale du site depuis 2016
L'organisation actuelle du site utilise toujours la hiérarchisation Joomla en catégories - sous-catégories - articles, à partir de laquelle l'organisation antérieure a été remodélé en trois niveaux comme suit :
- Un niveau Catégorie : ce niveau reprend la page Accueil et les documents Rubriques principales (Maquis, Ravinisme, etc...) du site Corse sauvage avec une présentation associée à chacune de ces catégories
- Un niveau Sous-catégorie : ce niveau reprend le découpage des Rubriques du site en les détaillant en composantes, régions, etc...
- Un niveau Article : c'est l'unité de base de Joomla qui, comme pour un Blog, utilise des modules articles pour faire évoluer le site et pour le mettre à jour. Dans le cas de Corse sauvage, l'article correspond en général à une course, une randonnée, un itinéraire ou un parcours pour les catégories de base (Ravinisme, Canyoning, Escalade, Randonnée, ...), ou bien une sous-catégorie (type de musique pour Musique & Culture corses)...
En dehors de cette forme d'organisation, construite à partir des caractéristiques du CMS (Content Management System) Joomla, le site utilise un "template" (forme de la page) spécifique Corse sauvage, adapté du template Joomla Purity iii diffusé par Joomla Art, avec les caractéristiques suivantes :
- Template gratuit dérivé du modèle T3 Framework : un ensemble open source de cadre de développement de template, flexible et robuste
- Totalement "responsive" : adaptable à toutes les tailles d'écran et aux nouveaux équipements de consultation d'Internet (tablettes, smartphones, ...)
- Support de Bootstrap : incorporation de Boostrap au coeur du template avec les fontes de caractères correspondantes pour renforcer les caractéristiques "responsive" du système
- Nombreux choix de thèmes et de présentations de pages : magazine, corporate, blog, article, etc...
- Largement paramétrable et adaptable : avec des possibilités nombreuses de customisation (ThemeMagic, pages de typographie, menus Méga et mobile, etc... et la compatibilité avec de nombreuses extensions
Les images
C'est la principale utilisation de ce site pour illustrer la richesse et la variété de la nature corse.
Trois types d'images :
- Des images JPEG en deux formats, vignette et grand format, principalement, afin de pouvoir cliquer sur chaque image et l'afficher en grand format. Ces images sont issues de photographies personnelles prises au cours des 20 années passées sur l'île et sont libres de droit. Elles peuvent être utilisées sans problèmes par les visiteurs du site. Pas mal de soucis techniques avec elles, liées à la propension de certains appareils photos numériques à générer des fichiers JPEG avec l'extension .JPG en majuscules, ce qui procure des soucis divers avec les navigateurs d'une part et les sites d'hébergement d'autre part. J'ai donc appris à mes dépens qu'il fallait utiliser les minuscules impérativement pour les extensions de fichiers et que pour les noms de fichiers eux-mêmes, il valait mieux faire de même (minuscules, pas de lettres accentuées, pas de caractères exotiques, ...)
- Des images JPEG personnelles stockées sur flickr et disposant de multiples tailles d'affichage : c'est le système que je privilégie depuis 2007 avec les avantages de pouvoir stocker les photos ailleurs que sur le site hébergeur, de les avoir en plusieurs formats et de disposer de nombreux outils de recherche
- Des images GIF, simples ou animées, qui, en général, ont été récupérées dans des bibliothèques d'outils Web divers
Outils techniques pour les images :
- Mediabox CK, une lightbox multimedia, pour l'agrandissement des photos et images (ainsi que pour la lecture de vidéos en popup) : ouverture d'une fenêtre popup contenant l'agrandissement (ou la vidéo), possibilité de diaporama sur toutes les images de la page, etc... Un outil bien sympa et bien supporté, totalement "responsive", largement utilisé sur ce site pour tous les agrandissements d'images/photos en popup et la lecture des vidéos...
En contrepartie, abandon forcée pour cause de non compatibilité avec Joomla 3 du très bon et très efficace outil de la version précédente, Highslide JS, qui permettait encore plus facilement toutes ces fonctions d'agrandissement et de visualisation en fenêtres popup ! - Slideshow CK, un outil de diaporama avec de multiples réglages et effets, totalement "responsive" et avec l'avantage de pouvoir directement charger des albums flickr. Utilisé pour le diaporama de la page d'accueil du site...
- Turbodemo, outil obsolète de diaporama photos en Flash conservé pour les besoins de l'affichage de vieux diaporamas avec des photos qui ne sont pas dans mon espace flickr. Inutilisable sur les smartphones... mais demanderait trop de travail pour charger et mettre en albums toutes ces anciennes photos de randonnées des années 1980 - 1990 !!
- Flickrembed.com, un site de mise en forme de diaporama à insérer sur un site Internet avec des fonctionnalités importantes pour moi (chargement d'albums flickr, diaporama "responsif"). Utilisé pour les diaporamas d'albums flickr à ouvrir en fenêtres popups avec Mediabox CK...
A remplacé flickrit (devenu Pickljar depuis), site très pratique au début mais devenu payant ensuite et dont les scripts générés antérieurement étaient pollués par des publicités inadéquates et des malwares !
Ces deux outils (Mediabox CK et Slideshow CK) font suite à l'utilisation de nombreux autres outils issus des frameworks Javascript "Mootools" et "JQuery", aux diaporamas "showplus" et "Wowslider", etc... tous plus ou moins dépassés avec l'abandon du Flash et la nécessité de l'adaptation "responsive".
Les outils audios et vidéos et divers
Un seul outil : JW Player
Cette migration et les contraintes des nouveaux sites Internet m'ont obligé à abandonner tous les outils en Flash antérieurs(dewplayer et mp3player_gskin) pour ne conserver que le player vidéo/audio JW Player, dorénavant l'un des plus célèbres sur le Web après avoir été au départ un simple outil (flvplayer) développé par un seul individu, le néerlandais Jeroen Wijering (JW) !
Cet outil a évolué de manière permanente depuis 2005 en suivant les évolutions du Web et les nouvealles tendances : moins de Flash, utilisation des possibilités audio/vidéo HTML5, nouvelles méthodes de compression (H264 et maintenant H265), streaming, etc... Il a aussi été absorbé par une agence de publicité numérique, LongTail Video, qui a pris la marque JW Player en 2013.
Il est désormais le SEUL outil audio/vidéo qui est en oeuvre sur ce site, même si je n'ai pas eu le temps de travailler son apparence, en particulier pour la fonction audio... Un seul problème, il est peu pratique à utiliser pour la visualisation dans des fenêtres popup où il faudrait utiliser des "iframes" et d'autres outils comme Mediabox CK sont alors utilisés.
Exemples d'utilisation de JW Player :
Les autres outils (extensions standards de Joomla 3) :
- La barre de recherche est celle correspondant à l'outil de recherche standard sur un site Joomla tel que proposé par Joomla 3 !
- JCE Editor : éditeur pour Webmaster permettant de rédiger en wiki ou en XHTML les nombreux Articles, Catégories, Modules, ... du site, avec des fonctions évoluées
- JComments : composant permettant de commenter les articles d'un site Joomla avec mise à disposition d'un formulaire de commentaires, d'outils d'écriture avec BBCode, d'outils de mise en page et de mise à jour ! C'est un composant de Joomla 3 à installer comme tel...
- Le widget Météo France : un widget météo spécifique à Météo France très complet, mais très délicat à personnaliser ! Il est installé dans Joomla comme un module HTML spécifique
- DJ Image Slider : c'est un composant Joomla 3 permettant de créer des modules avec diaporamas d'images, photos et textes. Utilisé sur certaines pages du site Accueil, Musique & Culture, Escalade) pour donner des Nouvelles (News) de la catégorie associée...
- BT Content Slider : c'est un module Joomla 3 permettant de créer des diaporamas d'articles, assez sympa et paramétrable. Utilisé sur toutes les pages Blog et pages Articles pour rappeler en tête de page les autres articles de la même catégorie...
- OS Map : c'est un composant correspondant à l'ancien composant XMap (utilisé dans la version précédente du site) qu'il reprend et continue à faire évoluer pour la gestion des plans de site ("sitemaps")
- Clean Talk : c'est un plugin compatible avec Joomla 3 qui permet de mettre en place une fonction antispam sans captcha, extrêmement efficace grâce à un dispositif permettant de distinguer un remplissage de formulaire par un humain de celui effectué par un robot (vitesse de remplissage), plus utilisation de diverses listes noires. Payant, mais cela vaut le coup : depuis que je l'utilise sur Corse sauvage, plus aucun spam et pas de nécessité de filtrer,vérifier et contrôler les commentaires et les inscriptions sur le site !
Les feuilles de style
La hantise pour tous les développeurs Internet ! Evidemment largement utilisées par Joomla 3 et Purity iii, reposant en arrière-plan sur les développements Bootstrap qui, le moins que l'on puisse dire, sont assez compliqués à approfondir, elles posent beaucoup de problèmes pour la mise au point de la forme et des présentations de pages et sont d'ailleurs la principale source de temps passé à mettre au point la migration d'un site Joomla de la version 2 à la 3...
Le CSS 3 avec ses nombreuses nouveautés n'a pas aidé à simplifier la mise au point. Heureusement, dorénavant, tous les navigateurs ont intégré des outils analogues à l'extension Firebug de Firefox qui aide à s'orienter dans les cascades de priorités des commandes CSS et à tester en direct toutes les modifications que l'on tente. Je continue d'ailleurs toujours à utiliser cette extension pour les tests CSS, tant elle semble la plus complète, la plus fiable et la plus pratique.
Avec la version précédente du site, étaient intégrés des thèmes de présentation de pages à choisir par les visiteurs (avec cookies pour conserver leur choix) : choix de la largeur de page, choix de la taille de caractère, choix du jeu de couleurs, choix du format de page (template), ... Pour le moment, cette nouvelle version du site ne permet pas ce genre de fonctionnalité !
Les standards du Web
Depuis le 7 décembre 2009, le site "Corse sauvage" était conforme aux standards XHTML 1.0 Strict et passait avec succès la validation W3C (World Wide Web Consortium) pour les documents DOCTYPE "DTD XHTML 1.0 Strict". En 2009, avec Joomla, il est passé en DOCTYPE "DTD XHTML 1.0 Transitional" pour des raisons techniques et supportait encore les fourches caudines du W3C...
Aujourd'hui, Joomla 3 a adopté le DOCTYPE classique correspondant à HTML 5, "!DOCTYPE html", et j'ai cessé d'essayer d'être en conformité avec le validateur W3C car la plupart des extensions actuellement développées autour de Joomla ou d'autres CMS ne sont elles-mêmes pas conformes...