Envoyer un mail à l’auteur
xavier at ultra-fluide.com

Ressources

Nous présentons sur cette page les outils, méthodes et standards que nous utilisons pour la conception technique d'un site web. Les questions relatives à l'interface (le code html reçu par l'internaute) font l'objet d'un autre document interface web.

Ultra-Fluide a développé et continue d'enrichir deux briques d'une infrastructure de modélisation et de développement de site web :

Le développement de cette infrastructure atteint quatre buts :

Ces quatre piliers fondent l'ensemble des fonctionnalités et bénéfices que l'on tire de cette infrastructure.

Pour aller un peu plus loin vous trouverez les développements suivants :

N'hésitez pas à entrer en contact (techno at ultra-fluide.com) pour toute question technique, ou pour évaluer nos capacités d'intervention face à votre besoin.

Plus-values fonctionnelles de l'infrastructure

génération automatique des menus d'un site web

Le ou les menus d'un site se répètent sur l'ensemble des pages. Différentes interventions possibles sur une page (création, changement de rubrique, de nom, d'url...) ont des répercussions sur les menus, puis via les menus sur l'ensemble du site. Ces évolutions introduisent donc un désagréable effet de diffusion qui alourdit la maintenance d'un site. Nos outils suppriment cette tâche ingrate : la notification d'un changement se fait une fois au sein de la description formelle du site et se propage spontanément sur l'ensemble.

gestion des versions d'un site

Un site web qui n'évolue pas, ce n'est pas vraiment un site web. Respecter et intéresser les internautes, donner une image dynamique de son éditeur dépend aussi de la mise à jour régulière et réussie du site. C'est pourquoi nous considérons que la gestion des versions d'un site est importante. La mise en ligne d'une version nouvelle doit se faire sans heurts en limitant les interventions manuelles. Notre technologie permet d'entretenir différentes versions d'un site web "grandeur nature", c'est à dire sans modification des conditions de navigations et des url. L'accès à certaines versions est simplement restreint aux internautes identifiés et donc habilités. Nous préconisons de travailler sur trois versions : ancienne, courante et future. La validation de la version future se fait dans les conditions exactes de l'exploitation pour limiter toute erreur. il est néanmoins possible de revenir en arrière.

gestion multilingue

La gestion multilingue est indispensable dans un contexte international. En fait cette fonctionnalité ne diffère pas techniquement de la précédente. Il s'agit, si l'on généralise le besoin, de disposer pour chaque url de plusieurs contenus ou styles à filtrer en fonction de paramètres externes. Ce filtrage ne dépendant ensuite que de l'imagination (paramètres serveur, http, internaute...). Notre formalisme prévoit un mécanisme de sélection et l'existence d'un nombre quelconque de contenus ou de styles.

vérification des liens

Un site web expose normalement beaucoup de liens, par ses menus mais aussi dans ses contenus. L'évolution constante d'un site conduit à la présence grandissante de liens morts (page renommées, déplacées, supprimées). La présence de liens morts est désagréable pour l'internaute et pénalise le référencement puisque les liens constituent la matière première pour les robots des moteurs de recherche. Notre infrastructure permet le contrôle de l'ensemble des liens d'un site web. C'est typiquement une fonctionnalité à utiliser lors de la validation d'une nouvelle version du site.

impact de la structure du site sur sa notoriété

Le terme de notoriété est a prendre au sens de PageRank, notion développée par Google. Le PageRank d'une page web, donc sa notoriété selon Google, est un des facteurs important permettant à ce moteur de recherche de classer les résultats d'une requête. Cette notoriété est un élément à étudier de près lorsque l'on attache de l'importance à la visibilité d'un site sur ce moteur de recherche. Le PageRank d'une page (d'un site web par extension) est largement influencé par les liens que ce site reçoit de l'extérieur, mais il dépend aussi étroitement de la structure des relations internes à ce site. Nos outils permettent d'établir la matrice des relations internes entre toutes les pages d'un site, puis d'en voir l'effet sur le PageRank de chaque page du site.

génération automatique d'une page "plan du site"

Il est bien utile pour l'internaute de trouver sur un site web, lors de sa première visite notamment, des outils pour s'y retrouver. Selon la taille du site, il peut s'agir d'un moteur de recherche ou d'une page "plan du site". Le plan du site est par essence la page qui change le plus souvent compte tenu du nombre de liens qu'elle contient. Nous avons donc automatisé la génération du contenu de cette page. Notre infrastructure contient également toute la matière utile à un moteur de recherche interne au site.

régularité du style des pages

Il est pratique pour l'internaute de naviguer sur un site dont la présentation et le style sont réguliers d'une page à l'autre : le site est lisible, et l'accoutumance aux conventions choisies est rapide. L'éditeur d'un site doit donc veiller à cette régularité, et toute évolution des conventions doit s'appliquer dans la mesure du possible à l'ensemble des pages. Le webmaster averti utilise couramment les feuilles de style CSS pour cette factorisation, et c'est un très bon outil. Parfois cependant certaines règles ne sont pas de l'ordre du standard CSS. Prenons par exemple la présentation d'un menu à plusieurs niveaux. On peut choisir de le présenter comme une arborescence dont les branches se déplient pour naviguer. On peut également afficher le premier niveau à gauche, et le niveau 2 en haut. Il est également possible d'envisager les menus déroulants. Ces choix ne peuvent être décrits en CSS. Notre infrastructure permet cependant de définir de telles règles, et de les factoriser pour application à l'ensemble du site.

syndication de contenu (RSS ou Atom)

La syndication de contenu a récemment pris un essort important, nombreux sont les sites de contenus qui publient maintenant des flux (voir le principe de syndication de contenus). Notre plate-forme traite les deux versants de la syndication.
L'édition : une page du site web peut être décrite dans le modèle comme contenant un flux RSS ou Atom.
La publication : une page du site web peut être désignée comme faisant partie d'un flux RSS ou Atom, ainsi son URL et ses méta données sont automatiquement intégrées au flux.

Pourquoi factoriser ?

Synthèse :

Les objectifs visés par cette approche sont finalement de trois ordres : réduction des coûts, réduction des délais, augmentation de la régularité. Ces gains concernent autant la phase de développement que la maintenance évolutive. Ce résultat s'explique ainsi :

Développement :

Voyons tout d'abord ce que signifie factoriser. Si l'on poursuit un objectif un peu complexe et global, la factorisation consiste dans un premier temps à décomposer ce besoin en éléments simples. Il reste ensuite à définir un mécanisme qui, partant des éléments simples, donne le résultat et maintient en toute circonstance l'indépendance de chaque élément vis à vis des autres.

Les éléments simples qui composent un site web sont à peu près ceux-ci :

Comment agrège-t-on ces éléments pour obtenir un site web ?
Par l'utilisation de technologies, de techniques, de standards, d'infrastructures que l'on nomme d'un terme assez vague "nouvelles technologies" mais qui concrètement introduisent cette souplesse nécessaire à la fabrication d'un site web dans de bonnes conditions. Bien sûr cet ensemble de technologies se perfectionne constamment. Ultra-Fluide participe pour sa part à cette marche en avant par le développement d'une infrastructure souple fondée sur des standards fondamentaux et éprouvés (XML, XSL principalement).

Cependant pourquoi factoriser ?
Au lancement d'un projet de site web, factoriser permet d'identifier clairement les compétences nécessaires, de définir les périmètres de responsabilités de chaque compétence puis d'intégrer facilement les livrables provenant d'horizons variés. Quels points communs y a-t-il en effet entre le métier, les horaires, le vocabulaire, la culture d'un créateur graphique, d'un rédacteur et d'un informaticien ? Aucun bien sûr, sauf qu'ils vont collaborer au même site web. Il est indispensable de faciliter l'intégration de leurs travaux.
Durant la phase de maintenance factoriser permet de réduire au minimum la distance technique (et donc réduire les coûts et les délais) existant entre une version du site et la version suivante. Différents exemples sont fournis de l'efficacité du concept de factorisation à propos des plus-values attendues de l'infrastructure.
Ainsi modifier le contenu d'une page, changer l'affichage des titres, ajouter une rubrique, ou passer d'un menu déroulant horizontal à une arborescence verticale sont techniquement des contraintes évolutives du même ordre : un unique point d'accès désigné par la factorisation pour enregistrer la modification, puis une propagation structurelle de la modification à l'ensemble du site web.

Notre formalisme

Synthèse :

Nous nous basons sur une description XML (structure d'arbre) du site web. Toutes les notions y sont imbriquées, du global (le site web) aux détails (éléments de contenu, style...)

Développement :

Nous avons défini un langage simple (actuellement un vocabulaire d'environ 30 mots est suffisant) pour définir l'organisation d'un site.
Ce langage s'écrit selon la syntaxe XML. XML est un standard défini par l'organisme de normalisation W3C. Ce standard maintenant bien établi au sein des nouvelles technologies est un méta langage, donc en fait une syntaxe. XML laisse libre quant au sens du vocabulaire utilisé, mais impose que l'information soit structurée sous forme d'arbre. Cette organisation arborescente de l'information est aujourd'hui couramment utilisée et souvent pratique. A titre d'exemple, Html est un langage qui permet de définir une page web selon une structure arborescente.
Notre formalisme décrit donc un site web sous forme d'un arbre. Les notions y sont imbriquées un peu à la manière de poupées russes. D'une certaine manière ce langage pourrait être vu comme une extension de Html : il poursuit l'imbrication des notions au delà d'une simple page web, jusqu'au site complet.

L'arbre synthétique des notions utilisées pour décrire un site est celui-ci :

Le site contient des rubriques, mais chaque rubrique est elle-même habilitée à accueillir d'autres rubriques. Cette récursivité conduit souvent à un arbre beaucoup plus développé que ne le laisse apparaître la liste ci-dessus.

Une rubrique héberge éventuellement un "contenus", container qui rassemble des contenus de diverses natures. Ces contenus sont les éléments nécessaires à fabriquer le contenu d'une page web. Une rubrique contenant un "contenus" est donc représentée par une page web. Dans ce cas la rubrique contient également un style qui défini les règles de présentation des contenus de "contenus". Une rubrique est donc égale à un ensemble de sous-rubriques, à une page web, ou à la réunion des deux. Chaque rubrique peut également appartenir à un ou plusieurs menus.

Un "contenus" (donc l'ensemble des contenus d'une page web) se compose de données "méta", d'un certain nombre de "contenu" et de "menu". Les éléments qui composent "contenus" peuvent être nombreux : ce sont des contenus élémentaires dont on estime qu'il n'est pas utile de les subdiviser. Ils correspondent à une factorisation satisfaisante du contenu. A ce sujet par exemple on peut décider qu'un formulaire utilisé à plusieurs endroits d'un site correspond à un "contenu". Dans le cas d'un site présentant des formulaires nombreux mais chaque fois différents on préfèrera peut être avoir des facteurs plus élémentaires et décider qu'un champ de formulaire est un "contenu".

Nos outils

Synthèse :

Nos outils sont essentiellement développés en XSL, norme spécifiquement conçue pour manipuler et transformer des arbres XML. Au delà de ses fonctionnalités, le bénéfice évident de ce standard réside dans l'extrême portabilité qu'il confère à nos développements.

Développement :

A la lecture des paragraphes précédents il ne pouvait guère y avoir de doute sur les orientations prises pour nos développements : manipuler et transformer des arbres d'une part, présence forte d'XML d'autre part, nous nous sommes donc totalement appuyés sur les standards XSLT et Xpath. XSLT et Xpath sont deux sous-ensembles de la norme XSL, XSL étant un langage défini sur le méta langage XML. Plus précisément, XSLT est un langage permettant d'écrire des transformations d'arbre XML, et Xpath est un langage de requête permettant d'atteindre un noeud (sous-ensemble) d'arbre XML. Hormis l'énorme avantage de répondre parfaitement au besoin, ce choix présente deux atouts précieux :

L'utilisation de nos feuilles XSLT se fait dans deux contextes bien distincts :

En back-office, l'exploitation de ces feuilles XSLT se fait simplement à l'aide d'un éditeur de texte et d'un processeur XSLT. Le choix est vaste en la matière. Nous utilisons habituellement les outils open source suivants : éditeur Xemacs installé avec différents packages dont xslt-process qui connecte sur Xemacs les processeurs Xalan et Saxon (nécessitent une plate-forme java).

L'orchestration des feuilles XSLT sur un serveur nécessite l'exécution d'un petit moteur (mini serveur d'application) qui réagit aux circonstances, donc principalement aux requêtes des internautes, pour délivrer les pages web. Ce moteur existe actuellement en PHP et Java Cocoon. Il ne nécessite que peu de lignes de code.

Un site web peut exister sous trois formes au sein de notre plate-forme :

Les agrégats de contenus et les pages Html sont disponibles soit pour les pages individuelles soit pour la globalité du site en fonction des besoins.

Les feuilles XSLT de notre plate-forme implémentent les fonctionnalités suivantes :

Nous terminons ce chapitre en indiquant quelques ordres de grandeur. Ces chiffres concernent notre site web, 58 pages lorsque ces éléments ont été mesurés.
La description formelle du site était de 25K hors commentaires et DTD, les feuilles de style représentent 35K, les contenus écrits manuellement se montent à 230K, et le volume global du site est de 670K (les 58 pages Html). Remarques : les ressources de type multimédia (images, vidéos, musique...) n'interviennent pas dans ces mesures.

Evolutions prévues

Le niveau atteint par nos outils aujourd'hui est pour nous et nos clients une source de satisfaction : bonne réactivité pour la mise en place d'un site web volumineux, et flexibilité lorsqu'il faut envisager des modifications ou des évolutions d'un site.
Nous prévoyons cependant d'importants axes d'améliorations :


Agence de communication Ultra-Fluide : 01 47 70 23 32 - contact at ultra-fluide.com - 44 rue Richer 75009 Paris.