Bonnes pratiques : comment gérer les sous-unité de page HTML ?

tout d'abord bonjour à tous, et merci pour vos très interessantes contributions.

Très sensible aux bonnes pratiques, standards et préconnisation si ardemment défendues par ce site, j'aimerais avoir votre opinion sur un problême récurent, et inévitable lorsqu'on développe un site dynamique.

Je vais essayer en deux mots d'exposer mon problême, pour lequel je n'ai trouvé aucune proposition qui me satisfasse lors de mes recherches sur le net. J'espère avoir posté dans le bon forum, si ça n'était pas le cas, n'hésitez par à déplacer ce post.

Le mieux c'est encore de partir d'un exemple : mon site est constitué de deux pages : une page de recherche de document et la page d'affichage d'un document. J'utilise pour coder chacune de ces pages : - un script en php, chargé de la compilation des données, - un template en html, décrivant la structure logique de ma page, et - une feuille de style css pour la présentation à l'écran.

Ces pages sont constituées d'éléments disparates : un bandeau, une barre de recherche rapide, etc. parfois réutilisables d'une page à l'autre, et, de plus, sont variables en fonction du type de document affiché. Bref, la page n'est qu'une unité d'affichage, mais pas une unité logique
Jusqu'à présent, je n'utilise qu'un seul template par page : je duplique les partie en commun, et les parties modulables sont selectionnées par un bloc conditionnel dans le template.
( On voit qu'on peut référencer deux types de ces sous-unités :
- sous unités d'interface, des elements invariant sur l'ensemble du site.
- sous unités de contenu, un contenu modulable sur une page.
C'est surtout le second type d'unités qui me parait délicat à gérer, pour le premier, une duplication du code, si elle n'est pas toujours pratique, ne contrevient pas aux standards)


A ma connaissance, il n'existe pas de sous-unité de page HTML. Quelques solutions consisteraient :
- à utiliser des frames, mais il me semble qu'en xhtml, ce type de pratique est déprécié.
(et c'est la même chose pour la la balise iframe, non ?)
- à utiliser une insertion d'élément avec la balise object : je connais mal cette balise, il me semble qu'elle est peu utilisée : pour des raisons d'accessibilité ? de plus elle suggère une insertion d'un élément extèrieur à la page, ce qui n'est pas mon problême, qui consiste plutôt à composer une page à partir de sous unités.
- à s'en remettre entièrement au scriptage php, en incluant éventuellement des bouts de page html, une pratique impossible à valider selon les standards xhtml. (une explication de cette technique, par exemple, http://css.alsacreations.com/Tutoriels-PHP/Inclure-un-fichier-dans-un-autre-grace-a-CSS-et-PHP )

Idéalement, j'aimerais que toutes ces sous-pages se suffisent à elles même (qu'elles contiennent leur propre liens css et script, donc qu'elles possèdent un en-tête) de telles sortes qu'on puisse les réutiliser dans des contextes différents (une aide à la recherche, par exemple, pourrait être chargée à partir d'une même source pour être affichée sur deux sites différents, dans deux environnements différents).

Quelles sont les bonnes pratiques en la matière ? comment gérer élégament une sous-unité infèrieure à la page ?

merci d'avance pour vos reflexions.
Modifié par lex (29 Jan 2007 - 10:14)

Heu...

Je suis pas sûr d'avoir suivi l'ensemble du discours. Concrètement, à quoi ressemblera une « sous-unité de page » ?

En général, en PHP, on procède ainsi :
- gabarit principal avec doctype, head, body ;
- suivant les tests effectués, on génèrera dans le body le code de tel ou tel élément ;
- on met en forme le tout avec les CSS.

Sauf contrainte forte, je vois pas trop la raison de se mettre martel en tête avec des frames, object, machin.

Pour les éléments facultatifs, le code relatif (script, code HTML à générer) peut très bien se trouver dans des fichiers à part. Ne pas oublier que PHP permet de générer le code d'une page HTML complète, et que la fonction include() (par exemple) n'incluera pas une page HTML dans une autre, mais un bout de code dans un autre code.

un exemple sera probablement plus parlant :
Sur une page, j'ai un outil qui me permet de parcourir et d'afficher les index de ma base ; sur la même page, je peux aussi effectuer une recherche dans cette base. Ces deux fonctionnalités sont indépendantes, et j'aimerais bien qu'elles se présentent sous la forme de pages à part entière (php+html+css), reutilisables en combinaison, voire même affichable telle quelle.

En l'état actuel des choses :
mon script php inclue éventuellement les scripts propres à chacune de ces fonctionnalités, scripts qui "rendent" chacun un morceau de pages html (sans en-tête) à partir d'un template ; chacun de ces rendus, va instancier telle ou telle partie du template de ma page principale (raison pour laquelle ces rendus ne doivent pas posséder d'en-tête).
Si l'envie m'en prenait, je ne pourrais pas executer simplement un de ces scripts pour rendre une page totalement indépendante.

Plus prosaïquement, la multiplication de blocs conditionnels dans mes template html les rendent difficilement lisibles ( j'utilise un moteur de template léger, et à chaque partie modulable de ma page, un bout de code en php conditionne le code HTML qui suit : ce qui fait que dans une même page HTML, j'ai le code de chaque version du "module". ce serait bien plus maintenable/réutilisable si j'avais une page par version de se module, laquelle page pouvant être incluse ensuite dans ma page principale ).

J'aimerais bien éviter de développer des sous-pages en HTML qui ne soient pas complétées par un entête en bonne et due forme ; ceci entre autre pour pouvoir manipuler des modules complétement indépendant (possédant leur propre information css et script). Tout en conservant bien, et c'est là que réside la difficulté, la séparation donnée-structure logique-présentation

Je ne suis pas sûr d'être plus clair. Mais bon, toute contribution sera la bienvenue, vu que je n'ai aucune idée nette de la façon de faire ça proprement.

Bonjour,

le <div> me semble un bon candidat. Ca n'apporte pas grand chose et c'est pas difficile: c'est une balise de type bloc qui en englobe d'autres et qui n'a à peu près (ou pas du tout?) de valeur sémantique. Au moins chaque sous-unité (pour un Doctype en XHtml) fermera correctement ses balises et rendra chaque page valide sans difficulté ...

En prenant le problème par l'autre bout: un site web a une certaine unité dans chacune de ses pages, un design assez reproductible. Si tes sous-unités ont besoin d'une feuille de style différente selon la page où elles sont insérées, je prédis un fameux b..oxon
Si c'est pour rendre ces sous-unités réutilisables d'un site web à l'autre, là c'est au-delà de mes connaissances mais a priori je dirais qu'il faudrait qu'un fichier de configuration suffise à modifier tes scripts, en ne perdant pas de vue que de toute façon la feuille de style n'est pas réutilisable telle quelle et que cela a un impact sur le code HTML généré (l'étape n°1 étant le design du site web dans ses grandes lignes, cela a des répercussions sur tout le reste)