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 :

Lecteur avec playlist : démarrez et cliquez sur pour accéder à la playlist

Lecteur avec playlist : démarrez et cliquez sur pour accéder à la playlist

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...

La Mecque de l'escalade corse, aussi bien sur le plan sportif avec les blocs et petites falaises équipés par Ghjuvan-Paulu Quilici près du col, que sur le plan voies d'aventure avec la kyrielle de voies, plus ou moins bien équipées, que l'on trouve aussi bien sur les crêtes d'Asinao et de Velacu que sur le flanc Nord du col en descendant sur Sulinzara...
Un régal pour les grimpeurs et une grande variété de voies : certaines peuvent même être les plus hautes de Corse (700m pour A Taula) et demander des marches d'approche impressionnantes...

Bavedda - Pulischellu - 09/2014 :

Mêmes superlatifs pour ce ravin/canyon que pour son jumeau le Purcaraccia, mais dans un cadre naturel complètement opposé, boyau sous verdure contre couloir rocheux dégagé !
On peut en éviter la partie fréquentée en remontant plus haut jusqu'à la cascade à 800m, mais le terrain est moins ludique. Là encore, l'activité qu'on y pratique est bien celle de la balade aquatique, encore plus qu'au Purcaraccia, puisque les obstacles sont faciles et contournables et que la corde n'y est absolument pas nécessaire...

Organisation générale du site depuis 2005

Désolé pour l'ensemble des imperfections que vous ne manquerez pas de remarquer sur ce site, mais il faut savoir que j'étais (et suis encore) complètement débutant en création de sites Web lorsque j'ai commencé sa conception : je ne connaissais rien à HTML et encore moins à la kyrielle de concepts associés (XML, XHTML, XUL, CSS, Java, ActiveX, ...), d'outils de création (Flash, PHP, Fireworks, ColdFusion, ASP, JSP, ASP .NET, ...) et d'outils de gestion de bases de donnés (MySQL, Ingres, SQLite, PostgreSQL, ...).
J'ai donc durement appris sur le tas à quoi servait basiquement tout cela et combien les navigateurs et leurs différentes versions pouvaient interpréter les langages et scripts de travers et différemment les uns des autres. Tout ce monde est complètement fou pour ceux qui souhaitent créer un site simple et ne pas avoir à rentrer en profondeur dans les domaines techniques sous-jacents, ni en faire leur métier !!

La première expérience fut la création du site en 2005 sur la base de pages HTML maladroitement fabriquées à la main avec un éditeur basique : première version du site Corse sauvage avec organisation Accueil/Pages Rubriques/Pages Détails ou Articles Rubriques. Ensuite, ce fut de nombreuses et douloureuses évolutions successives de 2005 à début 2010 pour améliorer l'architecture rustique initiale du site : mise en place de feuilles de style CSS, possibilités de choix de styles par l'utilisateur, intégration de vidéos, améliorations de la navigation, widgets d'agrandissement "lightbox" des photos, migration en XHTML 1.0 Strict, migration involontaire et forcée d'espace d'hébergement (pour cause de rachat de Club Internet), ...

Enfin, en avril/mai 2010, lassé de mettre beaucoup de temps pour réaliser les diverses évolutions du site et instruit de l'intérêt des logiciels Open Source sous licence GNU/GPL (création du Blog Corse sauvage avec le logiciel Dotclear), je décidai de reconstruire le site Web à l'aide du CMS (Système de Gestion de Contenu - Content Management System) Joomla qui permet de mettre en ligne plus facilement des sites "dynamiques" avec des outils pour mettre à disposition de vos visiteurs des services (forum, boutique en ligne, galerie photos, etc.), le tout sans connaissance technique particulière. En outre, comme Dotclear, Joomla utilise le couple PHP/MySQL comme technologies côté serveur, ce qui me permettait de rester dans un environnement technique familier.
L'organisation actuelle du site utilise donc la hiérarchisation Joomla en sections/catégories/articles, à partir de laquelle j'ai remodelé l'organisation antérieure en trois niveaux comme suit :

• Un niveau Section : 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 sections. A noter que, dorénavant, la page Accueil est considérée comme une rubrique parmi les autres...
• Un niveau Catégorie : ce niveau reprend le découpage des Rubriques du site précédent en les détaillant en composantes, régions, etc... comme dans les pages Détails précédentes
• 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 sections de base (Ravinisme, Canyoning, Escalade, Randonnée, ...), ou bien une composante d'une autre section/catégorie (type de musique pour Musique & Culture corses)...

En dehors de cette forme d'organisation, le site utilise un "template" (forme de la page) spécifique Corse sauvage, adapté du template Joomla ja-purity-ii diffusé par Joomla Art, avec les caractéristiques suivantes :

• Choix des largeurs de page : le visiteur peut choisir la largeur de page du site entre écran réduit (760 pixels), écran large (980 pixels) et plein écran (95 % de l'écran avec largeur maximale pour éviter l'élasticité des écrans larges !)
• Choix des tailles de caractères : le visiteur peut choisir la taille de caractères entre 6 tailles disponibles (taille tandard = 3 et agrandissement/rétrécissement par rapport à ce standard)
• Choix des styles : le visteur peut choisir entre 4 styles de présentation du site (essentiellement jeux de couleurs) en fonction de ses préférences (non standard : extension construite par mes soins).

Les images

C'est la principale utilisation de ce site pour illustrer la richesse et la variété de la nature corse.

Les images que j'ai utilisées sont de trois sortes :

• 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. Ces images ont été retraitées à partir des photos originales à l'aide du logiciel de retouche PhotoImpact 12 d'Ulead Systems. 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. Pas sûr qu'elles soient toutes libres de droit !

Ces images sont en général présentées sous forme de vignettes de dimensions diverses et sur lequelles on peut cliquer pour afficher une image grand format (limitée à 900 x 700 pixels au départ, avec un plus grand format dorénavant). Certaines rubriques (Randonnée par exemple) utilisent un outil de diaporama photo pour pouvoir faire défiler un plus grand nombre d'images : l'outil utilisé est un logiciel de production de diaporama Flash, dénommé TurboDemo Album, qui permet de créer des fichiers Flash (.swf) à partir d'un répertoire d'images et de les faire jouer sur les pages du site. Bien que ce logiciel nécessite une licence (payante), il est assez rudimentaire et dispose de fonctionnalités peu nombreuses (autres outils plus puissants sur le site de l'éditeur : turbodemo.com). Avec Joomla, l'outil utilisé pour l'agrandissement d'images est un framework Javascript bien connu appelé "Mootools" qui permet des agrandissements d'images (ou de liens vers d'autres sites) avec un effet dénommé "lightbox" (ou "modalbox" pour les liens vers des sites externes), bien adapté à la visualisation de photos en transparence sur la page du site en cours.

Les outils audios, vidéos et divers

Vous pourrez constater que ce site plutôt dédié à la nature corse comporte aussi une partie consacrée à la musique corse traditionnelle, qui, à mon avis, est étroitement liée à cette nature corse. Il m'a donc fallu trouver au départ quelques outils permettant aux visiteurs d'écouter de la musique avec les paramètres de confort habituels : réglage du son, arrêt et mise en marche, curseur de lecture, liste de lecture, etc...
Bien que Joomla dispose de nombreuses extensions pour m'intégration de fichiers audios ou vidéos, j'ai jugé préférable de conserver les outils antérieurs du site qui m'ont semblé mieux adaptés et plus en pointe pour certains.

1) Les outils audios :

Les outils sélectionnés pour la fonction audio sont les trois outils suivants :

• Un lecteur Flash (dewplayer), que j'ai utilisé, en remplacement du lecteur Java (Freedomaudio) que j'utilisais auparavant pour pouvoir déclencher de la musique à l'ouverture de certaines pages du site (page d'accueil et pages de 2ème niveau) : ce lecteur nécessitait le chargement d'une applet Java depuis le site freedomaudio.com, la première fois qu'on l'utilisait. Malheureusement, le site en question a disparu mystérieusement, en août 2005 et les nouveaux visiteurs ne pouvaient plus charger l'applet. Le lecteur dewplayer est un lecteur Flash très léger et permet de donner les moyens de contrôle du son nécessaires aux visiteurs du site grâce à un petit module mp3 : en particulier à ceux qui ne souhaitent pas de musique et peuvent ainsi la stopper immédiatement. Ce lecteur est beaucoup plus simple que le lecteur Flash mp3 suivant, et, de plus, peut démarrer sa lecture au chargement de la page. Autres avantages: il est plus facile de modifier son apparence que celui de Freedomaudio et lui aussi est très léger. Les seuls problèmes répertoriés sont ceux liés à l'option "autostart" ou "autoplay" qui devrait permettre de lancer automatiquement la musique au chargement de la page et qui n'est pas reconnu par certaines versions de navigateurs : en ce qui me concerne, cela marche toujours Firefox, mais pas avec certaines versions de IE. Dans le cas où la musique ne se lance pas automatiquement, il suffit donc de la lancer manuellement en utilisant les boutons ("Stop") et ("Play") du lecteur dewplayer. Ce lecteur est libre de droit et peut être obtenu via le site estvideo, géré par celui qui a pris le pseudo de dew, et, dorénavant pour les dernières versions, sur le site Alsacréations.

• Un lecteur Flash avec liste de lecture (mp3player_gskin), permettant de placer des morceaux de musique n'importe où dans le site pour que les mélomanes puissent les déclencher s'ils en ont envie, avec tous les contrôles nécessaires. Cet outil a été récupéré libre de droit sur Internet et m'a servi à remplacer l'outil brut de Macromedia (racheté par Adobe) que j'utilisais avant : il permet de régler ses dimensions facilement (euh, en Flash tout de même !), de transformer sa forme et ses couleurs pour le rendre plus attractif. Il n'a comme paramètres que sa liste de lecture sous forme d'une liste des chemins de fichiers mp3 en xml et quelques options à l'ouverture de la page. Ses intérêts sont qu'il est gratuit, qu'il ne nécessite rien d'autre que la technologie Flash dont quasi-tout le monde bénéficie sur Internet, qu'il fonctionne en flux continu ("streaming") mp3, que vous pouvez déclencher un morceau en cliquant dans la liste de lecture rétractable, que vous pouvez quasiment tout contrôler (volume, arrêt, pause, reprise et qu'il ne pèse pas lourd. Vous pouvez aussi vous placer n'importe où dans le morceau mp3 en cliquant sur la barre de progression, ce qui permet de se déplacer dans le fichier à sa convenance. L'inconvénient principal est le fait que cet outil ne semble plus du tout supporté et ne bénéficie plus d'aucune évolution : malgré cela, je l'ai conservé pour ses qualités indiquées précédemment... avec le risque (mineur !) de devoir en changer prochainement.

• 

  L'activation de votre propre lecteur mp3 lancé sur votre station, que j'ai utilisée pour pouvoir déclencher de la musique en cliquant sur des images ou des liens sans avoir à intégrer le lecteur dans la page concernée. Cette technique semble classique et permet de lancer votre lecteur mp3 en cliquant sur un lien (texte ou image) faisant référence à une liste (playlist .m3u) donnant les chemins ou URLs de vos fichiers mp3 concernés : votre navigateur doit être capable de passer le ralais à un lecteur capable de lire du mp3 en flux continu (streaming).

Les morceaux de musique corse utilisés sur ce site sont tous des chants ou chansons corses extraits de CD en ma possession : ils ne sont néanmoins pas libres de droits et vous utiliserez des copies de ces mp3s à vos risques et périls et, de plus, avec des copies partielles !

2) Les outils vidéos :

Au départ, pour la fonction vidéo, j'ai utilisé l'outil proposé par Dotclear dans le plugin DotSound (Cf. Vidéos de canyons corses), qui utilise un lecteur Flash flvplayer, visiblement une plus ancienne version (ou une version simplifiée) du lecteur de Jeroen Wijering décrit plus bas.
Puis, pour le site lui-même, j'ai téléchargé les outils de Jeroen Wijering comprenant un lecteur Flash flvplayer avec pas mal d'options dont l'option liste de lecture.
Il est clair désormais que les "players" de Jeroen sont devenus classiques et que les deux lecteurs ci-dessous sont devenus un seul et même lecteur avec les paramètres permettant d'avoir ou non une liste de lecture :

• Un lecteur Flash sans liste de lecture (FLV Player), permettant de placer des morceaux de vidéos n'importe où sur le site et de les déclencher à volonté du visiteur, avec un minimum de contrôles nécessaires. Cet outil était celui de DotSound qu'on peut trouver sur le Wiki de Dotclear 1 et dont les explications sont ici. Il est dorénavant remplacé par le JW Player de Longtail Video avec les paramètres ("flashvars") excluant l'utilisation de liste de lecture. Le format utilisé par ce lecteur était prioritairement le "flv", celui de Flash, un format vidéo permettant le streaming et conservant aux fichiers des poids très légers !
  Pas mal, en tout cas, en ce qui concerne le rapport qualité/taille du fichier vidéo...
  Ce lecteur JW Player est dorénavant intégré à l'aide du module JW Player de Joomla et lit de multiples formats dont l'un des plus utilisés depuis 2010, mp4 avec codecs vidéo H264 et audio LC-AAC !

• Lecteur avec playlist : démarrez et cliquez sur pour accéder à la playlist

  Un lecteur Flash avec liste de lecture (FLV player)), dorénavant la même version que la version ci-dessus, mais avec une liste de lecture. Ce FLV Player permet un certain nombre d'options supplémentaires par rapport aux versions précédentes : liste de lecture de audios/vidéos, insertion d'une image sur la vidéo au chargement (au lieu d'avoir d'avoir un écran noir), nombreux paramètres de configuration (couleurs, transitions, ...) y compris en mode plein écran... Toutes les informations et les outils à télécharger sur le site de Jeroen Wijering (dorénavant Longtail Video).
  Petit problème, vous devez avoir la dernière version du Flash Player, en tous cas une version relativement récente. Vous pouvez aller la chercher sur cette page du site d'Adobe.
  Le lecteur JW Player est dorénavant intégré à l'aide du module JW Player de Joomla et lit de multiples formats dont l'un des plus utilisés depuis 2010, mp4 avec vidéo H264 et audio LC-AAC !

3) Les autres outils :

• La barre de recherche est celle correspondant à l'outil de recherche standard sur un site Joomla tel que proposé par Joomla !
• Agrandissement d'images en LightBox avec le framework Mootools :
  En novembre 2009, pour que les visiteurs aient à leur disposition un outil d'assistance à la navigation dans le site "Corse sauvage", j'ai introduit les technologies LightBox et ModalBox pour ouvrir à la demande, soit une image agrandie sur toutes les images du site, soit une fenêtre sur un lien, avec des effets de transparence/opacité sur la page en cours et SANS quitter l'application , NI recharger la page...
  On retrouve des outils équivalents dans Joomla, en standard avec le framework "Mootools", chargé par défaut dans Joomla (en particulier avec l'éditeur JCE Editor).
  L'intérêt de Mootools (comme LightBox et ModalBox dans Dotclear) est de fournir des scripts tout préparés et gratuits permettant la mise en place de fenêtres pop-up avec des très beaux effets esthétiques et une visualisation pratique (pour les voyants !) : ces scripts de base s'appuient sur une bibliothèque très connue de scripts de navigation et d'effets graphiques, "mootools" en général pour Joomla (jquery pour Lightbox et Modalbox, en particulier pour Dotclear).
  Vous pouvez en voir une application sur cette page en cliquant sur les images agrandissables ou sur les liens indiqués ci-dessous pour référencer ces outils.
  Sur le plan technique, ce sont des techniques Javascript type Ajax pour créer des fenêtres modales ("modal windows") ou même des séquences de dialogues ("wizards") sans utiliser les fenêtres popup conventionnelles et les rechargements de pages.
  La bibliothèque "jquery" est décrite et documentée sur le site jQuery: The Write Less, Do More, JavaScript Library, alors que les scripts de base "lightbox" et "Modal-Links" sont ceux des "plugins" correspondants fournis autour de Dotclear. La bibliothèque "mootools" est décrite et documentée sur le site Mootools, a compact javascript framework en tant qu'outil Open Source : elle est intégrée nativement dans la plupart des installations Joomla.
• Fin juillet 2010, remplacement des technologies précédentes pour l'agrandissement des images, LightBox et Mootools, par l'alternative Highslide JS : l'intérêt est de d'obtenir plus d'options de présentation et de mise en forme et, en particulier, de pouvoir disposer d'un diaporama automatique simple à mettre en oeuvre sur chaque page du Blog ou du Site pour visualiser TOUTES les photos de la page...
• Intégration des objets Flash selon la technique SWFObject 2 en remplacement des outils d'intégration Adobe, A_ActiveX et AC_RubActiveContent non conformes aux standards, mal maintenus et dépassés.
  La méthode d'intégration que j'ai adoptée est celle préconisée par le projet SWFObject 2, selon la variante dite "statique" et ses deux "objects" imbriqués... Elle n'est pas standard dans Joomla et je l'ai implémentée de manière personnelle.
  Pour les détails, se référer à la documentation française sur SWFObject en cours et aux informations en anglais données sur les pages correspondantes du site de Google.

4) Les extensions et standards de Joomla utilisées dans Corse sauvage :

• L'éditeur JCE Editor : c'est un éditeur pour Webmaster permettant de rédiger en wiki ou en XHTML les nombreux Articles, Catégories, Sections, Modules, ... du site. C'est lui qui fournit en standard la librairie Mootools et les effets de clic sur images ou liens ! En pratique, il est composé d'un composant Joomla (l'éditeur) et d'un plugin à installer sur le site... Le plugin JCEmediabox fournit les fonctionnalités nécessaires pour les effets de fenêtre popup (avec mootools).
• Le "template" ja-purity-ii : c'est un ensemble de scripts fournissant des possibilités de mise en forme élaborées du site avec des pages à 20 positions atteignables, de nombreuses formes de menu dont le méga menu, des personnalisations évoluées... Je ne m'en suis pas privé et vous avez donc sous les yeux une version personnalisée "Corse sauvage" de ja-purity-ii !! Un des templates les plus connus de Joomla!
• Le module Ninja RSS Syndicator : c'est un gestionnaire évolué de flux RSS permettant d'en créer à volonté et de les catégoriser en ayant de multiples paramètres de génération à disposition ! Il est constitué d'un composant de Joomla...
• La gestion de commentaires JComments : il permet 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 à installer comme tel...
• Le module showplus : il permet de constituer des diaporamas d'images et de photos avec de vastes possibilités d'effets et de paramétrages ! Il est installé comme module de Joomla...
• Le module Anythingslider : c'est un module permettant de créer des diaporamas d'articles, assez sympa mais pas très paramétrable sauf en plongeant dans le CSS ; néanmoins intéressant pour une page d'accueil ! C'est un module de Joomla 1.5 à installer comme tel : comme il ne fonctionne pas encore avec Joomla 2.5, je ne l'utilise plus depuis mars 2013...
• Le module météo 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 instalé dans Joomla comme un module HTML spécifique.
• Une importante possibilité de Joomla! a été mise en oeuvre sur le nouveau site : les TROIS fonctionnalités SEF (Search Engine Friendly = Soyez Gentils pour les Moteurs de Recherche :!), URL Rewriting sur le serveur (Apache !) et suffixe URL ont été SIMULTANEMENT actionnées de manière à avoir des adresses simples (SEF), sans index.php à l'intérieur (URL Rewriting) et se terminant par .html et non .php (suffixe URL). Cela ne fonctionne pas chez tous les hébergeurs (URL Rewriting)...
• L'éditeur JCE Editor, dans sa version française, est souvent fourni sous forme d'un package incluant tout un tas d'extensions dont les modules et plugins Highslide JS : ce sont des extensions variées permettant de réaliser des effets de fenêtrages encore plus élaborés, des galeries d'images sophistiquées, des intégrations diverses de code HTML, iFrame, code Ajax, etc... En complément, j'utilise aussi le module Imageloader pour charger des répertoires d'images à insérer dans des diaporamas et/ou des galeries. Highslide JS étant indépendant de Joomla!, l'autre site Highslide JS intéressant à consulter est celui consacré au couplage Highslide/Joomla avec JoomlaNook.
• Exemples de créations de popups Highslide :
  • Dans cet article spécifique, démonstration des diverses possibilités de Highslide JS : elles ne peuvent ( a priori ?) pas être utilisées ailleurs que dans un article (Section ? Catégorie ?).

Les feuilles de style

En juin 2006, j'avais repris la construction du site pour séparer le contenu et la présentation le plus possible et, pour cela, j'ai utilisé les feuilles de styles CSS : le moins que l'on puisse dire, c'est que ce n'est pas de la tarte !

Ces p... de feuilles de styles, même si je n'ai rien à redire quant à la validité de leurs objectifs, souffrent d'inconvénients majeurs dans une utilisation non professionnelle ou occasionnelle :

• La mise au point du code est un calvaire tant le résultat est aléatoire : peut-être peut-on arriver à de meilleurs résultats, mais alors il faut prendre le temps de se coltiner dans le détail les spécifications du W3C ! Bref, le code CSS, c'est pas vraiment "friendly" (convivial) !
• Quand le code est au point et qu'on peut enfin afficher ce que l'on souhaitait dans un navigateur, on s'aperçoit vite que les autres affichent un tout autre résultat !
• Les éditeurs de code traitent très mal le CSS et on a l'impression de coder dans un éditeur de texte standard dans tous les cas !

Pourtant, avec de la persévérance et au prix de beaucoup plus de temps que l'on ne prévoyait, on arrive à des résultats qui apporte les avantages attendus :

• Possibilité de modifier la présentation de ma cinquantaine de pages Web d'un seul coup en changeant deux feuilles de style
• Utilisation de ces feuilles pour modifier dynamiquement (et sans rechargement de pages !) la présentation des pages du site

C'est ainsi que, sur l'ancien site "Corse sauvage", on pouvait choisir le style des pages Titres (Page Accueil, Pages Rubriques, Page Notice Technique, Page Plan et Archives) et le style des Pages Articles Rubriques (pages détaillées de chaque Rubrique).
Même principe dorénavant avec Joomla, mais avec des fonctions plus étendues nativement intégrées dans le CMS et déjà précisées ci-dessus : choix de la largeur de page, choix de la taille de caractère, choix du jeu de couleurs, choix du format de page (template) - non utilisé dans Corse sauvage -, ... Ces fonctions utilisent, en particulier, d'une part une feuille de style par défaut et des feuilles de styles "alternatives" (autant que nécessaire selon le nombre de "styles" souhaités) et, d'autre part, une fonction Javascript capable de changer la feuille de style à la volée sur un choix réalisable sur chaque page. Il est donc nécessaire que l'utilisateur accepte les "cookies" dans son navigateur local pour bénéficier de la conservation de ses choix (largeur de page, taille de caractère, style de page) : sinon, on revient à chaque retour aux choix par défaut !

Les standards du Web

Depuis le 7 décembre 2009, le site "Corse sauvage" était conforme aux standards XHTML 1.0 Strict et avait passé avec succès la validation W3C (World Wide Web Consortium) pour les documents DOCTYPE "DTD XHTML 1.0 Strict".

Avec Joomla, il a été nécessaire de faire une petite régression (virtuelle !), puisque ce CMS utilise le DOCTYPE "DTD XHTML 1.0 Transitional" pour des raisons que j'imagine être celles d'une adaptation plus simple aux divers navigateurs actuels et anciens, avec pas mal de contournements que ne permet pas le XHTML Strict....

Avantages de ces standards :

• Séparation stricte entre le contenu (XHTML) et la mise en forme (CSS et ses feuilles de style)
• Meilleure ergonomie des sites
• Prise en charge par tous les navigateurs modernes
• Meilleure interopérabilité avec les plate-formes techniques (OS, hébergeurs, ...)
• Diminution des temps de chargement
• Garantie d'adaptabilité simplifiée aux futures évolutions du Web et des navigateurs
• Meilleure lisibilité des sites et accessibilité simplifiée

Sans être très sûr de tous ces arguments, j'ai quand même fait l'effort d'essayer de rendre l'ensemble du site valide W3C et il ne me reste qu'à surveiller l'intégration des codes extérieurs (liens partenaires ou sites vidéos par exemple) impliquant des balises "embed" non supportées par le validateur W3C : bizarrement, ce sont les morceaux de code proposés par les sites YouTube et DailyMotion pour intégrer leurs vidéos sur vos sites qui proposent ce genre de code ne respectant pas les standards !

La cible visiteurs

Pour terminer et pour faire comme tous les administrateurs de sites Internet qui indiquent pour quel équipement leurs sites sont "optimisés" !!!

Maintenant que j'ai travaillé sur ce sujet, j'ai bien compris que le terme "optimisé" est en fait un terme qui indique que l'administrateur en mal d'optimisation est en fait quelqu'un qui n'a pas eu le courage, le temps ou la compétence de développer son site en essayant de tenir compte de la diversité de ses futurs visiteurs. Il n'a pas "optimisé", il a plutôt "simplifié" en évitant tous les codes et tests nécessaires pour tenir compte de la majorité des personnes et équipements connectés.

J'ai dorénavant dépassé ce cadre du site "optimisé" grâce à l'adoption de Joomla et les diverses possibilités intégrées en standard :

• Micro-ordinateurs quelconques : le site a été développé et testé à partir d'un PC Windows Vista, mais doit fonctionner avec toute station de travail reposant sur les standards (Mac inclus)
• Affichage quelconque à partir de 800 x 600 : la formule de choix de largeur d'écran permise par la variante du "template" ja-purity-ii de Joomla que j'utilise va de 760 pixels de largeur à une adaptation élastique pour toute largeur d'écran
• Navigateurs Internet Explorer/Microsoft et Firefox Mozilla de base, mais aussi tous les navigateurs standards : IE et FF sont les deux navigateurs que j'utilise et je n'ai pas essayé avec d'autres ; au départ les versions IE 6.0 (2 versions selon Windows 2000 ou XP) et FF 1.0.4 (même version sous les 2 OS), actuellement (mai 2010) IE 8.0 et FF 3.6.3
• Fort débit de connexion Internet recommandé : vu la taille et la lourdeur des pages que j'ai développées, l'agrandissement d'images en format important et le chargement de fichiers musicaux (mp3) ou vidéos (flv) assez volumineux, ADSL et:ou câble haut débit seront d'un bien meilleur confort. Désolé pour le visiteur rural intéressé mais qui n'est pas encore desservi par ces technologies (c'est d'ailleurs mon cas dorénavant en Corse où je me suis installé en mai 2009 !) ou pour ceux qui ne peuvent le supporter financièrement ! Néanmoins, avec Joomla et le découpage des pages en articles, la page est relativement réduite par rapport à la version précédente du site...

En conclusion et pour m'excuser auprès des visiteurs mal équipés, la prochaine étape sera de participer à des cours de création de sites Internet afin de faire mieux la prochaine fois (comme diraient les coureurs cyclistes) !!