Page dynamique, page statique, PHP, JSP, ASP, HTML, voilà ce qui revient souvent. Aujourd'hui, les sites Internet ont besoin d'être flexibles, réactifs. Il n'est plus possible de coupler fortement, présentation, données et fonctionnel. Chaque couche doit être découplée afin de rendre l’application web la plus indépendante possible et en faciliter la maintenance et l'évolution.

L'adoption d'une architecture de développement multi couche est un élément important. On retrouve le modèle de conception des programmes desktop ou client-serveur web. De plus, le fait d'avoir une couche de présentation indépendante permet de pouvoir s'adapter aux utilisateurs, aux terminaux. Cependant, il ne faut pas pécher par excès. Si précédemment on avait recours à des versions de site Internet spécifiques, aujourd'hui, on cherche plutôt à éviter cela. Question de rationalité du développement et de la maintenance. Une des questions essentielles est de savoir comment mon site Internet doit prendre en compte les nouvelles technologies et les nouveaux terminaux, sans pour autant tout casser ou réécrire une grande partie du code.

Utiliser les vrais standards

Cela passe par le refus de faire des versions spécifiques et de coder les pages spécifiquement pour des navigateurs. Utiliser au maximum les standards. Bien entendu, on ne résout pas tout, mais le standard offre un minimum de garanties. Et surtout, vous savez que les navigateurs s'appuient sur les mêmes technologies. Par contre, pour un intranet, voire un extranet, si vous maîtrisez le poste client, vous pouvez, à la rigueur, opter pour du spécifique, ou du client riche.

Il faut aussi se méfier, ou tout du moins être prudent, face aux modes et aux technologies que l'on présente comme nouvelles ou incontournables. Ainsi, prenons XUL, cette technologie permet de découpler la présentation du code web proprement dit. Un langage intéressant et puissant, mais malheureusement limité à quelques navigateurs. Internet Explorer ne le supporte pas.

Ayez un code strict, structuré et propre

Comme dans toute programme, la qualité du code web conditionne beaucoup de choses : Le bon fonctionnement du site Internet, les performances, la compatibilité avec les navigateurs, les évolutions futures, la charge serveur web, etc. Le navigateur est souvent permissif et un code même mal écrit fonctionnera, c'est aussi la faute de l'IDE. Vous pouvez opter pour un codage strict, possible en HTML ou en xHTML. Dans ce cas, l'interface se déporte dans le CSS. De plus, en HTML Strict, les contenus se placent dans les éléments de blocs. De nombreuses balises sont ainsi interdites d'usage.

Pour l'interface

Comme vu plus haut, il faut, au maximum découpler interface et fonctionnel. En utilisant xHTML, pour l'interface, il faut passer par le CSS. Standard du Web, il s'impose dans la conception d'un site Internet. Il évite d'occuper trop de bande passante.
Un seul fichier peut contenir la mise en page d'un site Internet entier. CSS remplace donc la présentation par HTML.

 Le CSS évite les mises à jour lourdes et peu pratiques. Ainsi, quand on ajoute de nouvelles pages, inutile de refaire tout le balisage. La maintenance et l'évolution du site Internet s'en trouvent simplifiées. On sait où aller pour modifier, supprimer, ajouter des éléments, une gestion, du contenu. Il est plus facile de structurer son site Internet ainsi et des pages, en ayant deux parties bien claires et séparées.

Le DOM (Document Object Model) permet de manipuler le contenu d'une page (le document). Il donne une représentation structurée (orienté objet) des éléments et du contenu, avec indication des méthodes pour modifier les objets. On peut ainsi créer une interactivité entre les éléments (ex : faire des tris), sans que le serveur web soit sollicité. Les navigateurs récents le supportent. Et il facilite l'utilisation de JavaScript, on se base sur DOM et non sur l’implémentation JavaScript des navigateurs. DOM est disponible en deux niveaux. Le niveau 2 apporte notamment les namespaces XML. Le niveau 3 est en cours de spécifications. DOM se pilote et se développe avec Java, JavaScript, VBScript.

Prévoir l'accessibilité de son site Internet

L'accessibilité devient une fonction indispensable dans les sites Internet. Il s'agit de rendre disponibles, visibles les pages et les contenus, à tout le monde. L'accessibilité d'un site Internet ne nécessite Internet pas de créer une version spécifique (excepté pour des technologies très spécifiques). Cet accès doit être pris en compte dès le début de la conception. Idéalement, il faut considérer les recommandations WAI du W3C.

Vous pouvez ainsi utiliser l'attribut ait, à condition de remplir celui-ci manuellement pour être explicite. Alt permet de mettre en place des textes de remplacements (à des images). Pour les vidéos, vous pouvez inclure des sous-titres dans les séquences (là, il faut travailler à la source du fichier). Flash MX inclut par défaut certaines fonctions d'accessibilité. Prévoyez une navigation et une validation sans la souris.

JSF : un complément aux pages JSP à Java

JSF est un framework technique côté serveur web en Java. Il se dédie à la conception d'applications web dynamiques. Il se compose de deux éléments distincts : un ensemble d'API pour représenter les composants d'interface et gérer les états, les événements et la validation des entrées, définir la page de navigation et le support de la location et de l'accessibilité et un custom tag library de type JSP pour exprimer une interface JSF dans une page JSP. JSF passe par une page JSP pour être vu côté client. La qualité de JSF est de pouvoir réutiliser les composants d'interface que les outils proposent et qui sont en standard dans ces spécifications. JSF a pour but de simplifier le développement, la gestion et le déploiement des programmes web dynamiques, tout en offrant une bonne indépendance des pages par rapport au poste client. Contrairement à Struts, JSF est un standard du JCP. Comme Struts, JSF se base sur le modèle MVC. Struts est à la base plus complexe et plus complet que JSF. On ne retrouve pas en JSF par exemple le framework de gestion de couches, Tiles. De plus, sur la partie validation, le framework struts est plus complet et évolué. Cependant, JSF est plus flexible et extensible, avec un modèle de réutilisation.

JSF sépare strictement la définition du composant, du rendu. Il est possible d'afficher les composants de différentes manières et ce, sur différents clients. Struts n'a pas de notion de composant côté serveur web. Avec JSF, il est possible de créer des interfaces riches (de type rich client). Les principaux IDE du marché supportent désormais les JSF (Jbuilder, Sun Java Studio Creator, etc.). En conception RAD, JSF simplifie largement la conception de pages JSP, ce qui n'était pas toujours chose aisée.

Un programme JSF fonctionne dans une servlet (bref sur le serveur web) et contient : les composants javabeans (contenant les données et les fonctions de du programme), la liste des événements, les pages JSP, les custom tag libraries, le fichier de configuration du programme. Si vous utilisez déjà Struts, il n'est pas utile de le remplacer. Pour un nouveau projet web, en revanche, la question peut se poser. Les éditeurs poussent fortement JSF en lieu et place de Struts. Le fichier de configuration JSF est un fichier XML (ex. : faces-config.xml). Cela fait une technologie de plus à apprendre, mais si vous restez en environnement Java...

XHTML : le langage du web nouveau

Si HTML demeure la base du Web, le xHTML est préférable à bien des égards. XHTML est du HTML à la sauce XML. L'avantage est la cohérence et la structuration du code et des balises, ce que HTML ne permet pas. Le fait d'utiliser XML favorise à terme une interaction poussée entre les différents dialectes web du XML (en théorie). Le xHTML HTML 4. Et il travaille sans problème avec DOM et CSS. Vous avez plusieurs niveaux de

• XHTML Transitional : DTD un peu rigide mais souple, idéal quand on migre de HTML
•  XHTML Strict : DTD rigide, structuration du code stricte

•  XHTML Frameset : permet d'inclure des cadres dans ses pages.

Exemple xHTML :

<! DOCTYPE html PUBLIC     "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3. orgAR/xhtml 1 /DTD/xhtml 1 -strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>XHTML Quicktime Object</title>
<meta http-equiv= "Content-Type" content="text/html; charset=iso-8859-1 " />
<style type="text/css">
<!-
/* object stuff hère */
/* hides the second object from ail versions of IE */ * html object.mov {display: none;
]
/* displays the second object in ail versions of IE apart from 5 on PC */ * htmlobject.mov/**/ {display: inline;
}
/* hides the second object from ail versions of IE >= 5.5 */ * html object.mov {
display/**/: none;
}
/* just stuff to make the page pretty */ body, hl, h2, h3, h4, h5, hô, p, oi, ul, dl, input {font-family: Verdana, Tahoma, sans-serif;
}

Attention : xHTML hérite du XML pour sa rigueur de déclaration. Soyez attentif à ce que vous écrivez, dans le cas contraire, le document ne sera pas valide. Le balisage est strict, ainsi en xHTML, toute balise ouverte doit être fermée, ce qui n'est pas forcément le cas en HTML. Dans le cadre d'un site Internet en xHTML, déporter le plus possible la couche de présentation dans le CSS. xHTML se concentre sur le document. Si HTML continue à être supporté et largement utilisé, pourquoi passer à xHTML ?

•  il remplace HTML 4 et possède une structure plus moderne, plus cohérente,
•  la vi est une version de transition vers les futures versions
•  les navigateurs anciens ou modernes fonctionnent avec xHTML.
•  il offre un comportement plus prévisible que le HTML
•  on pousse à une meilleure structuration du code Web et à l'emploi du CSS.
•  utilisation d'outils de validation par des services dédiés sur le web, réduisant ainsi le temps de tests.

Le flux RSS : la syndication de contenu

Flux, fil, canal, on utilise toutes sortes de termes pour désigner l'utilisation de RSS. RSS, pour faire simple, permet de faire de la syndication de contenu entre site Internet. Il repose sur le langage XML. On peut créer ou intégrer un flux RSS manuellement ou automatiquement via des outils. Préférez l'approche logiciel afin de vous faciliter la vie. Manipuler des données et balises XML n'a jamais été simple et c'est une perte de temps. Les sites Internet de blogs proposent souvent ce genre de fonction. Quand on insère un flux RSS dans son site Internet, on utilise un lecteur RSS. Les dernières générations de navigateurs l'intègrent.

Un flux RSS est un simple fichier texte au format XML. Comme on est dans un contexte XML, pour pouvoir afficher correctement le flux sur un site Internet, on doit disposer d'un parseur qui s'occupera de réaliser la transformation. On passe alors le plus souvent par un script pour opérer la transformation, par exemple avec MagPie RSS. Si un flux RSS est avant tout du texte, il est possible d'enrichir le contenu avec du multimédia. Pour ce faire, on utilisera la balise <enclosure> (en RSS 2). Cependant cette balise n'est pas supportée par tous les lecteurs

DHTML

Le DHTML (XHTML + JavaScript + CSS) convenablement    **,. 1 1* programmé est déjà une très bonne solution pour développer un programme Web, le développeur concentrer dans un premier temps sur la partie XHTML (xhtml-strict) sans tenir compte de l'aspect visuel. Le XHTML est aussi plus rigoureux (les balises doivent être fermées, sensibilité à la casse, imbrication correcte, etc.).

Exemple de code :
Définition de la partie XHTML (la structure) avec une dtd selon le modèle XHTML-strict, un encodage en langue française, un menu et une définition de style "stylesheet":
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.orgAR/xhtmll /DTD/xhtmll -strict, dtd ">
<html    xmlns=flhttp://www.w3.org/l 999/xhtml"    xml:lang="fr"
lang="fr">
<head>
<meta  http-equiv= "Content-Type"  content="text/html;  charset=ISO-8859-1 " />
<title>Cette page est en xhtml-strict</title>
<link rel="stylesheet" type="text/css" href="style.css" média="screen"/>
</head>
<body>
<hl>
<img src="" alt="Titre du site Internet"/>
</hl>
<div id="menu">
<h3>rubrique l</h3>
<ul>
<lixa href="#" title="">lien</ax/li>
<lixa href="#" title="">lien</ax/li>
</ul>
<h3>rubrique 2</h3>
<lixa href="#" title="">lien</ax/li>
<lixa href="#" title="">lien</ax/li>
<lixa href="#" title="">lien</ax/li>
</ul>
</d\v>
<div id="contenu">
<h2>blaba blaba titre</h2>
<p>blaba blaba texte</p>
</div>
<div id="pied">
<ul>
<lixa href="#" title="">lien</ax/li>
</ul>
</div>
</body>
</html>

LES PLUS
• Fonctionne avec tous les navigateurs récents
• Réduit la charge côté serveur web
• Contenu indexable par les moteurs de recherches si DHTML, contenu non indexable si AJAX (XMLHttpRequest)

LES MOINS
• Difficile d'intégrer du contenu vidéo ou audio
• Le JavaScript est parfois désactivé sur les navigateurs, mais l'application doit pouvoir toujours tourner en raison du critère d'accessibilité
• Difficulté de programmer des effets complexes en tout genre
• Difficulté de sécuriser l'programme car la logique d'une application DHTML est accessible par le navigateur