Télécharger l`étude au format pdf - Jean

Transcription

Télécharger l`étude au format pdf - Jean
ECOLE DES MINES DOUAI
AUBIN (Pascal)
DUPUIS (Jean-Michel)
ETUDE BIBLIOGRAPHIQUE
Navigateur internet ou client riche
Promotion FCD 2007
Année Scolaire 2005 - 2006
-3-
SOMMAIRE
SOMMAIRE................................................................................................................ 3
RESUME .................................................................................................................... 5
MOTS MATIERES...................................................................................................... 5
ABSTRACT................................................................................................................ 7
KEYWORDS .............................................................................................................. 7
INTRODUCTION ........................................................................................................ 9
1. INTERNET, D'HIER A AUJOURD'HUI ................................................................ 11
2. LES NAVIGATEURS INTERNET ET LEURS TECHNOLOGIES ASSOCIEES .. 19
2.1.
2.2.
2.3.
2.4.
INTERNET EXPLORER DE MICROSOFT ............................................................................19
ACTIVE X, PASSERELLE ENTRE WINDOWS ET INTERNET .................................................23
FIREFOX DE LA FONDATION MOZILLA ...........................................................................28
XUL , LA BOITE A OUTILS DE MOZILLA ............................................................................30
3. AJAX, LA TECHNOLOGIE QUI DEPOUSSIERE LE WEB [11] ......................... 33
4. RICH INTERNET APPLICATION SELON ADOBE ............................................. 47
4.1. FABRIDGE .................................................................................................................47
4.2. MACROMEDIA FLASH ....................................................................................................47
4.2.1. Flash Player ...................................................................................................................................... 48
4.2.2. Adobe Flex......................................................................................................................................... 53
4.3. RICH INTERNET APPLICATIONS, LA REVOLUTION APPLICATIVE.........................................57
CONCLUSION ......................................................................................................... 59
BIBLIOGRAPHIE ..................................................................................................... 61
GLOSSAIRE ............................................................................................................ 65
ANNEXE 1................................................................................................................ 73
ANNEXE 2................................................................................................................ 77
ANNEXE 3................................................................................................................ 79
ANNEXE 4................................................................................................................ 83
ANNEXE 5................................................................................................................ 87
ANNEXE 6................................................................................................................ 91
-5-
RESUME
Internet évolue et le web connaît de grandes mutations expliquées par deux phénomènes.
D’abord, l’apparition de nouveaux navigateurs redynamise un marché dominé par Microsoft.
Ensuite, la naissance du concept de client riche et les technologies associées, remettent en
cause notre conception d’Internet.
Les décideurs informatiques sont pris au milieu de ce tourbillon d’innovations et peinent à
porter des choix technologiques. Afin de les aider, il est nécessaire de mettre en lumière un
certain nombre de points.
La rapide et fulgurante évolution du Web, a donné lieu à la naissance de navigateurs peu
respectueux des standards, et affublés d’extensions propriétaires. C’est le cas de Microsoft
avec le puissant et controversé ActiveX ou de Mozilla avec le très prometteur langage XUL.
L’utilisation de telles extensions propriétaires permet la conception d’applications évoluées,
mais limite leur champ de déploiement.
C’est la volonté de développer des applications riches multi plates-formes qui a donné le jour
au concept d’Ajax. Bien que récent, ce concept fait appel à un ensemble de technologies
matures. Malheureusement, l’absence d’environnement de développement abouti, rend son
utilisation fastidieuse. Toutefois, lorsque le projet initié par IBM de fédérer les éditeurs autour
d’un standard aura vu le jour, Ajax pourrait devenir incontournable.
Une alternative à Ajax provient de la société Adobe qui propose le très répandu plug-in
Flash. Ce module permet l’affichage de contenus multimédias interactifs dans le navigateur.
Les applications utilisant Flash sont extrêmement ergonomiques, mais difficiles à concevoir
lorsque la logique métier est complexe. C’est pour résoudre ce problème qu’Adobe a
développé la gamme de produits Flex, reposant sur un serveur dédié capable de générer un
contenu Flash à la volée.
Les applications internet riches, ainsi conçues, font partie d’une mouvance qui tend à
transformer un Web orienté contenu en Web orienté service, qui augure peut être de ce que
sera le Web 2.0.
MOTS MATIERES
>
Ajax
>
Flex
>
Application
>
Internet
>
Client
>
Mutation
>
Décideur
>
Riche
-7-
ABSTRACT
Internet is changing and the Web is experiencing great alterations explained by two
phenomena.
First, the emergence of new browsers stimulates the market dominated by Microsoft. Then,
the birth of the concept of rich client and associated technologies call our design of Internet
into question.
The data-processing decision makers can not choose between different technologies. In
order to help them, it is necessary to clarify a certain number of points.
The fast and brilliant evolution of the Web gave birth to browsers, which are not very
respectful of the standards. Most of them include proprietary extensions. It is the case of
Microsoft with the powerful and discussed ActiveX or of Mozilla with the very promising XUL
language.
The use of such proprietary extensions allows the design of evolved applications, but that
limits their field of deployment.
It is the will to develop multi-platforms rich applications which gave birth to the Ajax concept.
Although recent, this concept uses mature technologies. Unfortunately, the absence of
succeeded development-environment, makes its use tedious. However, when the project
initiated by IBM to federate the editors around an Ajax standard will be born, this concept
could become obvious.
An alternative to Ajax comes from the Adobe company, which proposes the very widespread
Flash plug-in. This module allows the display of interactive multimedia contents in the
browser. The applications using Flash are extremely ergonomic. But, when the trade logic is
complex, it is difficult to develop them. In order to solve this problem the Adobe company
released the Flex line of software, resting on a server able to generate Flash contents onthe-fly.
Rich Internet Applications are part of a movement which aims to transform a Web of content
into a Web of service. That is what could be the Web 2.0.
KEYWORDS
>
Ajax
>
Flex
>
Application
>
Internet
>
Client
>
Alteration
>
Decision-maker
>
Rich
-9-
INTRODUCTION
Aujourd'hui, les décideurs et les responsables informatiques hésitent dans le choix des
solutions techniques pour construire des sites internet à forte valeur ajoutée ou pour
développer des applications métiers. En effet, l'émergence des NTIC offre de nouvelles
perspectives dans ces options.
Actuellement, une bataille fait rage sur l'ordinateur personnel de l'utilisateur, d'un côté,
l'émergence de nouveaux navigateurs internet et de l'autre, l'apparition d'un nouveau
concept : les clients riches.
Notre étude va s'efforcer d'éclairer les personnes concernées afin qu'elles prennent les
meilleures décisions.
Nous allons dans un premier temps rappeler les
contexte actuel. Puis nous ferons le point sur les
navigateurs web du marché. Nous aborderons
"phénomène Ajax". Enfin nous détaillerons la notion
société Adobe au travers de sa technologie Flash.
évènements qui nous ont conduits au
différences qui séparent les principaux
ensuite ce qui est décrit comme le
d'application internet riche perçue par la
- 11 -
1. Internet, d'hier à aujourd'hui
Sans raconter l'histoire complète d’Internet, intéressons nous à sa naissance.
Les prémisses du Web repose sur le besoin qu’avaient les militaires et les scientifiques de
réunir des ordinateurs distants afin de les faire communiquer et échanger des données. La
réponse à ce besoin se concrétise au début des années 1970 avec le réseau ARPANET qui
compte alors 4 nœuds. La première pierre du Web moderne est posée en 1989 lorsque Tim
BERNERS-LEE propose au CERN (Conseil européen pour la recherche nucléaire) d’utiliser
le réseau existant afin d’améliorer sa communication interne. La proposition de Tim
BERNERS-LEE qui repose sur un maillage de document hypertexte, voit le jour en 1990.
L’Internet "moderne" est né, il ne compte alors qu’un serveur.
Les fonctionnalités proposées à l’époque sont minimalistes. Les documents échangés
repose sur le format HTML. Une page ne peut contenir que du texte et des hyperliens
(références vers d’autres pages). La consultation des pages web s’effectue alors souvent en
mode texte. Un exemple de ce qu’était alors la navigation est proposé figure 1. Cette époque
allant de 1990 jusqu’à approximativement 1994, symbolise la naissance du Web moderne.
L’interactivité proposée se cantonne à la sélection d’hyperliens. Le peu de contenu proposé
s’ouvre alors à beaucoup de clients. Le penchant des informaticiens à apposer un numéro
de version sur tout, les amène parfois à appeler le Web de cette époque Web 0.x.
Fig. 1: Capture d’écran du navigateur Lynx [1]
Le développement du Web s’accélère à partir de 1994. En effet, alors qu’en juin, la toile
compte environ 2700 sites, leur nombre s’élève à 10000 en décembre. C’est cette année
qu’est fondé le World Wide Web Consortium (W3C), organisme
participant à la
normalisation du Web. Les innovations technologiques par rapport au début du Web sont
- 12 limitées. Il est maintenant possible d’inclure des images au format GIF (General Interchange
Format) dans une page HTML. La navigation se trouve nettement améliorée par l’arrivée de
navigateur comme Mosaic ou Netscape Navigator. Assez rapidement, les navigateurs
deviennent capables de recevoir des documents plus complexes, intégrant des contenus
multimédia. Cependant, les interactions avec l’utilisateur se limitent toujours à l’utilisation
d’hyperliens.
Les sites Web de cette époque sont statiques, composés exclusivement de pages HTML, qui
doivent être réactualisées manuellement par le gérant du site qui les héberge. Cette vision
(baptisée Web 1.0) de l’Internet durera approximativement jusqu’en 1997. Cette époque est
marquée par la popularisation d’Internet, qui met à la disposition de tous beaucoup de
contenus.
Fig. 2: les évolutions du Web [2]
A partir de cette date, le Web s’anime et devient dynamique. Cette effervescence provient de
l’apparition d’une série de technologies améliorant l’aspect visuel et fonctionnel du Web. Ces
avancées technologiques contribuent à améliorer les performances des navigateurs, mais
surtout elles rendent les serveurs "intelligents".
Les navigateurs profitent de l’arrivée du langage Java qui permet le développement
d’appliquettes pouvant s'incorporer à l’intérieur d’un document HTML. Ces appliquettes sont
d’authentiques programmes pouvant intégrer des fonctions évoluées, tant au niveau visuel
que fonctionnel. Il est alors possible d’enrichir considérablement le comportement du
document HTML. Mais ceci a un coût. En effet, la réalisation de telles appliquettes implique
une parfaite connaissance du langage Java. Cela réserve le développement de ce type de
programme à des spécialistes.
Conscientes de cette limitation, les sociétés Sun et Netscape développent conjointement
JavaScript, qui est alors présenté comme le complément de Java au sein des pages web [3].
Ce langage script, facile d’accès, permet la manipulation des objets inclus à l’intérieur d’un
document HTML. La rencontre de JavaScript et du modèle objet de document (DOM) donne
naissance au Dynamic HTML (DHTML) qui offre des pages réactives, et visuellement plus
attractives.
Parallèlement à ce phénomène, l’apparition de module s’intégrant au navigateur (plug-in)
contribue à améliorer l’interaction avec l’utilisateur. L’exemple le plus marquant est
certainement celui de Flash, le module offert par Macromedia. Ce plug-in autorise l’affichage
d’animations vectorielles de grandes qualités, et permet à l’utilisateur d’interagir avec ces
- 13 dernières. Flash devient rapidement une des extensions les plus utilisées. Les raisons de ce
succès sont multiples, mais l’acceptation de cette technologie repose essentiellement sur la
relative simplicité de sa mise en œuvre et sur la qualité de son environnement de création.
Mais, comme nous l’évoquions précédemment, la principale évolution provient des serveurs.
En effet ceux-ci deviennent dynamiques. Ils ne sont plus de simples zones inertes, servant
les pages HTML réclamées par le client. Ils deviennent capable de générer eux même les
documents transmis au navigateur. Pour rendre cela possible, il faut que le serveur héberge
en plus d’un serveur web, une application capable de traiter les requêtes utilisateurs et de
fournir une page HTML en réponse. L’arrivée à maturité des langages tels que PHP, ASP ou
Java permet justement d’écrire ce type d’applications. Il devient alors envisageable
d’appliquer au domaine du Web des architectures serveurs s’inspirants de celles utilisées
par les clients lourds traditionnels.
L’architecture 3 tiers devient rapidement prédominante. Comme sont nom l’indique, cette
architecture se décompose en trois niveaux.
Premier niveau ou couche présentation
Ce niveau correspond à l’interface utilisateur hébergée au sein du navigateur. Cette couche,
transmet les requêtes effectuées par l’utilisateur à la couche métier, et affiche les résultats
retournés par celle ci.
Second niveau ou couche métier
A ce niveau sont définis les traitements que doit réaliser l’application lorsqu’elle reçoit une
requête émanant de la couche présentation. Ce niveau correspond à la logique métier de
l’application.
Troisième niveau ou couche d’accès aux données
Ce niveau, gère l’accès aux données. Quand la couche métier à besoin d’accéder à des
informations, elle adresse une requête à ce niveau. Lorsque les données sont disponibles,
elles sont transmises à la couche métier qui va les traiter.
Une architecture 3 tiers se décompose en 3 couches, couche présentation, couche métier,
couche d’accès aux données :
- 14 -
Fig. 3: architecture 3 tiers
Dès lors que ces mécanismes ont été mis en place, il est devenu possible de consulter des
bases de données depuis son navigateur web. Cette avancée technologique facilitait
grandement la mise au point de sites de commerce électronique, qui se multiplièrent alors.
Les experts considèrent que le début du Web 1.5 correspond à l’avènement des pages
dynamiques soit environ 1997.
Au regard de ce petit historique, on se rend compte que bien que la qualité visuelle des
interfaces web se soit améliorée au fil du temps, l’interaction avec le navigateur est restée
assez limitée. En effet, en l’absence de module externe, la seule action possible de la part
de l’utilisateur est la sélection d’un lien. Un autre invariant de la navigation web depuis sa
création est le rechargement de la page après chaque action de l’utilisateur.
Hors, depuis quelques temps, apparaisse des sites novateurs, tant au niveau de leur
interface utilisateur qu’au niveau des fonctionnalités qu’ils apportent. L’exemple le plus
marquant, car il touche énormément d’Internautes, et celui des webmails.
Consultons le nouveau service mail de Microsoft, encore en version Bêta.
Au premier abord, l’interface utilisateur est similaire à ce que pourrait être un client mail
traditionnel. Le rangement des courriers s’effectue par un simple glisser – déplacer. Lors de
la consultation d’un courrier, il s’affiche instantanément sans que la page n’ait besoin d’être
rechargée.
- 15 -
Fig. 4: impression écran de Windows Live Mail, boîte de réception
La rédaction des messages s’effectue dans un éditeur WYSIWYG très complet. Ce dernier
intègre une fonction de correction orthographique fonctionnant en temps réel, qui en plus de
souligner les fautes, propose une suggestion de correction lorsque l’utilisateur effectue un
clic droit sur le mot douteux. (Les utilisateurs de Word ne seront pas dépaysés !). De plus, la
notification d’arrivée de nouveaux messages fonctionne toujours lors de la rédaction d’un
message.
Fig. 5: impression écran de Windows Live Mail, écrire un message
- 16 -
Cet outil dispose également d’un calendrier.
Ce calendrier comme sons homologue sous Outlook permet la prise de rendez vous, la
définition de tâches.
Fig. 6: impression écran de Windows Live Mail, calendrier
Après quelques minutes d’utilisation, il s’avère que la similitude avec un client de messagerie
traditionnel, ne s’arrête pas uniquement à l’aspect visuel. L’ergonomie de ce site ainsi que
les fonctionnalités qu’il propose sont calqués sur les logiciels qui ont participé au succès de
Microsoft.
Intéressons nous maintenant au webmail de Yahoo, lui aussi en version Bêta.
Encore une fois, le résultat obtenu est très proche d’une application traditionnelle (hormis la
présence de bandeaux publicitaires assez déroutants). Le glisser – déplacer est géré, ainsi
que les menus contextuels et les raccourcis clavier. Comme son homologue chez Microsoft,
aucune fonctionnalité n’a été oubliée. Le correcteur orthographique ne fonctionne pas ici en
temps réel, il est nécessaire de le solliciter manuellement. Mais il propose aussi des
suggestions de correction par le biais du clic droit de la souris. L’agenda, le bloc note et la
gestion des flux d’informations font, eux aussi, partis des fonctionnalités présentes.
- 17 -
Fig. 7: impression écran Yahoo! Mail
Ces exemples sont assez édifiants, car en plus de révolutionner l’interface graphique de nos
anciens sites, ils substituent au concept de site web enrichi celui d’application web
complexe. Pour cela, Yahoo et Microsoft n’hésitent pas à reproduire dans nos navigateurs, le
fonctionnement d’applications bureautiques traditionnelles.
Il semble que ces applications soient annonciatrices d’une nouvelle génération de services
plus orientés vers les attentes de l’Internaute. Et cela Microsoft l’a bien compris, en
proposant une gamme de services très variée reposants sur la plate-forme Windows Live.
Cette plate-forme se présente sous la forme d’une page personnalisable, à laquelle
l’utilisateur peut intégrer des applications spécifiques.
Le concept d’application Internet ne touche pas uniquement les clients de messagerie web.
En effet, depuis quelques temps, apparaissent régulièrement de nouveaux services web
innovants.
Nous pouvons citer comme exemple le tableur proposé par Google ou le superbe bureau
virtuel Goowy, situés respectivement aux adresses http://spreadsheets.google.com/ et
http://webserver001.goowy.com/.
Une autre application novatrice se trouve à l’adresse : http://www.ajaxlaunch.com/ajaxwrite/.
Il s’agit d’un traitement de texte compatible avec le format Word. Ses fonctionnalités sont
certes plus limités que celle d’un produit commercial, mais il est néanmoins parfaitement
fonctionnel. Malheureusement, comme le montre les captures d’écran ci-dessous, les
utilisateurs d’Internet Explorer ne peuvent pas profiter d’ajaxWrite. Celui-ci ne d’exécutant
que sur les plus récentes versions de Firefox.
- 18 -
Fig. 8 & 9: impression écran ajaxWrite
Pour expliquer cette incompatibilité, il faut s’intéresser aux techniques utilisées pour bâtir
cette application. AjaxWrite est une vitrine du savoir faire technologique de la jeune société
américaine Ajax 13. Cette dernière s’est spécialisée dans le développement d’applications
utilisant la technologie Ajax. Ce qui est le cas d’ajaxWrite, mais celui-ci implémente une
autre technologie qui n’est pour le moment supportée que par Firefox. Il s’agit de XUL, un
langage qui permet la description d’interfaces utilisateurs. Les interfaces décrites en XUL
n’étant pas exploitables par Internet Explorer, celui-ci ne peut recevoir cette application.
Cet exemple met en évidence les différences de points de vue entre les éditeurs de
navigateurs internet et les problèmes que cela suscite lors de leur utilisation.
Intéressons nous maintenant à la nature de ces divergences.
- 19 -
2. Les navigateurs internet et leurs technologies associées
2.1.
Internet Explorer de Microsoft
Il est difficile de nos jours de ne pas connaître Internet Explorer, le navigateur proposé par
Microsoft. En effet, celui-ci étant distribué avec Windows depuis 1995, il fait parti du
quotidien de plus de 80% des internautes dans le monde.
Nous allons revenir, sur la naissance de ce produit, afin de comprendre comment en moins
de six ans Internet Explorer est devenu le navigateur incontournable.
Plaçons nous en 1993, le marché du navigateur web est alors dominé par Mosaic,
développé par la NCSA (National Center for Supercomputing Application). L'année suivante
apparaît Netscape Navigator édité par la société américaine Netscape Communications
Corporation. Le succès de Navigator est immédiat, et en quelques mois, il remplace
littéralement Mosaic. La NCSA, fait alors le choix de se concentrer sur le développement
d'Apache, son serveur web.
Nous sommes maintenant en 1995, le phénomène Internet prend de l'ampleur et,
parallèlement à ceci, apparaît le langage Java qui s'intègre au sein de Navigator par le biais
d'un plug-in. La grande diffusion de Navigator, et la capacité de Java à être indépendant de
la plate-forme sur laquelle il s'exécute, amènent le monde informatique à voir le Web comme
une formidable plate-forme de développement, permettant enfin de s’affranchir du système
d'exploitation et de l'architecture de la machine cliente. La concrétisation de cette vision,
amènerait à la disparition du monopole détenu par Microsoft, au profit d'un nouveau
monopole en faveur de Netscape. Cette analyse n'échappant pas au monde financier,
l'action Netscape est sujette à une forte spéculation.
Microsoft, témoin de cette évolution, ne peut évidemment pas laisser ce renversement de
situation se produire. Il décide donc de réagir et de s'attaquer au marché du navigateur web,
afin de réduire l'influence de Netscape dans ce domaine. C'est avec cette ambition, que
Microsoft fait l'acquisition de la licence de Mosaic.
La version 1.0 d'Internet Explorer apparaît au mois d’août 1995. La firme de Redmond,
choisi de la distribuer gratuitement, afin de concurrencer Mosaic et Netscape qui est alors un
produit payant. Le navigateur Microsoft est intégré au pack plus ! de Windows 95.
La version 2.0 d'Internet Explorer, voie le jour en novembre 1995, soit quatre mois après
l'édition de la première version. Elle est diffusé avec Windows NT 4.0 et supporte la plateforme Macintosh. Cette version introduit d’importantes nouveautés comme :
> Le support de JavaScript, permettant ainsi d'accroître l'interactivité avec l'utilisateur
en exécutant un script au sein de la page visitée.
>
La possibilité d'afficher dans une même fenêtre plusieurs sources HTML dans des
cadres différents (frames).
>
La gestion des transactions sécurisées par le biais du SSL (Secure Socket Layer).
>
Les cookies, qui permettent aux sites web visités de stocker des informations
concernant la navigation sur le disque de l'internaute
Cette époque se caractérise par la course aux fonctionnalités que se livre les deux
principaux acteurs de la scène des navigateurs web que sont Netscape et Microsoft. En se
- 20 focalisant sur l’ajout de nouvelles fonctionnalités à leur navigateurs, les deux éditeurs ont
fortement négligé la maintenance de leur logiciels, ce qui a pour résultat la parution de
navigateurs instables, peu respectueux des standards et connaissants de nombreuses failles
de sécurités.
Il faudra attendre août 1996 et la version 3.0 d’Internet Explorer avant que celui-ci ne soit
réellement compétitif. Cette version, apporte de profonds changements à l’interface
graphique du logiciel, qui n’évoluera quasiment plus par la suite. Du point de vu fonctionnel,
les principaux apports de cette version sont :
> La gestion des feuilles de style en cascade (CSS).
>
Le support des appliquettes java et de ActiveX.
Le mois d’octobre 1997 voit apparaître Internet Explorer 4.0, qui est considéré comme une
évolution majeur du produit. Il est plus rapide et supporte mieux les spécifications du W3C
(World Wide Web Consortium) que son concurrent Netscape Navigator 4.0. Néanmoins, la
principale caractéristique de cette version et d’être si étroitement liée à Windows 98 avec
lequel elle est distribuée, qu’il est impossible de la désinstaller.
Lors de la sortie d’Internet Explorer 4.0, Netscape compte encore 72% de parts de marché
dans le domaine du navigateur web, mais à partir de cette date, Microsoft, va constamment
accroître sa possession du marché, essentiellement grâce à une politique commerciale très
agressive.
La politique de Microsoft repose sur deux constatations simples :
> Netscape bien qu’en plein essor, reste une société relativement petite, qui tire la
majeure partie de ses revenues d’un seul produit et de ses dérivés. Cela fait de
Netscape, une société financièrement fragile. Pour s’en convaincre, il suffit de
constater que les résultats de Netscape n’ont jamais dépassé les intérêts générés
par les fonds de caisse de Microsoft.
>
Microsoft dispose d’un formidable vecteur de déploiement pour son navigateur :
Windows. En effet à partir de Windows 95 OSR2, chaque copie de son système
d’exploitation est vendue avec Internet Explorer. C’est ainsi que Microsoft est
parvenue à augmenter ses parts de marché bien que les premières versions de son
navigateur étaient moins performantes que Navigator. De plus, les sources de
revenus de Microsoft n’étant pas liées à son navigateur, celui-ci est resté gratuit. Il a
ainsi pu bénéficier des revenus apportés par les autres produits de la société pour se
développer et rapidement devenir l’égal de Navigator.
La politique de Microsoft se concrétise par l’application de différentes mesures :
> La première se base sur le modèle économique de son concurrent. En effet,
Netscape a pris le parti d’offrir son navigateur, et de baser ses revenus uniquement
sur la vente d’applications serveur. Microsoft décide donc de fournir avec son
système d’exploitation le serveur web IIS (Internet Information Services).
Parallèlement à IIS, Microsoft fournit à ses clients, une offre complète de serveurs, et
ce, à des tarifs très avantageux. Rapidement, les solutions serveur Microsoft se
développent, privant ainsi Netscape de sa principale source de revenus.
>
La seconde mesure de l’éditeur de Redmond consiste à créer des contrats de licence
qui contraignent les fabricants d’ordinateurs à placer une icône d’Internet Explorer sur
le bureau de Windows et à les pénaliser, si ceux-ci installent Navigator sur les
ordinateurs qu’ils commercialisent.
- 21 >
Ensuite, Microsoft, publie un outil de création de pages web, FrontPage, qui génère
des pages HTML incluant des instructions non standards comprises uniquement par
le navigateur de la marque. Les sites développés avec cet outil ont un meilleur
rendu sous Internet Explorer que sous Navigator, ce qui incite les visiteurs de ces
sites à opter pour le navigateur Microsoft.
>
Enfin, Microsoft facilite la réalisation de version personnalisée d’Internet Explorer
destinées aux fournisseurs d’accès Internet.
Ces différentes mesures, ont permises à Microsoft d’asphyxier Netscape, qui est racheté en
1998 par America OnLine, alors que son navigateur détient encore 60% de parts de marché.
Privé de concurrence sérieuse, Microsoft réduit le rythme de parution des nouvelles versions
d’Internet Explorer et freine sa politique d’innovation.
Internet Explorer 5.0, qui voit le jour en mars 1999, corrige certains bugs de la version
précédente et introduit le support des langages XML et XSL. La gestion des feuilles de style
est également améliorée. Il est à noter qu’une version Macintosh plus respectueuse des
standards est alors développée. Mais l’effort de portage de Microsoft s’arrête lorsque Apple
intègre son propre navigateur, Safari, à son système d’exploitation Mac OS X.
La version 6.0 d’Internet Explorer qui apparaît en octobre 2001, ne comporte aucune
innovation majeure et se contente de corriger quelques problèmes de sécurités. C’est la
version qui est distribuée avec Windows XP.
Un an après le lancement d’Internet Explorer 6.0 (soit six ans après la publication de la
première version) la part de marché du navigateur Microsoft culmine à 96%, chiffre record
que Netscape n’a jamais atteint. Mais, depuis cette date, le navigateur de Microsoft perd
constamment du terrain au profit de nouveaux concurrents. Ceci s’explique principalement
par le fait que depuis plusieurs années, Microsoft ne fait preuve d’aucune innovation, ce qui
rend son navigateur obsolète face à Firefox, Opera et Safari, qui sont des navigateurs jeunes
et emprunts de dynamisme. Notons, que début 2005, après plus de 50 millions de
téléchargements, Firefox, fait passer Internet Explorer sous la barre des 90 % de parts de
marché.
- 22 -
Fig. 10: Répartition du marché des navigateurs web de 1996 à 2005 [4]
L’histoire d’Internet Explorer, et comme nous l’avons vu précédemment étroitement liée à
celle de son concurrent direct. La farouche volonté de Microsoft de balayer Netscape l’a
amené à produire un navigateur toujours plus performant, toujours plus innovant et ce, au
détriment du respect des standards et de la stabilité.
Cette philosophie de développement a eu, et a encore, de lourdes conséquences sur le
navigateur. En effet, il aura fallu attendre la version 4.0 d’Internet Explorer avant que celui-ci
ne soit considéré comme réellement stable. L’aspect sécurité au sein du navigateur reste
encore un point très critiqué. Celui-ci est accusé de permettre trop facilement l’exécution de
programmes malveillants par l'intermédiaire de la technologie ActiveX. De plus,
régulièrement, de nombreuses failles de sécurité sont découvertes, nécessitant le
déploiement d’une multitude de correctifs.
La course à l’innovation entre Microsoft et Netscape a poussé les deux compagnies à
étendre les standards du Web sans attendre la validation de leurs extensions par le W3C.
Ce fut le cas de VBScript un langage script s’intégrant parfaitement dans le système
d’exploitation de Microsoft, mais ne répondant à aucun standard web. De ce fait, l’utilisation
de VBScript ou d’une autre technologie propriétaire, dans une page Internet ne la rend plus
consultable par tous les navigateurs.
Une des extensions propriétaire les plus connues développée par Microsoft est sans nul
doute ActiveX. Cette technologie mérite que l’on s’y attarde, car elle est la réponse de
- 23 Microsoft au standard Java en ce qui concerne l’exécution d’appliquettes au sein d’un
navigateur.
2.2.
Active X, passerelle entre Windows et Internet
Tout d’abord, il faut bien comprendre que contrairement à Java, ActiveX n’est pas un
langage de programmation, mais l’appellation donnée par Microsoft à un ensemble de
technologies que nous décrirons par la suite. La principale difficulté lorsque l’on veut décrire
ActiveX est l’absence de définition officielle de la part de Microsoft.
ActiveX, apparu en février 1996, est présenté par Microsoft comme la technologie qui doit
permettre de faire le lien entre les applications Internet et les applications Windows
traditionnelles. Cette technologie, fait parti intégrante du modèle d’objets distribués de
Microsoft (DCOM). En septembre 1997, suite à un revirement marketing du géant de
Redmond, la dénomination ActiveX se perd, au profit de DNA (Distributed interNet
Applications Architecture). Cette appellation couvre en fait les technologies permettant de lier
les univers Windows et Internet, telles que ActiveX, Dynamic HTML (DHTML) et COM
(Component Object Model).
Avant d’aller plus loin dans la compréhension d’ActiveX, il est nécessaire d’appréhender ce
qu’est COM (Component Object Model). COM est une spécification définie en 1993 par
Microsoft pour la création et la mise en œuvre de composants réutilisables. Le respect de
cette spécification rend possible la communication inter-applications ainsi que la création
dynamique d’objet et ce, quelque soit le langage utilisé pour la programmation du
composant.
Maintenant que le modèle COM est défini, continuons notre exploration d’ActiveX. Sous
cette dénomination, se cachent différents éléments tels que : des contrôles, des documents,
des conteneurs et des serveurs.
Nous allons détailler ces éléments, en nous préoccupant dans un premier temps de ceux
présents du côté client :
> Le contrôle ActiveX est un objet graphique qui possède une apparence visuelle, et
qui réagit à des évènements.
>
Le document consiste en un objet qui fait référence à un contrôle ActiveX. C’est par
exemple, la page web, ou la feuille Excel dans laquelle est ancré un contrôle ActiveX
>
Le conteneur est l’application qui contient le document. Internet Explorer peut être un
conteneur, mais il n’est pas le seul dans ce cas. En effet toutes les applications de la
suite Office (depuis la version 97) sont des conteneurs potentiels.
Le contrôle ActiveX est un composant, préalablement compilé pour s’exécuter dans
l’environnement Windows, contrairement aux appliquettes Java qui s’exécutent sur une
machine virtuelle, ce qui les rend indépendantes de l’environnement qui les accueilles.
Une autre différence majeure entre ces deux technologies se situe au niveau de leur
persistance sur le client. En effet, les appliquettes Java se chargent en mémoire lorsque le
client a besoin d’elles, et sont purgées dès qu’elles deviennent inutiles. Le fonctionnement
d’ActiveX est fondamentalement différent, dans la mesure où ces composants s’installent sur
le système qui les reçoit. Lors de l’installation les composants se déclarent à la base de
- 24 registre. Cette déclaration est nécessaire, car elle permet aux différents contrôles de
communiquer ensemble et avec les applications conteneurs.
La profonde intégration de ces composants au sein du système qui les accueil, nécessite de
mettre en place une politique de sécurité accrue autour d’eux. C’est ce qui a amené
Microsoft à réfléchir sur un procédé permettant de garantir que les composants téléchargés
sont fiables et par conséquents exempts de virus. La réponse apportée à ce problème
repose sur le principe de la signature du composant. Cette méthode permet de s’assurer que
le composant n’a pas été modifié depuis qu’il a été signé par son concepteur. Ce principe
connaît néanmoins une limite dans la mesure où il nous renseigne sur l’identité du
concepteur, mais pas sur la nature et le degré de nocivité du composant que l’on s’apprête à
installer.
A la lecture de lignes précédentes, on s’aperçoit clairement qu’ActiveX est très étroitement
lié à Windows. Les questions que l’on est en droit de se poser sont :
> Pourquoi le lien entre ActiveX et Windows est si fort?
>
Est il possible de porter ActiveX sur d’autres plates-formes ?
Nous allons essayer de répondre à ces questions. Pour comprendre le lien entre ActiveX et
Windows, il est nécessaire de retracer un bref historique de cette technologie.
En 1993 Microsoft établi COM qui est alors présenté comme un standard d’échange entre
objets. COM repose sur la technologie OLE (Object Linking and Embedding) qui est utilisée
par Windows depuis les années 1990. OLE met en place des mécanismes primitifs
permettant l’intégration d’un objet au sein d’un document (c’est l’insertion d’un graphe Excel
dans un document Word, que nous réalisions déjà sous Windows 3.1 !). COM apporte entre
autres à cette technologie, OLE Automation, qui rend le contrôle d’une application par une
autre possible. Microsoft défini ensuite un modèle de composants logiciels réutilisables qui
s’intègre aux applications supportant la technologie OLE.
En 1996, Microsoft annonce ActiveX, qui reprend le modèle de composants réutilisables
défini trois ans auparavant. Le principal attrait d’ActiveX est de s’évader du carcan que
représente OLE et de pouvoir s’intégrer
directement sur la plate-forme Windows.
Simultanément à ActiveX, Microsoft annonce DCOM, qui permet à une application locale
d’interagir avec une autre application distante via un réseau.
A la lecture de ce bref rappel historique, on s’aperçoit que la technologie ActiveX n’est pas
réellement innovante, mais au contraire qu’elle repose sur des mécanismes enfouis au plus
profond du système d’exploitation de Microsoft. Cette profonde intégration apporte son lot
d’avantages et d’inconvénients.
Un des avantages (ou inconvénients selon le point de vu que l’on prend) de cette intégration
est qu’une fois le composant ActiveX installé, il dispose entièrement des ressources de la
machine hôte. Son accès au système de fichiers, aux données et aux applications présents
sur la machine est total. Cela permet par exemple à la page web qui intègre un contrôle
ActiveX d’avoir accès aux mêmes fonctionnalités qu’une application Windows traditionnelle.
Ce qui ne peut être réalisé par une appliquette Java, qui s’exécute dans ce que l’on appel
communément un bac à sable ou Sandbox pour les anglophones, dont elle ne peut sortir.
Les restrictions apportées par ce mode d’exécution empêchent l’accès aux fichiers et aux
informations stockées localement, ce qui réduit considérablement la puissance des
appliquettes Java. Ces restrictions d’exécutions existent afin de protéger l’hôte de tout acte
malveillant, et c’est à ce niveau que la puissance d’ActiveX se retourne contre lui, car si l’on
installe un composant malveillant, alors rien ne limitera son pouvoir de nuisance.
On a bien compris qu’ActiveX est étroitement lié à Windows. Microsoft, ayant conscience de
cette limitation et étant bien décidé à couvrir largement le marché, décide, en 1997, de porter
- 25 cette technologie vers la plate-forme Unix. Plus précisément, la société de Redmond confie
en partie ce portage à la société Software AG. Une copie du communiqué de presse
annonçant cette volonté de s’ouvrir au monde Unix est disponible sur le site internet de
Microsoft [5].
Pour appréhender la difficulté que représente le portage de cette technologie, il faut bien
avoir à l’esprit qu’un contrôle ActiveX est un programme exécutable, qui ne peut fonctionner
que sur la plate-forme pour laquelle il a été compilé. On se rend alors compte que pour que
le portage soit efficace, il devra exister autant de versions d’un contrôle qu’il existe de plateforme d’exécutions (Windows, Macintosh, Unix …). Par contre le respect des standards
définis par COM, doit être possible quelque soit la plate-forme concernée.
Lorsque l’on a pris conscience des contraintes qui pèsent sur le portage de cette
technologie, on comprend mieux, pourquoi, près de dix ans après l’annonce de Microsoft,
ActiveX reste très fortement associé à Windows.
Revenons aux éléments qui composent ActiveX. Nous venons d’étudier cette technologie du
côté client, mais il ne faut pas oublier qu’il existe des serveurs ActiveX. Notre étude étant
naturellement orientée vers le client Internet, nous n’entrerons pas en détail dans l’usage de
cette technologie serveur. Nous nous contenterons, d’en faire une description générale.
Les serveurs ActiveX s’appuient sur ASP (Active Server Page). Une page ASP contient un
programme écrit dans un langage script tel que VBScript ou JScript, et qui est exécuté à
chaque fois qu’un navigateur la consulte. C’est lors de l’exécution de ce script qu’il est
possible de faire appel au serveur ActiveX et de lui confier la réalisation d’un traitement. Une
fois le traitement terminé, le résultat est envoyé au navigateur web sous forme d’une page
HTML classique.
Les avantages de cette solution sont multiples. Premièrement, le navigateur client ne reçoit
que du code HTML, ce qui rend cette technique compatible avec tous les navigateurs. On
s’affranchi ainsi des problèmes que posent le portage des contrôles ActiveX. En effet, même
si le serveur ActiveX dépend de la plate-forme sur laquelle il s’exécute, cela n’est pas gênant
dans la mesure où il n’est pas déployé et reste captif de la machine serveur.
Nous voici arrivé au terme de notre présentation d’ActiveX. Essayons de faire le point sur
cette technologie, et sur son domaine d’utilisation.
Nous avons vu qu’ActiveX du côté client est à manier avec précautions. Quoi qu’il en soit,
avant de se prononcer sur l’utilisation ou non de cette technologie, il faut absolument avoir
les quelques informations suivantes à l’esprit.
ActiveX offre une intégration inégalée au sein de Windows, qui lui permet de disposer
entièrement des ressources présentes sur la machine hôte. Grâce à cette technologie, il est
tout à fait possible d’imaginer une page web recevant des informations depuis un serveur, et
proposant de les transférer dans Excel simplement d’un clic. ActiveX est une formidable
passerelle entre le monde du Web et l’environnement Microsoft. Aucune technologie, pas
même Java et ses appliquettes n’autorise l’apport de fonctionnalités comparables à celle
proposées par ActiveX. La qualité et la richesse des composants fournis sont elles aussi des
atouts considérables en faveur de cette technologie. De plus ActiveX facilite grandement la
réutilisation de composants existant, et ce faisant augmente considérablement la productivité
et la stabilité des développements.
Bien qu’ActiveX ne soit pas reconnu par tous, il est considéré comme étant un standard au
sein de l’univers Microsoft, ce qui lui donne une crédibilité indéniable.
ActiveX, technologie propriétaire par excellence, reste très (trop) liée à Windows et Internet
Explorer. Même s’il existe une réelle volonté de la part de Microsoft de porter cette
technologie vers le monde Unix, nous sommes forcés de constater qu’à l’heure actuelle les
composants ActiveX fonctionnant sous Unix sont plutôt rares… Il convient aussi de noter,
même si cela ne doit plus être un frein à notre époque, qu’ActiveX ne fonctionne qu’à partir
- 26 de la version 3.0 d’Internet Explorer, ce qui exclut des bénéficiaires potentiels de cette
technologie, les possesseurs de Windows 3.1.
Un inconvénient majeur d’ActiveX se situe au niveau de l’aspect sécurité. La réponse de
Microsoft à ce problème est la signature des composants par leur concepteur. Cette
approche connaît de graves lacunes. En effet, pour que cette mesure soit efficace, il faudrait
que tous les composants soient signés, ce qui est loin d’être le cas. Ensuite rien n’empêche
un utilisateur négligeant ou mal intentionné de laisser un composant supposé nocif s’installer
sur son poste. Enfin, la signature d’un composant permet uniquement de s’assurer que celuici n’a pas été modifié depuis sa publication, elle ne nous renseigne en rien sur le degré de
nocivité d’un composant. Il est de ce fait tout a fait possible de télécharger un composant
signé qui nuira à la sécurité de votre système.
Côté serveur, le bilan est tout aussi mitigé.
L’utilisation d’ASP pour générer dynamiquement des pages web rend difficile la séparation
entre le code lié à l’interface utilisateur et le code lié à la logique métier.
Le serveur ActiveX comme son homologue côté client, ne se sent réellement à l’aise que sur
une plateforme Microsoft. Le choix de cette technologie impose donc l’utilisation d’un serveur
utilisant une panoplie d’outils propriétaires tels que ASP, SQL Server, MTS, l’ensemble
s’exécutant évidemment sur un système d’exploitation serveur Microsoft.
On peut résumer ces quelques points comme ceci.
Du côté client, ActiveX permet d’apporter des fonctionnalités qu’aucune autre technologie ne
peut égaler. Mais cela a un prix, en effet ActiveX reste très attaché à la plate-forme Windows
et ne propose pas de mécanisme de sécurité suffisant pour affronter le monde impitoyable
du Web.
A la réflexion, il existe un univers relativement sûr, peuplé de machines homogènes
exécutant pour l’immense majorité un système d’exploitation Microsoft. C’est l’univers de
l’entreprise et de son réseau Intranet. C’est en effet dans ce cadre que l’on pourra tirer le
meilleur parti de la technologie ActiveX, il faut juste accepter, en connaissance de cause, de
placer son système d’informations à la merci d’une technologie propriétaire.
Cette conclusion nous mène la fin de l’étude d’ActiveX. Reportons notre attention sur le
navigateur fétiche de Microsoft, et intéressons nous particulièrement à son avenir proche.
Lors de la lecture du petit historique introduisant ce chapitre, vous avez certainement noté
qu’Internet Explorer n’avait pas connu de mise à jour majeure depuis 2001. Et bien, ceci est
en passe d’être réparé ! En effet, Microsoft a entamé en 2005 le développement de la
nouvelle version de son navigateur qui équipera son futur système d’exploitation Windows
Vista. Cette version est présentée par Microsoft comme une évolution fondamentale de son
navigateur Internet. Pour s’en assurer, il suffit de télécharger la version bêta disponible sur le
site de l’éditeur.
Voici pêle-mêle les principaux apports de cette version.
L’interface du navigateur a été profondément modifiée (rappelez vous, elle n’avait
pratiquement plus évolué depuis 1997). Internet Explorer propose maintenant une interface
rationalisée, qui met en avant les fonctionnalités essentielles du navigateur, et masque les
informations secondaires.
Le principe de la navigation évolue lui aussi, avec la possibilité d’ouvrir une nouvelle page
dans un onglet, et d’ensuite visualiser le contenu des différents onglets sous forme de
vignettes sur le même écran.
La gestion de l’impression est elle aussi grandement améliorée : il est enfin possible
d’imprimer la totalité du contenu d’une page web sur une feuille.
Il convient de saluer l’arrivé d’un bouton permettant enfin d’effacer en un clic (ou presque)
toutes les informations personnelles conservées dans le navigateur, telles que le cache et
- 27 l’historique de navigation, les cookies, les mots de passes et autres informations issues des
formulaires de saisie.
Internet Explorer 7.0 intègre aussi une foule de petites améliorations telles que : la gestion
native des flux RSS, la présence d’un outil de recherche paramétrable, un filtre antiphishing…
Cette liste n’est pas exhaustive, loin s’en faut… Mais il semble que les changements les plus
intéressants apportés à Internet Explorer ne sont pas visibles au premier coup d’œil et ne
sont pas au cœur de la campagne marketing que livre le géant de Redmond.
En effet, la question qui taraude actuellement le monde de l’Internet est de savoir si cette
évolution va améliorer la prise en charge des standards web par Internet Explorer. Et les
bribes de réponse que l’on obtient ne proviennent pas du service marketing de Microsoft,
mais des développeurs eux-mêmes !
A la lecture du blog [6] tenu par l’équipe de développement d’Internet Explorer 7.0, il apparaît
que les efforts de développement ce sont portés en premier lieu sur l’aspect sécurité, qui fait
défaut au navigateur depuis longtemps. Le filtre anti-phising précédemment mentionné est le
résultat visible de cette volonté d’accroître le niveau de sécurité du navigateur. Mais d’autres
mesures ont été prises, par exemple, la version du navigateur livrée avec Windows Vista,
fonctionnera dans ce que les développeurs de Microsoft appellent un "mode protégé", qui
empêche le navigateur d’accéder aux paramètres systèmes et utilisateurs. Avouez, que ce
mode sensé être un barrage à la prolifération des logiciels espions, ressemble beaucoup au
bac à sable de Java ! Ajoutons à cela, que dorénavant, les réglages par défaut du navigateur
amèneront l’utilisateur à devoir donner son avis avant que le système ne télécharge un
contrôle ActiveX.
Intéressons nous maintenant au respect des standards, qui n’est peut être pas une priorité
pour Microsoft, mais qui l’est pour la majorité des concepteurs de sites web.
Les avancées sur ce point semblent plus timides, mais les développeurs nous promettent
tout de même une meilleure gestion, des images au format PNG, du CSS2 et le support de
HTML 4.0.1.
Nous venons de faire le point sur les avancés d’Internet Explorer, au niveau de la sécurité et
du respect des normes, mais nous avons omis quelque chose de très présent dans la culture
Microsoft : les technologies propriétaires ! Evidemment, cette version de l’explorateur
n’échappe pas à la règle, en introduisant XAML (eXtensible Application Markup Language).
XAML est un langage basé sur la norme XML établie par le W3C. Lorsque nous disons que
XAML est introduit par Internet Explorer, ce n’est pas tout à fait vrai, dans la mesure où ce
langage a avant tout été développé afin de décrire les interfaces utilisateurs des logiciels
s’exécutant sur la plate-forme Vista. Selon Microsoft, l’utilisation de XAML devrait permettre
de développer les interfaces des applications clients aussi aisément que celles des
applications web. Un autre intérêt de ce langage serait d’améliorer la scission entre la
logique métier, et la description de l’interface utilisateur. Il serait alors plus aisé de confier le
développement de l’interface à des designers. L’intégration de cette technologie au sein
d’Internet Explorer 7.0, lui autorise l’accès à des interfaces utilisateurs jusqu’alors réservées
aux applications Windows traditionnelles.
Tous les utilisateurs du navigateur Microsoft seront unanimes pour affirmer que ces
avancées sont les bienvenues. Mais peut on parler de réelles innovations ?
La réponse est malheureusement majoritairement négative… En effet, hormis au niveau de
la sécurité, où Internet Explorer à pris un peu d’avance sur ses concurrents, les autres
apports de cette version se contente de ramener le navigateur Microsoft au niveau de ses
- 28 rivaux. Même le prometteur XAML, s’inspire du très populaire XUL, développé par la
fondation Mozilla et implémenté dans FireFox.
Espérons, que la volonté de Microsoft de rattraper le retard accumulé, ne se transformera
pas comme par le passé, en une escalade technologique visant à éliminer le concurrent
qu’est devenu FireFox. L’histoire nous a déjà démontré que dans ce type de d’affrontement,
les principaux perdants sont les standards et la fiabilité, alors que justement, tous les acteurs
du Web réclament à corps et à cris que les standards existants soient enfin respectés.
2.3.
Firefox de la fondation MOZILLA
Pour mieux comprendre la philosophie et le concept de Firefox, refaisons un peu d'histoire…
Début des années 1990, Tim BERNERS-LEE, chercheur anglais au CERN de Genève, créa
le protocole Hyper Text Transfert Protocol (HTTP) ainsi que le Hyper Text Markup Language
(HTML). Ce fut les origines du World Wide Web ou plus populairement le Web. Le HTML
permet de structurer un texte avec des balises (Tags ou Markups) prédéfinies. Par exemple,
un titre sera balisé par le tag "h1", qui veut dire titre de niveau 1, ou un paragraphe aura une
balise "p". On pouvait passer d'un document à l'autre grâce à des liens hypertextes. Cela
permettait aux chercheurs du CERN de partager tous leurs documents, mais cette
technologie ne devait pas rester confiné et tous les outils et toute la documentation furent
distribués gratuitement.
Tim BERNERS-LEE fonda, par la suite, le W3C, le World Wide Web Consortium, qui a pour
but de promouvoir et d'assurer la compatibilité des technologies en proposant des standards
et leurs évolutions. Ainsi est né le XML (eXtensible Markup Language), langage de balises à
définir. Le XML permet ainsi de décrire toutes sortes de données.
Le 22 avril 1993, l'université de l'Illinois inventa le premier browser graphique : Mosaic. Ce
logiciel permettait de lire des pages HTML via le protocole HTTP et affichait également des
images. Il a permis au web de sortir de l'anonymat en simplifiant la navigation et en pouvant
s'installer sur le système d'exploitation le plus utilisé : Windows.
Le 4 avril 1994, quelques étudiants ayant créé Mosaic ont fondé la société Netscape et ont
développé leur propre browser : Netscape Navigator. Il est vite devenu le logiciel de
référence à tel point que l'on ne parle plus de browser mais de navigateur web !
Netscape ajouta à son navigateur, un client de messagerie électronique, un logiciel de
lecture de newsgroup et un éditeur de page internet, cette suite fut nommée Netscape
Communicator. Netscape créa également le JavaScript, langage différent de celui de SUN,
le Java. Le JavaScript est un langage de programmation qui est exécuté dans un navigateur
et n'a pas besoin d'être compilé. Il permet de donner des fonctionnalités avancées aux
navigateurs.
En 1995, 90% des pages web sont lues via Navigator, ce qui permet à Netscape d'entrer en
bourse. Mais cela déclencha également les hostilités avec Microsoft : ce fut ce qu'on appelle
aujourd'hui la "guerre des navigateurs". La force commerciale de Microsoft et l'intégration de
son navigateur au sein de son Système d’exploitation Windows renversèrent la situation. De
plus, Internet Explorer tolérait le non-respect du HTML standardisé par le W3C, ce qui valut
la préférence des concepteurs novices et amateurs. De nombreux sites internet furent créés
en détournant la syntaxe du langage HTML, ils étaient labellisés par "Optimisé pour Internet
Explorer".
- 29 Pour contrer l'avancée d'IE, Netscape choisit d'ouvrir le code source de son navigateur le 31
mars 1998. Netscape a fait ce choix pour pouvoir profiter des perfectionnements que la
communauté des développeurs indépendant pouvaient lui offrir. Ce projet fut baptisé Mozilla,
nom déjà utilisé par les développeurs de Netscape en interne pour nommer leur application,
contraction de Mosaic et de Godzilla, monstre mythique japonais.
Malheureusement, ce projet est énorme et compliqué. Il est très difficile de fédérer le travail
interne et le travail externe. Mais la guerre à l'innovation pousse Netscape à réécrire
quasiment tout le code du navigateur avec un nouveau moteur de rendu nommé Gecko.
Entre temps, le 24 novembre 1998, Netscape fut racheté par ce qui allait devenir AOL Time
Warner, et fut contraint de sortir la version 6 de Navigator, version prématurée et très
décevante. Ce fut le début de la fin ! Après avoir sorti Navigator 7.1, le 15 juillet 2003,
Netscape fut liquidé et la plupart des développeurs furent licenciés.
Le jour même, la création de la fondation Mozilla est annoncée, c'est une association à but
non-lucratif soutenue notamment par AOL et Google, Le projet a pu continuer par
l'embauche des développeurs de Netscape et de nouveaux contributeurs. La fondation s'est
donnée pour mission de protéger le choix et l'innovation sur internet [7].
Mozilla propose plusieurs produits disponibles sur la plupart des plates-formes actuelles,
Windows, Macintosh, Unix, Linux :
le navigateur internet Firefox
le client de messagerie Thunderbird
le navigateur internet Camino réservé à Mac OS X
la suite intégrée internet SeaMonkey
le logiciel de suivi de bug Bugzilla
Firefox ou "renard de feu" est le nom anglais désignant un panda rouge en voie d'extinction.
Fig. 11: logo de Firefox
Depuis le 9 novembre 2004, ce nom désigne également le navigateur web de la fondation
Mozilla. Il est développé sous licence open source, c'est-à-dire qu'il est distribué librement,
que son code source est disponible et qu'il est possible de réaliser des travaux dérivés.
Firefox arbore de nouvelles fonctionnalités par rapport à son homologue Internet Explorer.
En effet, il dispose d'un bloqueur de pop-up , un moteur de recherche intégré, une navigation
par onglets ou des marque-pages dynamiques.
Firefox s'installe aisément sur pratiquement tous les systèmes d'exploitation. Son fichier
d'installation ne pèse que 5 Mo alors que celui d'Internet Explorer est de 25 Mo. Autre
différence importante, Firefox possède une gestion efficace des données personnelles de
l'utilisateur, en effet, il suffit de presser un seul bouton pour effacer toutes les informations
enregistrées, chose quasi impossible avec IE.
Firefox est aussi plus sûr, car les quelques failles de sécurité découvertes sont rapidement
corrigées, il en est différemment pour Internet Explorer.
- 30 Une des priorités que s'était fixée la fondation Mozilla, est de rendre Firefox plus
respectueux des standards web définis par le W3C. Ces standards sont notamment le
XHTML, CSS, XML, DOM, Math ML, XSL.
En juillet 2005, Firefox représente 15% des visites en France d'après l'étude de la société
Xiti [8].
Firefox peut avoir ses capacités enrichies grâce à l'utilisation de XUL.
2.4.
XUL , la boîte à outils de Mozilla
XUL ou XML User interface Language est un langage XML permettant de définir l'interface
graphique d'une application.
Ce langage fut créé pour les besoins du projet Mozilla pour garantir la portabilité de
l'ensemble de leurs logiciels sur l'ensemble des systèmes d'exploitations.
XUL comprend un ensemble de balises définissant des boutons, des listes, des onglets, des
menus et peut intégrer des feuilles de styles (ou CSS) pour modifier l'apparence de
l'application. À chacun de ces objets graphiques correspondent des évènements comme le
clic de souris ou le déplacer d'objets. Les développeurs doivent écrire ces évènements le
plus souvent en Javascript. En clair, XUL est la combinaison de XML et de HTML pour la
structure, de CSS pour l'apparence, et le Javascript pour la gestion des évènements.
Malgré la vaste bibliothèque d'éléments standards, il est possible de créer ses propres
balises pour mettre en place de nouveaux composants par l'intermédiaire d'un fichier XBL,
eXtensible Binding Language. Il suffit de décrire l'aspect graphique et du comportement de
ces composant. Ce fichier permet de réutiliser ces nouveaux composants pour d'autres
applications.
Comment s'organise une fenêtre XUL ?
L'interface utilisateur est séparée en quatre : le contenu, l'apparence, le comportement et les
informations de localisations. Le contenu d'une fenêtre XUL est un ensemble de boîtes
rectangulaires. Chaque boîte contient des sous-éléments qui sont disposés horizontalement
ou verticalement. Ces sous-éléments peuvent être des champs de texte, des listes
déroulantes, des tableaux. Ces sous-éléments peuvent contenir également d'autres
éléments. Chaque boîte peut être paramétrée pour l'alignement à gauche, en haut, centré et
pour son comportement si la fenêtre est redimensionnée.
Attardons nous sur un petit exemple [9] :
<?xml version="1.0"?>
<window xmlns="httphttp://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<box align="center">
<button label="Clique ici" oncommand="alert('Bonjour le monde !');" />
</box>
</window>
La première balise <xml> nous montre bien que nous avons à faire avec un fichier XML.
La balise <windows> déclare une fenêtre, où dans celle-ci se trouve une boîte <box>. Cette
dernière contient un bouton <button>.
- 31 Ce bouton a un libellé "Clique ici" et un événement "oncommand" généré lorsque l'on clique
sur le bouton. Cet événement lance l'exécution du code Javascript d'ouverture d'une pop-up
d'alerte où il sera écrit "Bonjour tout le monde !".
Fig. 12: résultat de l'exemple
Les avantages de la technologie XUL sont :
> XUL repose sur des langages standardisés par le W3C, ils ne sont pas spécifiques à
Mozilla, donc l'apprentissage peut être assez rapide.
>
Pas besoin de logiciels propriétaires pour développer, un simple éditeur de texte
suffit.
>
Une application XUL est automatiquement multi plate-forme.
Les inconvénients sont :
> Il est nécessaire d'utiliser un navigateur qui utilise le moteur de rendu Gecko.
>
Cette technologie est pour l'instant très peu documentée et il n'y a pas encore une
forte communauté.
XUL rencontre deux concurrents différents avec des technologies propriétaires.
Le premier, MXML, Macromedia XML, est utilisé avec la technologie Flash de Macromedia. Il
nécessite l'utilisation d'un serveur Flex et le lecteur Flash sur le poste client quelque soit le
système d’exploitation. Le langage utilisé est l'ActionScript, assez proche du JavaScript.
Le deuxième est le XAML, eXtensible Application Markup Language, repose sur le moteur
graphique Avalon du futur système d'exploitation Windows Vista dont la sortie n'est pas
prévue précisément. XAML ne peut fonctionner que sur Windows. Le langage utilisé sera un
de ceux disponibles parmi la plate-forme .NET.
Actuellement, les applications XUL ne sont interprétées que par les logiciels Mozilla. La
fondation a décidé de développer un projet neutre nommé XULRunner qui serait un
environnement d'exécution d'applications XUL. Il fournira des mécanismes pour l'installation,
le déploiement, la mise à jour et la désinstallation des applications.
Ces mécanismes sont cruciaux pour les Directions des Systèmes d'Informations, comme
peut en témoigner Jean-Christophe POTOCKI, directeur informatique du Monde.fr [10].
- 32 -
En 2005, le Monde.fr a choisi de refondre l'interface utilisateur de son outil de back-office
pour améliorer la productivité. En effet, quotidiennement, le Monde.fr met en ligne plus de
200 articles et contenus multimédias qui sont lus par près d'1 millions d'internautes [10].
Le Monde.fr dispose d'un outil de gestion et de publication de contenu développé en PHP et
en open source. Il fallait donc reprendre cet outil et améliorer l'interface utilisateur tout en
faisant les développements en interne. La maintenance de développements en DHTML et
Ajax était trop lourde et trop complexe pour ce projet. XUL s'imposait tout naturellement car
reposant sur les standards du web maîtrisés par l'équipe du Monde.fr. Les développements
ont nécessité sept mois aux deux développeurs PHP du Monde.fr. « Une fois que l'on
maîtrise la technologie, le développement n'est pas plus long qu'avec un autre langage. Mais
nous souhaitions passer du temps à nous former sur XUL et à concevoir notre client »,
explique Jean-Christophe POTOCKI [10].
Autre raison qui a privilégié le choix de XUL est la mise à jour automatique empruntée à
Firefox. En effet, pour installer les modifications ou les nouveautés de l'interface du CMS,
c'est l'application elle-même qui vérifie s'il n'y a pas une nouvelle version. Dans ce cas, le
logiciel rapatrie un package contenant tous les fichiers nouveaux et modifiés.
« Nous développons plus vite et, grâce à l'architecture client riche, nous n'avons plus à
déployer et à mettre à jour l'application poste après poste. Les utilisateurs disposent d'une
interface conviviale et très ergonomique, axée sur le travail collaboratif, qui leur fait gagner
du temps » conclut Jean-Christophe POTOCKI [10].
La fondation Mozilla propose grâce à ses logiciels et ses développements une réelle
alternative et une solution innovante au géant mondial des softwares. En effet, depuis 2003,
Microsoft n'avait plus de concurrent au niveau des navigateurs internet, il a donc cessé
d'innover et ce sont donc les utilisateurs qui en pâtissent. Il fallait donc se contenter de lire
des sites internet et n'avoir que très peu interactions avec les futurs services internet qui
pourront nous être proposé. Or Mozilla commence à poser les jalons d'un nouvel Internet
tout en reposant sur les actuelles bases du web.
En effet, l'Internet d'aujourd'hui et ses applications en entreprise, sur les postes clients,
repose essentiellement sur les langages balisés définis par le W3C et le javascript. Cela peut
donner de belles interfaces graphiques mais sans intelligence, ce qui provoque des allersretours sans cesse avec les serveurs. Ces chargements intempestifs de pages provoquent
des ruptures dans la navigation des utilisateurs et des consommations coûteuses en bandepassante . À cela, une solution a été apportée, nommée Ajax. Dans la presse spécialisée,
Ajax noircit des pages et des pages, mais qu'en est-il réellement ?
- 33 -
3. Ajax, la technologie qui dépoussière le Web [11]
La dénomination Ajax (Asynchronous JavaScript And XML) est très en vogue actuellement,
il suffit en effet de compter le nombre d’articles y faisant référence dans la presse spécialisée
pour s’en convaincre. Ce chapitre va en premier lieu, définir ce qui différencie une
application web traditionnelle d’une application Ajax. Nous examinerons ensuite quelques
applications web tirant profits de cette technologie. Après quoi, nous nous intéresserons plus
particulièrement à la manière dont est structuré une application Ajax. Et enfin, nous verrons
ce qu’Ajax apporte comme changements au niveau du serveur.
Le terme Ajax (Asynchronous JavaScript And Xml) a été utilisé pour la première fois en 2005
dans un article [12] écrit par Jesse James GARRETT. Ce dernier, fondateur de la société
Adaptive Path, formalise l’utilisation de différentes technologies relativement anciennes, sous
l’appellation Ajax. Voici un bref descriptif des technologies misent en oeuvre:
> XHTML et CSS, sont deux standards permettant la création de page web.
>
DOM est une recommandation du W3C permettant à un langage script de modifier
dynamiquement les objets composant une page web.
>
XML et XSLT sont deux standards qui permettent l’échange et la manipulation de
données.
>
JavaScript est un langage script, reconnu nativement par tous les navigateurs
modernes.
>
XMLHttpRequest est un objet manipulable via JavaScript, permettant la récupération
asynchrone de données.
C’est la combinaison de ces différentes technologies relativement anciennes qui offre plus
d’interaction à l’utilisateur, et donne vie au concept d’Ajax.
Avant de détailler ce concept, il est nécessaire de rappeler le mode de fonctionnement d’une
application web traditionnelle.
Une application Internet traditionnelle, de type client léger - serveur est basée sur une série
de pages web qui peuvent être statiques ou dynamiques. Lorsque l’utilisateur sélectionne un
lien, ou valide un formulaire, une requête est transmise au serveur web. Celui-ci, après avoir
effectué les traitements nécessaires (par exemple, une requête dans une base de données,
un calcul …), renvoie une nouvelle page au client ayant effectué la requête.
Ce mode de fonctionnement (décrit sur la figure 13) apporte quelques désagréments.
Fig. 13: modèle d'application web classique
En premier lieu, il est systématiquement nécessaire de recharger une page web complète
suite à une requête, et ce, quelque soit la quantité d’informations à rafraîchir. Un exemple
- 34 assez typique de ce comportement peu se rencontrer lors de la saisie d’une l’adresse de
livraison sur un site marchand. L’internaute sélectionne un pays dans une liste déroulante,
cela déclenche le chargement d’une nouvelle page contenant une liste de régions. Le choix
d’une région, entraîne le chargement d’un page intégrant une liste déroulante contenant les
différentes villes de cette région. Cet exemple assez primaire, démontre la faiblesse de ce
mode de fonctionnement : alors qu’il ne serait nécessaire que de mettre à jour les listes
déroulantes après chaque choix de l’utilisateur, c’est toute la page qui est rechargée,
entraînant de ce fait, un surcroît de trafic inutile.
En outre de surcharger inutilement le réseau, la nécessité de recharger une nouvelle page
après chaque action de l’utilisateur influe sur la structure de l’application résidant sur le
serveur. En effet, chaque page émise contient des éléments de présentation, des
informations concernant l’utilisateur et les données résultantes de la requête émanant du
client. La génération de ce type de document ne favorise pas la séparation de la logique
métier et de la logique applicative, ce qui risque de pénaliser la maintenabilité de
l’application.
Un autre inconvénient de ce mode de fonctionnement est lié à la latence réseau. La latence
caractérise le temps écoulé entre le moment où une requête est émise par le client et le
moment où la réponse du serveur lui parvient. L’étendu et la complexité du réseau Internet,
associés au niveau de charge très variable des serveurs web, rendent cette latence
extrêmement fluctuante. Il est donc impossible de prédire le temps qui s’écoulera entre le
chargement de deux pages consécutives. Cette imprévisibilité de la latence, rend la
navigation extrêmement dépendante des performances du réseau et des serveurs, ce qui
contribue à accroître la sensation d’inertie qui émane de ce type d’application.
A la lumière de ces éléments, il apparaît que les applications web traditionnelles, sont
adaptées lorsqu’il est nécessaire de mettre en place une navigation linéaire reposant
essentiellement sur des hyperliens. A contrario, ce type d’application, n’est pas le plus
adapté lorsque le contenu des pages résulte principalement de traitements réalisés sur le
serveur. L’application traditionnelle, manque alors de réactivité, ce qui pénalise le confort
d’utilisation et entraîne une inévitable perte de productivité.
Ce sont ces limitations, qui ont amenés les développeurs à réfléchir à des modes de
développement permettant d’accroître la réactivité des applications web, tout en réduisant le
volume d’information transitant sur le réseau. Ajax est le fruit de ces réflexions. Il faut voir
dans ce concept, plus qu’une simple formalisation de l’utilisation de différentes technologies.
Ajax est avant tout une nouvelle façon de concevoir les applications client – serveur.
C’est justement la manière d’aborder la création d’application Ajax, qui est abordé dans la
suite de ce chapitre.
Avant de rentrer dans le vif du sujet, il est nécessaire de comprendre le mode de
fonctionnement d’une application riche écrite avec Ajax.
Comme cela a été indiqué préalablement, une application Ajax repose sur JavaScript.
Lorsque l’internaute se connecte sur la page hébergeant l’application, celle-ci est chargée
dans la mémoire du navigateur.
L’application est constituée :
> De son interface graphique, qui est basée sur les standards du Web que sont XHTML
et CSS.
>
D’un moteur Ajax écrit en JavaScript, qui gère la logique applicative propre à
l’application et la communication avec le serveur.
- 35 Lorsque l’utilisateur effectue une action nécessitant la mise à jour de l’affichage, l’interface
graphique fait appel au moteur Ajax par le biais d’un appel de fonction JavaScript. Le moteur
Ajax transmet alors une requête au serveur. Lorsque le serveur a terminé son traitement, il
fait parvenir le résultat au moteur Ajax du client, en utilisant le format d’échange XML. Les
informations recueillies sont alors mises en forme et intégrées dans l’interface utilisateur. Il
est important de noter que les échanges entre le moteur Ajax et le serveur sont
asynchrones. C'est-à-dire qu’une fois la requête émise par le client, celui-ci ne reste pas figé
en attendant la réponse du serveur, comme c’est le cas pour une application web classique.
En attendant la réponse, l’application reste disponible, et l’utilisateur peut continuer à
interagir avec elle. Cette différence de comportement est explicitée sur la figure 14.
Fig. 14 : modèle d'application web avec Ajax
Dans une application Web classique, l’utilisateur ne peut plus agir sur l’application tant que
celle-ci n’a pas obtenu de réponse du serveur.
Fig. 15a: comparaison des 2 modèles
Le fonctionnement d’une application AJAX est fondamentalement différent, dans la mesure,
où l’utilisateur a toujours la possibilité d’agir sur l’application, même lorsqu’elle attend une
réponse du serveur.
- 36 -
Fig. 15b: comparaison des 2 modèles
Un des sites web tirant pleinement parti des échanges asynchrones proposé par Ajax est le
géoportail Google Maps situé à l’adresse internet : http://maps.google.fr/. En effet, lorsque la
carte demandée par l’internaute est affichée, l’application Ajax s’exécutant au sein du client,
charge de façon masquée les cartes situées en périphérie immédiate. Ainsi la réactivité de
l’application, lorsque l’utilisateur se déplace au sein de la carte, s’en trouve grandement
améliorée.
Comme nous l’avons vu, le mode de fonctionnement d’une application Ajax est
fondamentalement différent de celui d’une application web classique. Il est par conséquent
nécessaire aux concepteurs de réviser profondément leur vision de l’application Internet.
Voici quelques principes élémentaires à garder à l’esprit, lorsque l’on décide de développer
une application Ajax.
L'application est hébergée par le navigateur
Dans le cadre d’une application web traditionnelle, après chaque action de l’utilisateur, le
navigateur reçoit un document contenant des données noyées au milieu d’informations de
présentation.
Une application Ajax, fonctionne de façon totalement opposée. En effet, elle déporte une
partie de la logique applicative normalement présente sur le serveur vers le navigateur.
Celui-ci devient alors capable de gérer localement certains événements, sans intervention du
serveur.
Dans ce mode de fonctionnement, l’application est chargée dans la mémoire du navigateur
lorsque l’internaute se connecte, et y persiste jusqu’à ce que survienne la déconnexion.
Cette particularité permet à l’application de mémoriser des informations, sans
nécessairement devoir les enregistrer sur le serveur.
- 37 Les données sont fournies par le serveur
Comme mentionné précédemment, un document web traditionnel associe présentation,
contenu et données. Dans le cas d’une application Ajax, les seules informations envoyées
par le serveur sont des données au format XML. La mise en forme destinée à la présentation
des données est réalisée par l’application hébergée par le client.
Le trafic généré par une application Ajax, est important lors de la connexion, car il est alors
nécessaire de charger toute l’application. Cependant, les communications suivantes avec le
serveur sont bien plus efficaces dans la mesure, où elles ne contiennent pas d’information
de présentation superflue.
Si dans le cadre d’une application utilisée sporadiquement, le gain de trafic par rapport à la
solution classique n’est pas évident, il le devient lorsque la fréquence d’utilisation de
l’application augmente.
La navigation est continue et fluide
Les interactions entre l’utilisateur et un navigateur web, se limitent à l’utilisation d’hyperliens
et de formulaires. Ces derniers proposent une gamme de composants d’interface basiques,
permettant la saisie d’informations élémentaires. Ces composants, ne peuvent pas rivaliser
avec ceux que l’on rencontre au sein d’une application bureautique traditionnelle.
Dans une application internet classique, les hyperliens, comme les formulaires pointent sur
une page qui sera chargée lorsqu’ils seront sollicités. Ils peuvent éventuellement pointer sur
un script, qui effectuera une opération basique (par exemple vérifier la conformité d’une
saisie), avant de transmettre les données au serveur. La duré de vie du script est alors
limitée a celle de la page qui le contient. Une fois les données envoyées au serveur, la page
d’origine reste visible un certain temps, durant lequel, il est encore possible de cliquer sur
des liens. Si cette éventualité n’a pas été prévue du côté serveur, le risque qu’apparaissent
des dysfonctionnements est important. Pour éviter ce genre de désagrément, l’utilisateur doit
s’armer de patience et attendre tranquillement l’arrivée de la page rafraîchie. Ces temps
d’attentes répétés brisent la continuité de l’interaction de l’utilisateur avec l’application.
L’exemple le plus courant de cette situation, est le panier d’achat que l’on rencontre dans
bon nombre de sites marchands. A chaque fois qu’un article est ajouté au panier, la
navigation est interrompue tant que le serveur n’a pas envoyé la page tenant compte de la
modification du panier.
Et c’est dans ce domaine qu’Ajax apporte un net progrès. L’application étant chargée à
demeure dans le navigateur et les échanges de données étant asynchrones, rien ne vient
interrompre l’utilisateur dans son interaction avec l’application. Cette continuité permet à
l’utilisateur de s’immerger dans son occupation, sans être régulièrement renvoyé à la réalité.
L’exemple du panier d’achat est encore une fois très explicite. Avec Ajax, lorsque un article
est ajouté, l’utilisateur peut de suite reprendre l’exploration de son catalogue, sans attendre
la mise à jour du panier. C’est l’application qui est chargée d’actualiser l’affichage lorsqu’elle
recevra les informations du serveur.
La disparition de ces moments d’errements entre l’affichage de deux pages, évite de surcroît
à l’utilisateur de sélectionner un lien sur une page qui n’est plus valide. Ce qui réduit les
risques de dysfonctionnements, sans compliquer inutilement le développement de
l’application côté serveur.
En plus de rendre l’interaction de l’utilisateur avec l’application continue, Ajax, enrichie
considérablement la gestion des événements au sein du navigateur. Alors que dans le mode
classique, les requêtes sont adressées au serveur uniquement après un clic, avec Ajax, il est
possible d’interroger le serveur suite à un déplacement de la souris ou à la saisie d’un
caractère au clavier. Une page illustrant ce nouveau mode de fonctionnement est disponible
à l’adresse : http://www.google.com/webhp?complete=1&hl=en. Il s’agit de Google Suggest,
un moteur de recherche expérimental proposé par le géant Google. La particularité de cette
- 38 page, est de proposer des suggestions de recherche évoluant en temps réel après chaque
modification de la requête saisie par l’utilisateur.
Cette gestion des évènements permet de mettre en place des mécanismes d’interface
utilisateur plus complexes tel que le glisser - déplacer. Ce genre de mécanismes permet de
palier au manque de composants d’interface du navigateur, et rapproche le niveau de
l’interface web de celui de l’application bureautique classique.
La programmation de l’application requiert de la discipline
Jusqu’alors, les applications web classique, réservaient JavaScript à des tâches subalternes
comme la vérification de formulaires ou l’animation de quelques éléments graphiques.
L’arrivé des applications Ajax montre ce langage sous un nouveau jour. Il n’est plus ici
question d’écrire de petites fonctions annexes, mais belle et bien une application complète,
qui doit s’exécuter correctement quelques soient les conditions d’utilisation. Pour atteindre
cet objectif, il est nécessaire d’écrire un code de grande qualité, maintenable, robuste et
optimisé. Le développement d’applications internet doit donc s’inspirer fortement de la
rigueur et de la discipline qui existe lors de la conception de clients lourds. Cette remarque
est d’autant plus vrai, que la taille importante des applications, peut nécessiter un
développement en équipe, avec tous les problèmes organisationnels que cela implique.
Il ressort de ces principes élémentaires, qu’une application Ajax apporte une ergonomie et
une fluidité d’utilisation jusqu’alors réservée aux clients lourds. La contrepartie de cette
richesse se trouve au niveau de la complexité du développement, qui doit être considéré
avec les mêmes égards que le développement d’une application bureautique traditionnelle.
Maintenant, que les principes définitionnels d’Ajax sont posés, il semble intéressant, de faire
un rapide tour d’horizon du Web, afin de présenter quelques applications tirants efficacement
partie d’Ajax. Cela permettra de se rendre compte des apports pratiques de cet assortiment
de technologies.
Il est impossible de parler d’Ajax sur le Web sans évoquer Google. Cette entreprise est l’une
des pionnières dans ce domaine. En effet, la version bêta de son service Gmail développé
au début 2004, était déjà conforme aux préconisations d’Ajax, avant même que la
dénomination ne soit inventée. L’interface graphique alors proposée était sans commune
mesure, avec les standards web de l’époque. L’utilisateur se voyait offert la possibilité
d’ouvrir plusieurs courriers simultanément. L’arrivée de nouveaux mails était signalée, même
lors de la rédaction d’un courrier. Les services alors proposés équivalaient à ceux offert par
l’interface web du serveur de messagerie Microsoft Outlook, et ce sans avoir recours ni à
ActiveX ni aux appliquettes Java.
Le géoportail Google Maps (figure 16), précédemment évoqué, est un outil qui tire profit
d’Ajax. Ce portail, intègre en plus de l’affichage des cartes, un puissant moteur de
recherche, capable de déterminer le trajet optimum entre deux adresses spécifiées. La
sélection d’une étape sur la feuille de route affiche une fenêtre contextuelle, contenant une
vue agrandie du plan. Mais l’aspect le plus surprenant de ce site concerne la souplesse de la
navigation au sein de la carte. Le déplacement s’effectue par un simple glissement de la
carte avec la souris. La carte se redessine généralement instantanément, car les zones
contiguës à la portion centrale ont été chargées par l’application avant même que ne
commence le déplacement. Si un déplacement est trop rapide ou si la charge du réseau
interdit la mise à jour de la carte à temps, cela n’empêche pas la navigation de continuer.
Les zones manquantes seront affichées dès leur réception par l’application.
Dans le cas présent, Ajax apporte une fluidité à la navigation qui est tout simplement
inimaginable avec une application web traditionnelle.
- 39 -
Fig. 16: impression écran de Google Maps
Google n’est pas la seule entreprise à croire en Ajax. Preuve en est que son rival Yahoo lui
emboîte le pas et proposant à son tour un portail web basé sur ce concept. Le résultat est
tout simplement surprenant ! L’application gère entre autre le glisser – déplacer, les menus
contextuels, les raccourcis clavier. En ce qui concerne les fonctionnalités, rien ne manque.
Le correcteur orthographique, l’agenda et le bloc note sont présents. Yahoo Mail, présente
une interface graphique et des fonctionnalités dignes d’un client de messagerie traditionnel.
L’implication de Yahoo dans l’aventure Ajax est telle, que l’entreprise met librement à la
disposition des développeurs un ensemble de bibliothèques intégrant les fonctions de bases
nécessaires à la réalisation d’applications riches basées sur Ajax.
- 40 -
Fig. 17 : impression écran de Yahoo! Mail
Ces exemples démontrent qu’Ajax attire l’attention de grandes entreprises spécialisées dans
la prestation de services Internet. Le fait que des sociétés aussi prestigieuses s’impliquent
autant dans le mouvement Ajax, contribue à pérenniser ce concept. Il serait en effet assez
surprenant, que tant d’efforts fournis afin de mettre en oeuvre ces technologies, ne soit que
le résultat d’un effet de mode. La publication de bibliothèques de fonctions, et
d’environnements de développements intégrants Ajax, semble aussi aller dans ce sens.
Les applications proposées par ces sociétés, sont en quelque sorte des laboratoires
permettant la mise au point de ce que sera l’application Internet de demain. Une étape dans
cette direction a d’ailleurs été franchie par Google. Celui-ci a mis en ligne un tableur,
reposant sur Ajax, et intégrant toutes les fonctionnalités nécessaires à la création de feuilles
de calculs exploitables professionnellement. Les documents ainsi créés sont compatibles
avec Excel et peuvent être conservées sur le site dans l’attente d’être modifiés, ou
sauvegardé localement. Ce type d’application préfigure peut être ce que sera le bureau
virtuel de demain.
Intéressons nous maintenant d’un peu plus près à la structure d’une application Ajax.
Comme cela a été indiqué au début de ce chapitre, ce concept repose essentiellement sur
quatre technologies complémentaires
L’interaction entre ces technologies ce schématiser ainsi :
JavaScript gére la logique applicative et la communication avec le serveur via l’objet
XMLHttpRequest.
Les feuilles de styles et le modèle objet document, permettent à l’application de modifier son
apparence en fonction des informations provenant du serveur.
- 41 -
Fig. 17: organisation des composants d'Ajax
Ajax repose sur l’objet XMLHttpRequest qui permet au client web d’échanger des données
au format XML avec un serveur et ce, de façon asynchrone. Le cœur de l’application qui est
téléchargé lors de la connexion du client est écrit en JavaScript. Il réalise les traitements liés
à la logique métier et manipule l’objet XMLHttpRequest en tâche de fond. L’aspect visuel du
site est décrit au travers des langages XHTML et CSS. XHTML sert pour sa part à décrire le
contenu de la page web alors que CSS gère la mise en forme des objets. JavaScript peut
accéder aux différents éléments de la page à travers DOM, permettant ainsi la modification
dynamique de l’aspect visuel de celle-ci.
Remarquons, que les feuilles de styles (CSS), le Modèle objet de document (DOM) et le
JavaScript furent regroupés en 1997 sous la dénomination Dynamic HTML (DHTML). Le
DHTML fut alors utilisé afin de créer des interfaces web interactives, qui, bien que plaisantes
restèrent limitées. Il existe deux principaux motifs ayant limités l’impact de DHTML.
Premièrement à cette époque, le modèle objet de document n’est pas encore standardisé et
son implémentation varie énormément d’un navigateur à l’autre. Ensuite le problème de la
réactualisation complète des pages n’était pas résolu. C’est à ce niveau qu’Ajax prend ses
lettres de noblesses, en permettant au DHTML, de communiquer avec le serveur en utilisant
l’objet XMLHttpRequest introduit en 1998 par Microsoft.
Toutes les technologies constituant Ajax, sont disponibles depuis 1998, elles sont donc
maintenant matures, et supportées nativement par la majorité des navigateurs web
modernes. Il convient cependant d’apporter un petit bémol concernant cette remarque. En
effet, l’implémentation de ces technologies au sein des différents navigateurs est sujette à
quelques variations mineures dont il faut tenir compte lors du développement. Ces variations
d’implémentation, obligent donc le développeur à tester son produit sur tous les navigateurs
cibles.
Mais une fois cet effort réalisé, l’application peut être déployée sur toutes les machines
équipées d’un navigateur Internet, sans qu’il ne soit nécessaire d’installer quelque
composant que ce soit. Il est ainsi possible de s’affranchir de la plate-forme recevant
l’application. Il convient tout de même de noter, que les navigateurs intégrés dans les
périphériques portables (assistants personnels, smartphones, etc.), implémentent rarement
toutes les fonctions nécessaires à l’exécution de ce type d’application. Ajax est de ce fait,
plutôt réservé à des clients s’exécutant sur des ordinateurs.
Nous allons maintenant considérer une des variations d’implémentations citées
précédemment. Celle-ci concerne l’objet clef d’Ajax : XMLHttpRequest. Pour appréhender
les différences d’implémentation entre les différents navigateurs, il est nécessaire de revenir
sur l’histoire de ce composant. Celui-ci est a été développé en 1998 par Microsoft, en tant
que partie intégrante de Outlook Web Access, le service webmail du serveur Microsoft
Exchange. Alors baptisé XMLHTTP, ce composant se présente sous la forme d’un contrôle
ActiveX, qui est ensuite distribué avec Internet Explorer 5.0.
- 42 Par la suite, le projet Mozilla incorpore la première implémentation native de
XMLHttpRequest dans la version 1.0 de Mozilla éditée en 2002. Apple, intégrera à son tour
cet objet dans Safari, en 2004, suivi par Konqueror et Opera en 2005.
Le 5 avril 2006, le W3C a publié les spécifications préliminaires de l’objet XMLHttpRequest,
destinées à standardiser un certain nombre de fonctionnalités existantes, afin d’assurer
l’interopérabilité entre les différents implémentations de cet objet.
L’inexistante de normalisation préalable explique les variations d’implémentations de cette
technologie entre les différents navigateurs. Lors de l’utilisation de cet objet, il est conseillé
de n’utiliser que les fonctions qui sont communes aux différentes implémentations. Sans
quoi, il est nécessaire d’écrire un programme tenant compte de toutes ces variations, avec
tous les problèmes de maintenance et de mise au point que cela implique.
Mais, malgré tout, il est parfois nécessaire d’écrire une portion de programme propre à un
navigateur. C’est le cas lors de l’invocation de l’objet XMLHttpRequest. Celui-ci étant un
objet ActiveX sous Internet Explorer, alors que les autres navigateurs l’implémentent de
façon native, l’appel de cet objet se fait de façon différente.
Une application de démonstration très simple se trouve en annexe 1. On y trouve l’illustration
des propos précédant, avec une fonction qui détermine la méthode à utiliser afin de
manipuler l’objet XMLHttpRequest. Cette application est composée d’une page contenant un
unique hyperlien. Lorsque l’on clique sur ce lien, le contenu d’un fichier texte est chargé de
façon asynchrone et inséré dans la page préexistante.
Cette démonstration purement pédagogique, montre comment sont concrètement misent en
œuvre les technologies composant Ajax. Il est aisé d’identifier les différents éléments
composants cette application :
> la page web hébergeant l’application (index.html), qui contient le code HTML
décrivant le contenu de la page.
>
La feuille de style (Styles.css), qui met en forme les éléments HTML.
>
Le moteur JavaScript, qui gère la communication, et la mise à jour des informations
au sein de la page.
>
Des données brutes. Dans cet exemple, il s’agit de simple texte, mais cela pourrait
être un fichier XML provenant d’une base de données.
Ce petit exemple, montre combien, le découplage entre les informations de présentation, les
données, et la logique applicative est fort. Il faut cependant rester attentif, lors de l’écriture du
programme. En effet, celui-ci va gérer la logique métier et la logique de présentation, il faut
donc absolument veiller à ce que ces parties restent bien indépendantes l’une de l’autre. La
difficulté de garder ces logiques autonomes est accrue par la taille du code nécessaire à
l’écriture d’une application "sérieuse". Et nous touchons ici, l’un des points faibles d’Ajax.
Le langage JavaScript a été conçu initialement avec une portée limitée. Son objectif était
alors de manipuler des objets fournis par une application hôte. L’apparition du Modèle de
document (DOM) a donné la possibilité à JavaScript d’interagir profondément avec le
navigateur, et de prendre la place qu’il occupe au sein d’Ajax. Mais, il ne faut pas oublier,
que JavaScript, reste un langage d’assez bas niveau, n’offrant ni la rigueur ni le pouvoir
structurant d’un langage tel que Java.
L’écriture d’une application implémentant une logique métier complexe et des mécanismes
d’interface utilisateurs évolués, peu vite s’avérer très consommatrice de temps.
- 43 Pour palier à ce problème, et augmenter la productivité des développeurs, certaines sociétés
éditent des frameworks. Ces frameworks, sont en fait des bibliothèques de fonctions écrites
en JavaScript, qui prennent en charge la gestion des composants graphiques, des
événements et de la communication avec le serveur. Lorsqu’une telle bibliothèque est
correctement écrite, les variations d’implémentation entre navigateurs sont prisent en
compte, ce qui la rend totalement indépendante de la plate-forme qui la recevra. Il est ainsi
possible au développeur qui a recours à ces librairies, de se concentrer sur le code de son
application, sans se soucier du fonctionnement des mécanismes de l’interface utilisateur.
L’application métier, peut ainsi reposer sur des bases robustes, qui ont été éprouvées par le
concepteur du framework.
Parmi les sociétés proposant un framework, on trouve entre autres : Yahoo, Google, Rico et
le non moindre Microsoft.
Le framework proposé par Microsoft est plus qu’un simple jeu de bibliothèques. En plus de
facilité le développement de l’application côté client, il permet aux applications serveurs
écrites en ASP.NET de tirer partie du mode de communication asynchrone. A propos de
serveur, nous avons jusqu’ici abordé Ajax sous l’angle du client, qui en s’enrichissant a volé
la vedette au serveur. Nous allons réparer cette inégalité en traitant les changements
qu’apporte Ajax au niveau du serveur.
L’implémentation d’Ajax peut se faire sur n’importe quel type d’architecture serveur, capable
de servir des données dynamiquement. La plupart des serveurs actuels génèrent
dynamiquement une partie des pages qu’ils fournissent, en utilisant des langages tels que
Java, PHP ou ASP. L’intégration d’Ajax sur ces serveurs peut a priori être réalisée sans trop
d’efforts. En effet, Ajax ne modifie pas le schéma d’échange entre le navigateur et le serveur,
qui reste similaire à ce qui existe avec une application web traditionnelle. Ajax ne fait que
rendre cette communication asynchrone, en permettant à l’application cliente de continuer à
interagir avec l’utilisateur en attendant la réponse du serveur.
Concernant les échanges avec le serveur, la principale différence entre une application web
traditionnelle et une application AJAX, se situe au niveau du format. Effectivement, AJAX
reçoit des informations brutes au format XML, alors qu’une application classique échange
des pages au format HTML, contenant un mélange de données et d’information de
présentation.
Fig. 18: interactions avec les serveurs
Il convient cependant de noter, que la transition entre le Web traditionnel et Ajax, peut être
plus ou moins complexe suivant la technologie employée sur le serveur. En effet, Ajax usant
et abusant du format XML, il est indispensable que la technologie en place sur le serveur soit
en mesure de manipuler aisément ce format d’échange. Si ce format n’est pas géré
nativement par le serveur, cela implique généralement l’augmentation du volume de code et
du temps de développement de l’application.
- 44 Pour justement contourner ce problème, sont apparus un certain nombre de frameworks
permettant de palier aux manques des technologies serveur existantes. Ces bibliothèques,
existent maintenant pour les principaux langages présents sur les serveurs, et permettent
d’accélérer considérablement le développement d’application serveur. Nous ne détaillerons
pas ces frameworks ici, ce serait trop fastidieux. Mais il faut savoir qu’ils existent et qu’ils
apportent des fonctionnalités très appréciables. Par exemple avec le FrameWork SAjax, il
est possible d’appeler une fonction résidant sur le serveur depuis le code JavaScript
s’exécutant chez le client.
Maintenant, que nous avons aperçu les différents aspects d’Ajax tant du côté serveur que du
côté client, faisons le point sur cette technologie.
Nous avons vu qu’Ajax est une des réponses au manque d’interactivité et de fluidité qui
caractérise les applications web classique. Au travers de différents exemples, nous avons pu
constater que le concept Ajax est viable et qu’il apporte une réelle souplesse d’utilisation
égalant presque les performances des clients lourds. En plus d’être viable, cette technologie
semble pérenne. En effet, tous les "ingrédients" d’Ajax répondent à des spécifications
approuvées par le W3C, ce qui permet de s’assurer que les applications écrites aujourd’hui
fonctionneront de la même façon demain.
Rappelons, que la fluidité d’une application Ajax provient du fait que la page web n’est pas
rechargée intégralement après chaque interrogation du serveur. Avec Ajax, le serveur ne
transmet que des données brutes, qui seront mise en forme et intégrées au sein de la page
par l’application elle-même. Cette dissociation des données et des informations de mise en
forme, facilite la séparation de la logique de présentation et la logique métier à l’intérieur de
l’application cliente. Ce mode de fonctionnement a tendance à diminuer la charge serveur,
dans la mesure, où celui-ci ne transmet plus d’information de présentation. Il convient
cependant de noter qu’une application Ajax est beaucoup plus lourde que son équivalent
web classique. Le trafic engendré lors de son chargement est par conséquent plus
important. Le gain de trafic n’est donc pas évident lorsque l’application est utilisée
sporadiquement, mais il le devient lorsque celle-ci est utilisée intensément.
Une des solutions à ce problème peut être de ne pas écrire toute l’application en utilisant
Ajax, mais au contraire de réaliser une application web traditionnelle, qui comporte quelques
îlots d’interactivité écrits en Ajax. Cette solution peut permettre de réduire considérablement
la quantité de code JavaScript, et donc d’alléger d’autant le trafic serveur.
Comme nous le mentionnions précédemment, Ajax réduit le fossé qui sépare les
applications web des clients lourds traditionnels. Il va même plus loin en offrant aux
applications une plate-forme d’exécution quasi universelle. En effet, Ajax a très peu de
besoins spécifiques pour fonctionner. Il réclame un navigateur web moderne, supportant
l’objet XMLHttpRequest. Il faut en outre que l’utilisateur n’ait pas interdit l’exécution des
scripts dans son navigateur. Pour les utilisateurs d’Internet Explorer, les ActiveX doivent être
autorisés, dans la mesure où chez Microsoft, l’objet XMLHttpRequest est un contrôle
ActiveX. Ceci devrait changer, car la version 7.0 d’Internet Explorer est annoncée comme
supportant nativement cet objet.
L’aisance de déploiement des applications Ajax, a des contres partis liés aux technologies
employées. Premièrement, Ajax étant basé sur un dialogue client - serveur, rien n’est prévu
pour qu’une application puisse fonctionner en mode déconnecté (c'est-à-dire lorsque le client
n’est pas connecté à Internet). Actuellement seul le FrameWork "General Interface" de la
société Tibco permet une gestion partielle du mode déconnecté. Lorsque le client n’est pas
connecté, les informations sont stockées localement et ne sont transmises que lorsque le
client se reconnecte. La seconde limitation d’Ajax concerne son incapacité à accéder
directement aux données sauvegardées sur le poste de travail. Cette limitation tient au fait
- 45 que bien que JavaScript soit un langage puissant, sa portée se limite au navigateur et aux
composants qu’il intègre. Il lui est impossible de sortir de ce cadre et par conséquent
d’accéder aux données utilisateurs.
L’utilisation de JavaScript a d’autres effets plus pernicieux. En effet, ce langage a été
initialement créé afin de réaliser de petites fonctions non critiques ayants une durée de vie
limitées en générale à quelques pages. Son utilisation dans Ajax est tout autre, il devient le
moteur de l’application et le fonctionnement de celle-ci repose entièrement sur lui. La durée
de vie du code écrit par le développeur correspond au temps de fonctionnement de
l’application. Il est donc extrêmement important d’écrire un code de qualité irréprochable.
Cette tâche est rendue difficile par le fait que JavaScript est un langage d’assez bas niveau
qui nécessite l’écriture d’un volume de code important. Si l’on ajoute à cela, le fait que
JavaScript n’a pas le pouvoir structurant que l’on rencontre avec Java, on comprend
aisément que le développement d’application Ajax doit être un processus industrialisé au
même titre que le développement des clients lourds.
Dans le but de palier au moins partiellement à ce problème, de nombreux frameworks ont
été publiés. Ces bibliothèques provenant d’une part de la communauté open source et
d’autre part d’éditeurs propriétaires, permettent au développeur de se concentrer sur son
application métier. Pour cela, elles lui apportent toutes les fonctions nécessaires à la gestion
de l’interface utilisateur et à la communication avec le serveur. Ces fonctions prennent en
charge les variations de comportement ou d’implémentation qui existent entre les différents
navigateurs. L’utilisation de ces bibliothèques, réduit considérablement la taille du code écrit
par le développeur, facilitant ainsi la mise au point et la maintenance.
Le problème qui se pose lorsque l’on désire utiliser un de ces frameworks et de choisir celui
ou ceux qui conviennent le mieux à nos besoins. Il est en effet difficile d’être certain de faire
le bon choix parmi approximativement soixante dix framework. Surtout qu’actuellement
aucun n’est suffisamment abouti pour permettre un développement efficace.
La priorité du moment concernant Ajax est donc son industrialisation. C’est dans ce but
qu’IBM a mis en place le projet Open Ajax, qui consiste à créer un atelier de développement
libre reposant sur le célèbre environnement de développement Eclipse. Ce projet remporte
un vif succès auprès des éditeurs, qui n’hésite pas à s’y associer. Pour le moment seul
Microsoft a refusé l’invitation, préférant s’attacher à développer son propre framework
baptiser ATLAS. L’implication des grands noms de l’informatique dans ce projet, devrait
contribuer à rassurer les entreprises quand à la pérennité de cette technologie, et les inciter
à tirer profit de ses avantages.
Laissons Sébastien BRUNOT, responsable de l’offre client riche chez Octo Technology [13]
conclure à propos d’Open Ajax :
« Un grand pas vers l'industrialisation des projets Web 2.0 » « Un atelier intégré commun à
tous les éditeurs était très attendu par la communauté. C'est un grand pas en avant vers la
simplification et l'industrialisation des projets. Grâce à ce genre d'initiative, les développeurs
pourront, à terme, utiliser Ajax de façon presque transparente. Mais ce n'est qu'un début.
Pour bien répondre à leurs besoins, les IDE devront s'interfacer nativement avec les
principaux navigateurs du marché - je pense à Internet Explorer. Ils devront permettre le
développement piloté par les tests, notamment en intégrant nativement l'outil JSUnit. »
Comme l’annonce Sébastien BRUNOT, la naissance d’Open Ajax est un premier pas vers
l’industrialisation des projets intégrant Ajax. Ces projets pourront ainsi bénéficier d’un
développement efficace et rationalisé. De plus, l’intérêt que porte les grands noms de
l’informatique à Ajax tend à confirmer que cette technologie pourrait être l’un des piliers du
Web de demain.
- 46 -
L’envergure d’Ajax n’a pas échappé à la société Adobe, qui propose depuis peu FABridge
(Flex-Ajax Bridge) une bibliothèque de fonctions JavaScript libre de droits. Au travers de
cette bibliothèque, il est possible de gérer une application Flex depuis le moteur JavaScript
d’un client riche Ajax.
- 47 -
4. Rich Internet Application selon Adobe
4.1.
FABRIDGE
FABRIDGE, pour Flex Ajax Bridge, est donc le pont que met Adobe entre sa technologie
Flex/Flash que l'on verra par la suite, et la technologie open-source Ajax. FABRIDGE est
une bibliothèque de fonctions qui permet de piloter un composant Flash/Flex à partir d'un
simple code Javascript [14].
Ajax permet une multitude d'actions dans une page internet sans avoir à la recharger
causant une gêne dans la navigation. Ajax permet de dialoguer avec un serveur de façon
discontinue et donc de donner aux navigateurs un peu plus d'intelligence, tout comme font
les applications Flash/Flex. FABridge permet d'insérer facilement de la technologie Flex
dans des applications web tournant déjà avec des composants Ajax.
Ajax a ses limites que la jonction avec Flex au travers de FABridge permet de contourner.
Nous pouvons prendre l'exemple de la mise à jour d'un graphique en fonction des données
saisies par l'internaute. Avec seulement des composants Ajax, des allers-retours avec le
serveur est indispensable pour recevoir la nouvelle image calculée. Mais Flash réalise en
local sur le navigateur les modifications de graphiques. Donc à partir des premiers
développements réalisés avec Ajax, il suffit d'utiliser la bibliothèque FABridge, et il ne sera
pas nécessaire de demander au serveur de servir une nouvelle image, comme le montre
l’illustration ci-dessous [14].
Fig. 19 : utilisation de FABridge [14]
4.2.
Macromedia Flash
Macromind était une société éditrice de logiciels multimédia pour Apple Macintosh en 1984.
Suite à quelques rachats, cette société changea de nom pour Macromedia en 1992. Son
- 48 produit phare était Director qui permet de créer des CD-Roms, des DVDs, des bornes
interactives.
Avec l'avènement d'internet, Macromedia racheta en 1996 la société Future Wave Software
qui avait dans son carton le logiciel Future Splash Animator qui devient par la suite
Macromedia Flash.
Depuis, Macromedia est devenu le leader des éditeurs de logiciels de création web et
multimédia avec des produits comme : Dreamweaver (éditeur de site internet), Flash,
Director, Authorware (création multimédia), Fireworks(traitement d'images), Freehand
(dessin vectoriel).
Macromedia est alors le principal concurrent d'Adobe Systems. Depuis 1982, c'est le
principal éditeur de logiciels de création graphique, au début dans le monde de l'impression
puis au fur à mesure dans le web. Ces principaux logiciels sont Acrobat (lecture et
modification de fichiers PDF ), Photoshop (traitement d'images), Illustrator (dessin vectoriel).
Le 3 décembre 2005, Adobe rachète Macromedia et donne naissance à « un éditeur qui
dispose désormais des moyens de se faire une place dans le monde du poste client,
aujourd'hui dominé par Microsoft, avec des interfaces utilisateurs innovantes et un
environnement de développement plus adapté au monde de l'entreprise » selon Robert
MARKHAM, analyste du Forrester Research [15].
Il faut bien distinguer Flash Player et Flash Professional. En effet, le premier est un plug-in
qui permet de lire les animations réalisées par le second.
4.2.1. Flash Player
Flash Player est donc un module externe qui se greffe sur les principaux navigateurs
internet. Une étude commanditée par Adobe montre que le taux de pénétration du plug-in est
de 98% [16]. Wysistat annonce les mêmes chiffres [17]. Les détracteurs se basent sur les
chiffres d'autres sources comme Webhits qui annonce 70% [18]. Mais il faut savoir que le
Flash Player est implanté dans toutes les versions de Windows XP, en effet la visite guidée
du système d'exploitation est une animation Flash !
Fig. 20: Macromedia Flash Player Statistics,
NPD Online survey, conducted April 2006 [16]
- 49 -
Le problème qui se pose n'est pas celui de la présence du plug-in Flash dans les
navigateurs, mais celui de la version qui s'y exécute.
Fig. 21: Worldwide Ubiquity of Macromedia Flash Player by Version
(NPD Online - Worldwide Survey) [19]
Depuis la version 5, le lecteur a subi quelques innovations majeures, notamment
l'introduction de la vidéo et l'évolution du langage propriétaire orienté objet Actionscript. Cela
peut compliquer le choix de cette technologie, mais Adobe met en téléchargement
gratuitement son lecteur et propose des outils de distribution pour les entreprises.
Actuellement, Flash est utilisé pour du contenu interactif sur le web. Grâce aux nouvelles
possibilités offertes par Flash, les sites internet intègrent de plus en plus de la vidéo dans
leur communication web. Des entreprises telles que Microsoft, BMW, AOL et beaucoup
d'autres encore, utilisent ce média pour enrichir leur contenu et marquer leurs clients.
Fig. 22, exemple de contenu Flash, xDrive [20]
- 50 -
Fig. 23, exemple de contenu Flash, AOL Music Sessions [21]
Flash permet également de gérer des applications internet évoluées qui combinent les
fonctions des logiciels pour ordinateurs de bureau et celles des applications web. Flash est
particulièrement adapté car de nombreuses opérations de traitement sont transférées du
côté client, ce qui permet de réduire l'actualisation des pages internet. Flash permet aussi de
réduire le besoin en bande-passante sur le réseau informatique. Tout cela participe à un
résultat plus positif au niveau de l'utilisateur.
Des sociétés telles que SAP, Goovy Mail, NEC, O'Reilly ont choisi Flash pour ces raisons
[22].
- 51 -
Fig. 24: impression écran application Flash, CRMFlash [23]
Flash ne se limite pas seulement aux contenus et aux applications, il sait aussi
communiquer ! Grâce à des serveurs dédiés, Flash accepte la diffusion en flux continu de
l'audio et de la vidéo. De part cette fonctionnalité, Flash devient un composant majeur des
conférences web et des formations en ligne. Adobe commercialise tout un ensemble prêt à
l'emploi nommé Breeze, dont l'École des Mines de Douai est une référence [24].
Fig. 25: visuel de Adobe BREEZE [25]
- 52 -
Adobe s'est bien rendu compte que la croissance la plus rapide est celle des téléphones
portables. Adobe en a donc profité pour développer Flash Lite, le lecteur Flash à destination
des mobiles.
Flash Player regroupe un ensemble important de fonctions et sa fonction principale est de
lire le format SWF. Pour publier dans ce format, il faut posséder dans un premier temps
Flash Professionnal.
« Flash Professional est l'environnement auteur leader pour vos sites web, expériences
interactives et contenus mobiles ». [26]
C'est un outil de développement informatique appuyé par un véritable langage de
programmation ActionScript défini par la même norme ECMAScript que JavaScript. C'est un
langage procédural orienté objet (comme JAVA ou C++). Il permet d'écrire entièrement le
contenu d'une application web sans avoir dessiné aucun objet.
Flash Professionnal est basé sur des graphiques vectoriels. Jusqu'à peu, il était reconnu
seulement pour cette fonctionnalité, notamment par les graphistes. C'est pour cette raison
que flash connaît un déficit d'image chez les développeurs.
Dans Flash, les dessins sont vectorisés, c'est-à-dire réduits sous forme d'équations
mathématiques, donc du texte. Alors que le Bitmap se contente d'allumer des millions de
pixels. Grâce à cette vectorisation, les animations Flash s'adaptent à n'importent quelles
résolutions d'écrans, elles gagnent en fluidité notamment lors des transitions et elles sont de
tailles très réduites, d'où un coût de bande-passante amoindrit.
On peut importer facilement des vidéos dans Flash pour les inclure dans du contenu. Les
formats que l'on peut insérer sont les plus usuels tels que Quicktime, Windows Média, ou
MPEG. Flash les encode dans son propre format FLV avec des codecs assez performants
que sont Sorenson Spark et VP6 de ON2.
Pour lire de la vidéo sur internet, il faut envoyer un flux de données au fur et à mesure de la
diffusion de la vidéo. C'est ce que l'on appelle le "streaming". Trois grands formats s'étaient
imposés : Quicktime, Windows Media et Real. Mais depuis l'apparition de la vidéo au sein de
Flash, le logiciel d'Adobe devient un très sérieux concurrent. Flash offre comme avantages
de n'avoir aucun plug-in à installer (il est déjà présent), de très bien gérer les flux vidéos et
une qualité vidéo impressionnante par rapport à sa taille. Il est maintenant adopté par les
publicitaires et des sites web pour la diffusion de vidéos et de musiques personnels, comme
YOUtube.com ou MySpace.com.
Comme la vidéo, Flash est capable d'importer les formats audio reconnus dont le MP3, bien
sûr, et de le diffuser en flux continu. Le son peut être synchronisé à l'intérieur d'une
animation Flash.
Flash permet les communications audio/vidéo bidirectionnelles, c'est-à-dire que Flash peut
utiliser une webcam et un microphone connectés sur l'ordinateur client. Système utilisé par
l'application Breeze pour créer des réunions virtuelles.
Flash communique de façon asynchrone avec les serveurs via du XML en utilisant les
requêtes standards des connexions HTTP et HTTPS. L'avantage de cette communication
est d'afficher les informations rapidement sans attendre les réponses du serveur à chaque
interaction.
- 53 -
Fig. 26: intéractions Flash avec serveur
Grâce au logiciel auteur Flash Professionnal, les concepteurs et les designers peuvent
insérer des images, du texte, des sons, de la vidéo à des animations interactives. Mais ce
logiciel est avant tout un outil créatif et, il est difficile d'y développer des applications
complexes.
C'est pourquoi Adobe s'est attaché à créer une structure pour développer sur Flash, ayant
un environnement pour les développeurs informatiques et conservant les fonctions créatives
et expressives de Flash. C'est la gamme de produit Flex.
4.2.2. Adobe Flex
Dans sa première version, Flex désignait seulement le nom d'un serveur qui générait les
applications enrichies. Flex 2 désigne désormais une gamme de produit :
> Le langage ActionScript.
>
La structure applicative Flex Framework.
>
L'outil de développement Flex Builder.
>
Le serveur Flex Enterprise Services.
>
Les composants graphiques Flex Charting Components.
Ces produits vont permettre de créer des applications complexes et riches en s'appuyant
entièrement sur le Flash Player. Ils sont totalement autonomes comme le souligne Mike
CHAMBERS, chef de produit chez Adobe : « Vous n'avez pas besoin du serveur Flex pour
créer des applications avec la structure applicative Flex Framework … Vous pouvez
désormais utiliser Flex Builder 2 pour créer vos applications avec ActionScript 3.0 et la
structure applicative Flex Framework. Flex Builder peut compiler ces applications (sous la
- 54 -
forme d'un fichier SWF) et vous permet de publier ces fichiers SWF comme n'importe quel
autre fichier SWF » [27].
Flex Framework donne le squelette de l'application. Pour créer une interface utilisateur, les
développeurs n'ont qu'à piocher dans des bibliothèques pré-établies des composants
comme des boutons, des tableaux dont les colonnes sont déplaçables. Ils peuvent
également utiliser leurs propres composants. Les développeurs peuvent s'appuyer sur
ActionScript mais aussi sur le MXML, Macromedia XML, langage basé sur XML pour décrire
les éléments visuels et leur comportement.
Pour faire tout cela, les développeurs utilisent Flex Builder qui est l'environnement de
développement et de production basé sur la plate-forme Eclipse, environnement de
développement reconnu.
Les bibliothèques dans lesquelles les développeurs pourront choisir les composants sont
rangées dans Flex Charting Components.
Voici quelques composants les plus usités et les démonstratifs de la puissance de Flex :
- 55 -
- 56 -
Fig. 27: Bibliothèques de composants Flex [25]
- 57 -
Le résultat d'une application en ligne de simulation de crédit immobilier ressemble à ceci,
http://www.if.com/:
Fig. 28: simulation de crédit d'Intelligence Finance [28]
« Le résultat est épatant » d'après Fred CAVAZZA, spécialiste des applications riches chez
SQLI, « il se trouve que cet exemple est remarquable » ! [29]
Adobe n'est pas la seule société à proposer ce type de prestation, Laszlo commercialise des
développements issus de la plate-forme open-source OpenLaszlo [30].
Lors d'un communiqué de presse pour le lancement de Macromedia Flash MX, le PDG de
Macromedia, à l'époque, Rob Burgess a prononcé pour la première fois les termes qui
allaient devenir un concept très fort : Rich Internet Applications (RIA).
4.3.
Rich Internet Applications, la révolution applicative.
Au début de l'informatique en entreprise, les utilisateurs utilisaient des terminaux : un écran
monochrome et un clavier, qui étaient reliés à des ordinateurs centraux. L'interface hommemachine était très pauvre dû à l'absence d'aspect graphique. Cette lacune fut comblée lors
de l'utilisation de l'informatique dite "client-serveur". Les ordinateurs client plus intelligents
étaient connectés en permanence aux serveurs de l'entreprise.
Internet permit d'élargir le monde de l'entreprise au monde entier. Mais côté interactivité, le
Web a entraîné un bond en arrière.
- 58 -
Fig. 29: évolution des applications [25]
Les Rich Internet Applications sont des applications web à part entière qui ressemble
beaucoup à des logiciels autonomes sur un ordinateur. En fait l'intelligence des RIA est
envoyée sur le poste client une seule fois et les données à manipuler sont servies au fur et à
mesure de l'utilisation de l'application. Les RIA sont exécutées soit sur un navigateur internet
ou soit à partir d'un logiciel dédié. Ce dernier est appelé "client riche".
D'après XULfr.org, le site francophone de référence pour XUL : « On oppose le client riche
au client pauvre. Le client pauvre est le couple navigateur web + interface utilisateur en
HTML dans les applications web. On l'appelle pauvre du fait des limitations du langage
HTML. On ne peut avoir de vrais composants d'interface natifs à l'environnement utilisateur,
on ne peut pas faire du drag'n'drop entre plusieurs applications (qu'elles soient desktop ou
web) etc. Il y a donc des limitations ergonomiques et techniques dans le client pauvre, qu'on
arrive plus ou moins à corriger avec des scripts javascripts, mais en contrepartie, qui
nécessitent pas mal (beaucoup trop) de développement. » [31]
Les avantages des navigateurs sont évidents puisqu'il n'y a pas de logiciel supplémentaire à
installer, la mise à jour et la distribution sont faîtes automatiquement, et on peut se connecter
de n'importe quel endroit dans le monde entier.
Malgré son installation proprement dite, le client riche accorde les mêmes avantages avec,
en plus, une meilleure intégration au système d'exploitation. Dans ce cadre, la sécurité de
fonctionnement s'en trouve accrue.
Le client riche offre de plus l'opportunité d'utiliser l'application en mode déconnecté, c'est-àdire sans être relié au réseau de l'entreprise.
- 59 -
CONCLUSION
L'arrivée d'un nouveau concurrent sur le marché des navigateurs web redynamise ce
secteur. Comme le fait remarquer Sami JABER, architecte chez Valtech : « Attaquons-nous
au vrai problème : les navigateurs actuels sont limités par le protocole HTTP. Ajax est une
solution transitoire, en attendant l'émergence d'un navigateur de seconde génération pour
une véritable prise en charge des besoins des entreprises » [32].
C'est avec l’objectif de répondre à cette attente qu'Adobe a finalisé sa technologie Flex et
annoncé Apollo, son client riche.
La forte croissance d'Internet depuis 10 ans, engendrée par un engouement mondial, a
permit de faire émerger de nombreuses technologies qu'elles soient propriétaires ou libres.
Dans le but d'élargir les opportunités que nous offrait le Web, la finalité du protocole HTTP
qui était la présentation de texte, a lentement dérivé vers beaucoup plus d'interactivité.
En effet on constate actuellement l'explosion des clients webmail, des bureaux virtuels, et
des services bancaires. Il y a donc une demande croissante, provenant du monde entier,
d’accès à des prestations enrichies, complexes et personnalisées. Comme le souligne Tim
O'REILLY : « the web was more important than ever, with exciting new applications and sites
popping up with surprising regularity. What's more, the companies that had survived the
collapse seemed to have some things in common » [33]
Nous nous orientons donc vers un web non plus de contenu mais de services. Cette
transition aboutira probablement à ce que l'on nomme le Web 2.0.
- 61 -
BIBLIOGRAPHIE
[1]
WIKIPEDIA. (page consultée le 15 juillet
http://fr.wikipedia.org/wiki/Lynx_%28navigateur%29.
2006).
Lynx
(navigateur).
[2]
CHONE J. . (page consultée le 15 juillet 2006). Web 0.x to Web 2.0 Simplified.
http://www.bitsandbuzz.com/2005/11/29/web-0x-to-web-20-simplified/.
[3]
NETSCAPE. (page consultée le 19 juillet 2006). NETSCAPE AND SUN
ANNOUNCE JAVASCRIPT, THE OPEN, CROSS-PLATFORM OBJECT
SCRIPTING LANGUAGE FOR ENTERPRISE NETWORKS AND THE INTERNET.
http://wp.netscape.com/newsref/pr/newsrelease67.html.
[4]
WIKIPEDIA. (page consultée le 2 juillet 2006). Guerre des navigateurs.
http://fr.wikipedia.org/wiki/Guerre_des_navigateurs.
[5]
MICROSOFT. (page consultée le 2 juillet 2006). ActiveX Core Technologies Moving
to Leading UNIX Platforms.
http://www.microsoft.com/presspass/press/1997/Mar97/Unixpr.mspx.
[6]
MICROSOFT. (page consultée le 2 juillet 2006). IEBlog, The Microsoft Internet
Explorer Weblog. http://blogs.msdn.com/ie/.
[7]
ASSOCIATION MOZILLA EUROPE (page consultée le 11 juillet 2005). À propos de
Mozilla-Europe. http://www.mozilla-europe.org/fr/about/.
[8]
XITIMONITOR. (page consultée le 11 juillet 2005). Étude Marketing sur
l'équipement utilisé pour surfer sur internet du 17 Juillet 2005.
http://www.xitimonitor.com/etudes/equipement10.asp.
[9]
XULFR.ORG. (page consultée le 11 juillet 2005). Exemple "Bonjour tout le monde"
http://xulfr.org/wiki/Presentation/Exemple.
[10] BORDAGE F. - Le Monde.fr mise sur le client riche XUL - Décision Informatique, 07
Novembre 2005, http://www.01net.com/article/295033.html (page consultée le 17
Juillet 2006).
[11] AUCLERT F. - Ajax, la technologie qui dépoussière le web - Micro Hebdo, 14
Novembre 2005, http://www.01net.com/article/294751.html (pages consultée le 17
Juillet 2006).
[12] GARRETT J. J. . (page consultée le 7 juillet 2006). Ajax: A New Approach to Web
Applications. http://www.adaptivepath.com/publications/essays/archives/000385.php
[13] BORDAGE F. - Les éditeurs se regroupent pour créer un standard Ajax – 01
Informatique, 14 Février 2006, http://www.01net.com/editorial/304531/interfaceweb/les-editeurs-se-regroupent-pour-creer-un-standard-ajax (page consultée le 15
juillet 2006).
- 62 [14] BORDAGE F. - Adobe jette un pont entre Flash et Ajax - 01 Informatique - 21 Mars
2006. http://www.01net.com/article/309302.html (page visitée le 17 Juillet 2006).
[15] VARANDAT M. - Flash, le nouveau client riche d'Adobe ? - 01 Informatique, 22 Avril
2005, http://www.01net.com/article/277318.html (page consultée le 18 Juillet 2006).
[16] ADOBE. (page consultée le 18 Juillet 2006). Macromedia Flash Player Statistics.
http://www.adobe.com/products/player_census/flashplayer/.
[17] WYSISTAT. (page consultée le 18 Juillet 2006). Etude du taux d'utilisation des
players Flash sur 2005.
http://www.wysistat.com/v6/pages/fr/etude_player_flash_2005_111.html.
[18] WEBHITS. (page consultée le 18 Juillet 2006). Hit counter und Live-Statistiken.
http://www.webhits.de/deutsch/index.shtml?/deutsch/webstats.html.
[19] ADOBE. (page consultée le 18 Juillet 2006). Macromedia Flash Player Version
Penetration.
http://www.adobe.com/products/player_census/flashplayer/version_penetration.html
.
[20] BMW. (page consultée le 18 Juillet 2006). Page d'accueil xDrive.
http://www.bmw.fr/xdrive/2/index.htm.
[21] AOL (page consultée le 19 Juillet 2006). AOL Music Sessions Korn.
http://music.aol.com/videos/sessions/sessions_flash.adp?defaultCovers=565,552,57
1,556&defaultID=565&page=1&video=PERFORMANCES1.
[22] ADOBE. (page consultée le 18 Juillet 2006). Macromedia Unveils Flash Platform.
http://www.adobe.com/macromedia/proom/pr/2005/unveiling_flashplatform.html.
[23] CRMFlash. (page consultée le 18 Juillet 2006). Data and business logic in SAP.
http://www.mycrmflash.com/example.html.
[24] ADOBE. (page consultée le 18 Juillet 2006). Témoignage sur Adobe.
http://www.adobe.com/cfusion/showcase/index.cfm?event=casestudydetail&casestu
dyid=60038&loc=fr_fr.
[25] La Plate-Forme Flash - livre blanc - Kevin Lynch - Macromedia Juin 2005.
[26] ADOBE. (page consultée le 18 Juillet 2006). page d'accueil de Flash Professionnal.
http://www.adobe.com/fr/products/flash/flashpro/.
[27] ADOBE. (page consultée le 19 Juillet 2006). Flash Professionnal et Flex 2.
http://www.adobe.com/fr/devnet/flash/articles/flex2_flash.html.
[28] INTELLIGENT FINANCE. (page consultée le 19 Juillet 2006). Offset Calculator.
http://www.if.com/.
[29] FREDCAVAZZA.NET. (page consultée le 19 Juillet 2006). Flash + CSS = Flex.
http://www.fredcavazza.net/index.php?2005/05/25/711-flash-css-flex.
[30] LASZLO Systems. (page consultée le 20 Juillet 2006). Laszlo Systems, Inc.
http://www.laszlosystems.com/.
- 63 [31] XULFR.ORG. (page consultée le 20 Juillet 2006). Définition du client riche.
http://xulfr.org/wiki/ClientRiche.
[32] BORDAGE F. VILLACAMPA F. - Ajax : la revanche du navigateur - Décision
Informatique, 14 Novembre 2005, http://www.01net.com/article/295983.html (page
consultée le 18 Juillet 2006).
[33] O'REILLY T. . (page consultée le 20 Juillet 2006). What is Web 2.0.
http://web2rules.blogspot.com/2006/01/what-is-web-20-par-tim-oreilly-version.html.
[34] DICO DU NET. (page consultée le 22 juillet 2006). Dictionnaire en ligne collaboratif
Dico du Net. http://www.dicodunet.com/.
[35] FREDCAVAZZA.NET. (page consultée le 22 juillet 2006). Ne confondez plus AJAX
et Ajax. http://www.fredcavazza.net/index.php?2006/04/13/1128-ne-confondez-plusajax-et-ajax.
[36] WIKIPEDIA.
(page
consultée
http://fr.wikipedia.org/wiki/Accueil.
le
22
juillet
2006).
Accueil.
[37] CRANE D., PASCARELLO E., JAMES D. - Ajax en pratique - Paris : CampusPress,
2006 .-612 p.
- 65 -
GLOSSAIRE
ActionScript
Langage de programmation utilisé par Flash,
L'ActionScript est le langage de programmation
disponible dans Flash pour la création d'applications
avancées. Ce langage permet de créer des films
interactifs et des jeux vidéo complets en ligne.
L'ActionScript est en effet capable de gérer non
seulement le déroulement d'une animation, mais
également les actions des visiteurs (tels que les
déplacements de la souris, clics et pressions sur les
touches du clavier). [34]
AJAX - Asynchronous JavaScript AJAX est un acronyme qui désigne l'utilisation de
l'objet XMLHttpRequest, [35]
And XML
Ajax
Ajax correspond à l'ensemble des technologies qui
autorisent une mise à jour dynamique des
informations ainsi que des modèles d'interactions plus
riches, [35]
ASP
Active Server Pages
ASP, qui signifie « Active Server Pages », est une
technologie développée par Microsoft utilisée dans la
programmation Web. C'est une technologie web
dynamique, équivalente et concurrente de PHP. Elle
nécessite pour fonctionner une plate-forme Windows
avec IIS (Internet Information Services) installé. ASP
n'est en réalité qu'une structure composée d'objets
accessibles par deux langages principaux : le
VBScript et le JScript. A l'inverse de certains langages
de programmation pour PC (C, C++), cette
technologie n'utilise pas de langages compilés, mais
des langages interprétés. [36]
Bande passante
Par assimilation, volume de données qu'il est possible
de transférer entre un serveur et un ordinateur client.
L'expression "bande passante" est utilisée de manière
courante pour désigner un débit exprimé en octets (ou
Kilo, Mega, Giga-octets). Les services d'hébergement
de sites web proposent souvent une bande passante
limitée (1Go, 5Go) utilisable librement pendant un
mois. Au-delà de cette limite, soit le site est désactivé,
soit la bande passante consommée en plus est
payante, [34]
- 66 Base de registre
La base de registre est une base de données utilisée
par le système d'exploitation Windows. Elle contient
les données de configuration du système d'exploitation
et des autres logiciels installés désirant s'en servir.
Microsoft utilise aujourd'hui plutôt le terme Registre
Windows pour parler de cette base de données. [36]
Cascading Style Sheets
(CSS)
Feuilles de style en cascade. Norme avancée du
HTML 4.0, qui permet une meilleure gestion de la
mise en forme des documents HTML en définissant
des classes de formats. [34]
Content Management System
Système de gestion de contenu
(CMS)
Content Management System : Système de gestion de
contenu. Egalement nommés progiciels de gestion du
contenu (PGC), ces systèmes permettent de gérer le
contenu des sites web qu'ils administrent sans avoir
écrire de code HTML ni utiliser d'outil de
développement. Le premier CMS notoirement connu a
sans doute été PHP-NUKE qui a par la suite donné
naissances à toute une série de logiciels dits "Nukelike".Il existe actuellement un grand nombre de
progiciel de gestion de contenu plus ou moins
spécialisés
et
leurs
domaines
d'applications
(initialement réservé aux portails collaboratifs) est de
plus en plus étendu. [34]
CODEC
Les codecs sont des algorithmes utilisés pour
compresser la voix. Il existe toute sorte de codec
pouvant être utilisé. Ceux qui compressent la voix et
permettent ainsi une meilleure transmission à travers
le net. Les codecs les plus récents permettent
désormais de faire de la voix sur IP avec un bas débit
(une connexion 56k). [34]
Component Object Model
(COM)
En programmation, le Component Object Model, aussi
connu sous le nom de ActiveX, est un composant
logiciel (comme les DLL) créé par Microsoft. Il est
utilisé pour permettre le dialogue inter-programmes.
Bien qu'il ait été implémenté sur de nombreuses
plateformes, il est toujours majoritairement utilisé sur
Microsoft Windows. Son prédécesseur fut Object
Linking and Embedding (OLE), qui est lui-même sur le
point d'être remplacé par le framework .NET de
Microsoft, [36]
Document Object Model
(DOM)
Le Document Object Model (ou DOM) est une
recommandation du W3C qui décrit une interface
indépendante de tout langage de programmation et de
toute plate-forme, permettant à des programmes
informatiques et à des scripts d'accéder ou de mettre
à jour le contenu, la structure ou le style de
documents. Le document peut ensuite être traité et les
résultats de ces traitements peuvent être réincorporés
dans le document tel qu'il sera présenté. [36]
- 67 Dynamic HTML
(DHTML)
HTML dynamique, de l'anglais Dynamic HTML,
souvent abrégé DHTML, est un nom générique donné
à l'ensemble des techniques utilisées par l'auteur
d'une page Web pour que celle-ci soit capable de se
modifier elle-même en cours de consultation dans le
navigateur Web. Ce nom était particulièrement en
vogue à la fin des années 1990 lorsque ces
techniques sont apparues. Elles sont maintenant
couramment utilisées sans être aussi vantées. [36]
Framework
Outil de structuration orienté objet. Bibliothèque de
classes spécialisées orientées objet. Un framework
fournit aux programmeurs un canevas de travail et des
objets spécialisés (accès aux bases, objets métiers...),
[34]
Glisser-déposer
(Drag and Drop)
Le glisser - déposer (de l'anglais drag-and-drop) est
dans un environnement graphique une méthode
consistant à déplacer un élément graphique présent
sur l'écran d'un ordinateur d'un endroit à un autre en
utilisant un système de pointage. Généralement le
système de pointage est une souris. [36]
HyperText Markup Language
(HTML)
Langage de balisage servant à la publication de pages
web sur Internet. Les bases du HTML ont été
développées pendant la période 1989-1992 dans le
but de pouvoir écrire des documents hypertextes liant
les ressources diverses d'Internet. Le premier
document portant l'extension "html" a être publié à
l'attention du public l'a été en août 1991 par Tim
Berners-Lee, lorsque ce dernier a annoncé la
naissance du World Wide Web. [34]
HTTP Secured
(HTTPS)
HyperText Transfer Protocol Secured ou protocole de
transfert hypertexte sécurisé. Version sécurisée du
protocole HTTP, HTTPS permet par exemple aux
internautes d'effectuer des paiements ou de régler
leurs impôts en ligne en toute sécurité, [34]
Hyperlien
Un hyperlien ou lien hypertexte ou simplement lien,
est une référence dans un système hypertexte
permettant de passer automatiquement d'un document
consulté à un document lié, [36]
Hypertext Transfer Protocol
(HTTP)
Le Hypertext Transfer Protocol, plus connu sous
l'abréviation HTTP, littéralement le « protocole de
transfert hypertexte », est un protocole de
communication client - serveur développé pour le
World Wide Web. Il est utilisé pour échanger toute
sorte de données entre client HTTP et serveur HTTP.
[36]
- 68 Hypertexte
Un système hypertexte est un système contenant des
documents liés entre eux par des hyperliens
permettant de passer automatiquement (en pratique
grâce à l'informatique) du document consulté à un
autre document lié. Un document hypertexte est donc
un document qui contient des hyperliens. [36]
Internet
Internet est un réseau informatique à l'échelle de la
planète, reposant sur le protocole de communication
IP (Internet Protocol), et qui rend accessible au public
des services comme le courrier électronique et le web.
Ses utilisateurs sont désignés par le néologisme
internaute. Internet ayant été popularisé par
l'apparition du web (abréviation de World Wide Web,
littéralement la Toile Mondiale), les deux sont parfois
confondus par le public non averti. En réalité, le web
est une des applications d'Internet, comme le sont le
courrier électronique, la messagerie instantanée ou
les systèmes de partage de fichiers poste à poste, [36]
Internet Information Services
(IIS)
Internet Information Services, plus connu sous
l'abréviation IIS, est un serveur HTTP et/ou FTP créé
par Microsoft pour ses systèmes d'exploitation
Windows.
Conçu pour fonctionner uniquement sur des produits
de Microsoft (Windows NT, Windows 2000 Windows
XP et Windows Server 2003), il dispose de
fonctionnalités comme la répartition de charge, la
réplication ou l'administration centralisée.
IIS est capable d'exécuter des scripts utilisant des
technologies diverses, comme ASP.NET, ASP, PHP
ou CGI. [36]
Java
Java est à la fois un langage de programmation et une
plateforme d'exécution. Le langage Java a la
particularité principale d'être portable sur plusieurs
systèmes d'exploitation tels que Windows, MacOS ou
Linux. C'est la plateforme qui garantit la portabilité des
applications développées en Java. [36]
JavaScript
Langage de script dont le code s'exécute côté client et
qui s'intègre parfaitement aux pages HTML pour créer
de petites animations ou interagir avec l'utilisateur. Ne
pas confondre avec le Java, langage de
programmation sans aucun rapport. [34]
National
Center
Supercomputing Applications
(NCSA)
for Le National Center for Supercomputing Applications
(ou NCSA, littéralement Centre national pour les
applications des superordinateurs) est un centre
américain de recherche et d'exploitation des
superordinateurs. Il est situé sur le campus de
l'université de l'Illinois à Urbana-Champaign. [36]
- 69 Nouvelles
technologies
l'information
et
de
communication
(NTIC)
de Les Technologies de l'information et de la
la communication (TIC) ou Nouvelles technologies de
l'information et de la communication (NTIC) désignent
généralement ce qui est relatif à l'informatique
connectée à Internet. [36]
Phishing
Technique utilisée par les escrocs en ligne, visant à
usurper l'identité d'une personne ou d'une entité
connue. Le principe est le suivant : un internaute reçoit
un email non sollicité (spam) à l'habillage d'une entité
connue (portail, banque, etc.). L'objectif est d'attirer
l'internaute sur un faux site afin de mettre à jour ses
informations personnelles (carte bancaire, numéro de
téléphone...). Ces informations, saisies dans un faux
formulaire, sont alors utilisées à mauvais escient par
des escrocs. [34]
PHP
PHP signifie "PHP: Hypertext Preprocessor" (c'est un
acronyme récursif). PHP est un langage de script
HTML, exécuté coté serveur. Sa syntaxe est
empruntée aux langages C, Java et Perl, et est facile
à apprendre. Le but de ce langage est de permettre
aux développeurs web d'écrire des pages dynamiques
rapidement, mais il est en fait possible de faire
énormément grâce à ce langage. Il facilite le
développement de sites Internet en proposant une
impressionnante quantité d'outils tels que des
bibliothèques d'accès aux bases de données, de
manipulation d'images, de création de fichiers PDF,
[34]
Pop-up
Nouvelle
fenêtre
de
navigateur
s'ouvrant
automatiquement au dessus de la fenêtre de
navigation actuelle de l'internaute. Le Pop-up est
principalement utilisé en publicité pour afficher un
nouveau bandeau sans surcharger une page.
Plusieurs outils existent pour empêcher l'ouverture des
fenêtres pop-up (des barres d'outils comme la Google
Toolbar, des navigateurs comme Mozilla/Firefox ou
des logiciels spécifiques). [34]
Portable Document Format
(PDF)
Le Portable Document Format (qui se traduit de
l'anglais en « format de document portable »),
généralement abrégé PDF, est un format de fichier
informatique créé par Adobe Systems. C'est un format
ouvert dont les spécifications sont publiques et
utilisables librement (certains éléments sont à
disposition sur le site Adobe) et gratuitement (à
l'exception de quelques très importantes sociétés
commerciales auxquelles Adobe demande alors une
participation financière). Il est dérivé du format
PostScript et contient des données au format XML.
[36]
- 70 Really Simple Syndication
(RSS)
Un flux RSS ou fil RSS ("RSS feed" en anglais), sigle
de Really Simple Syndication (syndication vraiment
simple), ou de Rich Site Summary (Sommaire d'un site
enrichi) est un format de syndication de contenu Web.
Ce système permet de diffuser les nouvelles des sites
d'information ou des blogs, ce qui permet de
rapidement consulter ces dernières sans visiter le site.
RSS, [36]
Secure Socket Layer
(SSL)
Protocole assurant une transmission sécurisée de
données sur un site web. Développé à l'origine par la
société Netscape Communications pour son
navigateur, le protocole SSL est destiné au cryptage
des données. Il permet de vérifier l'authentification, la
confidentialité et l'intégrité des données échangées.
[34]
Système d'exploitation
(OS)
Le système d'exploitation (SE, en anglais Operating
System ou OS) est un ensemble de programmes
responsables de la liaison entre les ressources
matérielles d'un ordinateur et les applications de
l'utilisateur (traitement de texte, jeu vidéo…), Il assure
le démarrage de l'ordinateur, et fournit aux
programmes applicatifs des interfaces standardisées
pour les périphériques. [36]
Visual Basic Script
(VBScript)
VBScript (diminutif de Microsoft Visual Basic Scripting
Edition) est un sous-ensemble de Visual Basic utilisé
en tant que langage de script d'usage général. Le
VBScript est souvent comparé au JavaScript, mais
alors que le JavaScript est essentiellement utilisé pour
des scripts Web, un script VBScript à un champ
d'application bien plus large. [36]
Webmail
Un webmail (ou courrielleur web) est une interface
Web rendant possible l'émission, la consultation et la
manipulation de courriers électroniques depuis un
navigateur Web. Les Webmail reposent en général sur
des protocoles d'accès à des serveurs de messagerie.
[36]
- 71 World Wide Web
(Web)
Le World Wide Web, communément appelé le Web,
parfois la Toile, littéralement la « toile (d'araignée)
mondiale », est un système hypertexte public
fonctionnant sur Internet et qui permet de consulter,
avec un navigateur Web, des pages Web mises en
ligne dans des sites Web. L'image de la toile vient des
hyperliens qui lient les pages Web entre elles. Le Web
est une des applications d'Internet, avec le courrier
électronique, la messagerie instantanée, Usenet, etc.
Le Web a été inventé des années après Internet, mais
c'est le Web qui a rendu les médias grand public
attentifs à Internet. Depuis, le Web est fréquemment
confondu avec Internet ; en particulier, le mot Toile est
souvent utilisé de manière très ambiguë. [36]
WYSIWYG
WYSIWYG est un acronyme (de la locution anglaise
What you see is what you get signifiant littéralement «
ce que vous voyez est ce que vous obtenez » ou plus
élégamment « tel affichage, tel résultat ») couramment
utilisé en informatique pour désigner les interfaces
utilisateur graphiques permettant de composer
visuellement le résultat voulu, typiquement pour un
logiciel de mise en page, un traitement de texte ou
d'image. Il désigne, de fait, une interface « intuitive » :
l'utilisateur voit directement à l'écran à quoi
ressemblera le résultat final (imprimé). [36]
eXtensible
Language
(XHTML)
HyperText
Markup Langage de balisage hypertexte extensible. Langage
normalisé par le W3C servant à la publication de
pages web sur Internet. Le XHTML offre les mêmes
possibilités que le HTML tout en étant conforme à la
norme XML. Les documents HTML devraient peu à
peu être remplacés par leur équivalent en XHTML,
dont la structure se doit d'être rigoureuse pour en
faciliter l'accès à d'autres machines que des
ordinateurs, comme les téléphones mobiles par
exemple. [34]
eXtensible Markup Language
(XML)
Acronyme pour "eXtensible Markup Language" langage de balisage extensible. Standard défini par le
W3C, qui permet de créer des langages de
structuration de données spécialisés et personnalisés.
Le XML est ainsi ce qu'on appelle un "méta langage",
mais aussi un format de fichiers. Les langages basés
sur XML permettent de manipuler, traiter et
communiquer toutes sortes de données et de textes.
Comme exemples de tels langages, on peut citer
XHTML ou RSS, [34]
XMLHttpRequest
XMLHttpRequest est un objet Javascript qui permet
d'obtenir des données au format XML, mais aussi
HTML, où encore texte simple à l'aide de requêtes
HTTP. [36]
- 72 eXtensible Stylesheet Language
Langage de feuilles de styles
extensible
(XSL)
Langage de description de feuilles de style associé à
XML. XSL est un langage qui permet de décrire la
manière dont des documents XML doivent être
présentés. Ainsi, là où XML structure le fond d'un
document, son contenu, XSL est utilisé pour structurer
sa forme. [34]
- 73 -
ANNEXE 1
Voici un exemple d’application Ajax très simple, qui suite au clic sur un hyperlien, insère le
contenu d’un fichier texte dans la page originale.
Voici la page principale de l’application. Elle est écrite en langage HTML et incorpore une
feuille de styles et le cœur de l’application développé en JavaScript.
Fichier index.html
<html>
<head>
< !—Inclus une feuille de style -->
<style type="text/css" title="currentStyle" media="screen">
@import "Styles.css";
</style>
< !—Intégre le moteur JavaScript -->
<script language="JavaScript" src=’moteur.js ‘></script>
<title>Hello World in Ajax</title>
< !--Page Web classique, faisant appel à Ajax -->
</head>
<body>
<!—Ce lien initie la communication asynchrone-->
<a href="javascript:sayHello();">Dis Bonjour</a><br />
<!—Cette balise est utilisée afin d’afficher le résultat de la requête -->
<span id="span_result"></span>
</body>
</html>
La feuille de style définie les propriétés d’affichage des objets HTML.
Fichier Styles.css
body {
font: 8pt/16pt georgia;
color: #555753;
margin: 0px;
}
span {
font: 8pt/16pt georgia;
margin-top: 0px;
text-align: justify;
}
a:link {
font-weight: bold;
text-decoration: none;
color: #B7A5DF;
}
a:visited {
font-weight: bold;
text-decoration: none;
color: #D4CDDC;
}
- 74 a:hover, a:active {
text-decoration: underline;
color: #9685BA;
}
Le cœur de l’application écrit en JavaScript, crée une instance de l’objet XmlHttpRequest. Il
est intéressant de noter que suivant le navigateur utilisé, l’instanciation ne se fait pas de la
même manière. La fonction sayHello() demande au serveur qu’il transmette au client le
fichier DisBonjour.html. Lorsque le fichier est parvenu au client, la fonction handleSayHello()
est appelé. C’est elle qui prend en charge l’intégration des données reçues au sein de la
page HTML.
Fichier moteur.js
// Fonction permettant l’instanciation de l’objet XmlHttpRequest indépendamment du
navigateur
function getXmlHttpRequestObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest(); //Safari, FireFox …
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP"); //Internet Explorer
} else {
//Le navigateur ne gère pas l’objet XMLHttpRequest
alert("Votre navigateur ne supporte pas l’objet XmlHttpRequest");
}
}
//Instanciation de l’objet XmlHttpRequest
var receiveReq = getXmlHttpRequestObject();
//Fonction initialisant les échanges asynchrones
function sayHello() {
// Si il n’y pas de communication en cours, il est possible d’utiliser l’objet
if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
//Utilise l’objet afin de lire le fichier DisBonjour.html sur le serveur
receiveReq.open("GET", ' DisBonjour.html ', true);
//Définis la fonction à appeler lorsque l’objet XmlHttpRequest reçoit les
informations
demandées
receiveReq.onreadystatechange = handleSayHello;
//Lance la requête
receiveReq.send(null);
}
}
//Fonction appelée à chaque fois que l’objet XmlHttpRequest change d’état
function handleSayHello() {
//Vérifie si le transfert est terminé
if (receiveReq.readyState == 4) {
//Affiche le résultat dans la page HTML en utilisant la propriété innerHTML du
Modèle de document (DOM)
document.getElementById('span_result').innerHTML = receiveReq.responseText;
}
}
- 75 Le fichier DisBonjour.html contient les données à transmettre. Il contient dans ce cas
particulier dur texte simple, mais il pourrait tout aussi bien contenir des données XML.
Bonjour, Monde !
Cette application, bien que simpliste, intègre tous les ingrédients qui font elle une application
Ajax à part entière.
Si le développement d’application Ajax vous intéresse, procurez vous l’excellent ouvrage
« Ajax en pratique » aux éditions CampuPress [37].
- 77 -
ANNEXE 2
Comment écrire correctement Ajax ? [35]
Ajax = un acronyme qui désigne l'utilisation de l'objet XMLHttpRequest ;
AJAX = l'ensemble des technologies qui autorisent une mise à jour dynamique des
informations ainsi que des modèles d'interactions plus riches.
Donc au final : Google Suggest repose sur Ajax (il n'utilise que l'objet XMLHttpRequest)
alors que le nouveau Yahoo! Mail repose sur Ajax (à cause des drag&drop et autres
panneaux dépliants).
- 79 -
ANNEXE 3
Hypertext Markup Language
Un article de Wikipédia, l'encyclopédie libre. [36]
L'Hypertext Markup Language, généralement abrégé HTML, est le langage informatique
créé et utilisé pour écrire les pages Web. HTML permet en particulier d'insérer des
hyperliens dans du texte, donc de créer de l'hypertexte, d'où le nom du langage.
L'anglais Hypertext Markup Language est rarement traduit littéralement en langage de
balisage d'hypertexte. On utilise généralement l'abréviation, parfois même en répétant le mot
« langage » dans langage HTML. Hypertext est parfois écrit HyperText pour marquer le T de
l'abréviation.
Langage de balisage hypertexte
HTML est un langage de description de documents. C'est une application du langage de
balisage SGML.
Pour expliquer les balises HTML, voici un exemple :
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
La phrase Lorem ipsum dolor (...) est délimitée par une balise d'ouverture <p> et une autre
de fermeture </p>. Les balises servent de délimitation, <p></p> délimitant un paragraphe.
Certaines balises n'ont pas de contenu et apparaissent donc sans balise de fermeture. Sont
notamment concernées la balise d'image <img>, la balise de séparation horizontale <hr> et
la balise de retour à la ligne <br>.
Sémantique HTML
Tel qu'il a été pensé à ses origines par Tim Berners-Lee, le HTML ne sert pas à décrire le
rendu visuel des pages Web (contrairement à la PAO), mais plutôt le sens des différentes
parties du texte : titre, liste, mise en évidence... Ces valeurs ont été de moins en moins
respectées au cours du développement du langage.
L'exemple le plus flagrant est celui de l'utilisation abusive des tableaux en HTML. L'utilisation
des tableaux devrait être limitée, comme son nom l'indique, à des données tabulaires
(statistiques, fréquence, associations à deux dimensions, etc.), mais les créateurs de pages
Web utilisent cet élément pour pallier un manque crucial d'éléments permettant de
positionner n'importe où un élément HTML. Depuis, le CSS a fait son apparition, permettant
de décrire la façon dont les éléments HTML doivent être positionnés. Et oui!
Accéder à une page HTML
C'est le protocole de communication HTTP qui, sur le Web, permet de transférer à partir d'un
serveur HTTP, un document HTML. Lorsque le serveur HTTP reçoit une demande
concernant un document, il est possible qu'il ait à générer une partie du document suivant
les indications qu'aura eu soin de lui laisser l'auteur de la page. (cf langages spécialisés
web.)
Les documents HTML sont identifiés par une URL et sont interprétés par le navigateur Web
du visiteur. Grâce à ce dernier, le document HTML apparaît à l'écran ou à l'impression
- 80 comme l'auteur l'a voulu. Sont ainsi représentés texte, typographie, couleurs, tableaux,
images, parfois du son, etc.
Interopérabilité
Le web dépend des auteurs de pages et des éditeurs de logiciels qui partagent les mêmes
conventions pour HTML. Cela a motivé un travail commun sur les spécifications de HTML.
Permettre aux documents HTML d'être accessibles sur des plates-formes et des navigateurs
différents est fondamental dans la conception de ce langage.
L'ambition de Tim Berners-Lee était d'avoir un langage de description de documents au
format ouvert qui soit indépendant de ce qui servirait à lire les pages. Par conséquent, il n'est
pas prévu que telle ou telle police de caractère soit utilisée explicitement, ni que le moniteur
du client utilise telle ou telle résolution. Le logiciel exploité pour la navigation devrait lui aussi
ne pas être une source de discrimination.
Parvenir à l'interopérabilité permet de baisser les coûts des fournisseurs de contenus parce
qu'ils n'ont à développer qu'une seule version d'un document. Si cet effort n'est pas fait, le
risque est grand de voir le Web régresser vers un monde propriétaire de formats
incompatibles, en réduisant en fin de compte son potentiel commercial au détriment de tous
ses participants.
Chaque version HTML a essayé de refléter le plus grand consensus entre les acteurs de
l'industrie, de sorte que les investissements consentis par les fournisseurs de contenus ne
soient pas gaspillés et que leurs documents ne deviennent en peu de temps illisibles.
Le langage HTML a été développé avec l'intuition que les appareils de toutes sortes devaient
pouvoir utiliser les informations sur le Web : les ordinateurs personnels avec des écrans de
résolution et de profondeur de couleurs variables, les téléphones cellulaires, les appareils
portables, les appareils de synthèse et de reconnaissance de la parole, les ordinateurs avec
une bande passante faible comme élevée, et ainsi de suite.
Interopérabilité des caractères
Les caractères utilisés dans une page web posent parfois problème. Lors de l'utilisation des
premières pages HTML, l'unicode n'était pas encore inventé. Aujourd'hui, il est normal
qu'une page soit codée en UTF-8.
Toutesfois, certains systèmes contiennent toujours des anomalies, qui font que le logiciel ne
sait pas quel est l'encodage utilisé. A la fois HTML et HTTP permet de le préciser, mais
l'information donnée est parfois fausse ou divergeante.
voir Unicode et HTML
Historique
1989 - 1992
HTML a été inventé pour le World Wide Web, afin de pouvoir écrire des documents
hypertextuels liant les différentes ressources d'Internet. En août 1991, lorsque Tim BernersLee annonce publiquement le Web sur Usenet, il ne cite que le langage SGML, mais donne
l'URL d'un document ayant l'extension de fichier html.
Les premiers éléments du langage HTML sont le titre du document, les hyperliens, la
structuration du texte en titres, sous-titres, listes ou texte brut, et un mécanisme rudimentaire
de recherche par index. La description d'HTML est alors assez informelle et principalement
définie par le support des divers navigateurs Web contemporains.
- 81 1993
L'état de HTML correspond alors à ce que l'on pourrait appeler HTML 1.0. Il n'existe
cependant aucune spécification portant ce nom, notamment parce que le langage était alors
en pleine évolution. Un effort de normalisation était cependant en cours. À partir de fin 1993,
le terme HTML+ sera utilisé pour désigner la version future de HTML.
Avec le navigateur NCSA Mosaic, HTML connaît deux inventions majeures : l'invention de
l'élément IMG permet d'intégrer des images (GIF ou XBM) aux pages Web (Mosaic 0.10) ;
les formulaires rendent le World Wide Web interactif (Mosaic 2.0pre5) et l'ouvre aux
commandes par Internet.
1994
Avec l'apparition de Netscape Navigator 0.9 le 13 octobre, le support de nombreux éléments
de présentation est ajouté : styles de texte, clignotement, centrage... Le développement de
HTML prend alors deux voies divergentes. D'une part, les développeurs de navigateurs
s'attachent à maximiser l'impact visuel des pages Web. D'autre part, les concepteurs du
Web proposent d'étendre les capacités de description sémantiques (logos, notes de bas de
page...) et les domaines d'applications (formules mathématiques, tables) de HTML. En ceci,
ils suivent les principes de SGML consistant à laisser la présentation à un langage de style.
En l'occurrence, les feuilles de style en cascade (CSS) sont prévues pour HTML.
Seul le support des tables est rapidement intégré aux navigateurs, notamment parce qu'il
permet une très nette élaboration de la présentation. Le manque de structure du HTML alors
mis en œuvre par Netscape Navigator, puis Microsoft Internet Explorer, est parfois dénoncé
comme étant de la « soupe de balises » (tag soup en anglais).
1995 - 1996
En mars 1995, le W3C nouvellement fondé propose le résultat de ses recherches sur
HTML+ : le brouillon HTML 3.0. Il comprend notamment le support des tables, des figures et
des expressions mathématiques. Ce brouillon expire le 28 septembre 1995 sans donner de
suites directes. Fin 1995, le RFC 1866 décrivant HTML 2.0 est finalisé. Ce document décrit
HTML tel qu'il existait avant juin 1994, donc sans les nombreuses additions de Netscape
Navigator.
1997
Le 14 janvier, le W3C publie la spécification HTML 3.2. Elle décrit la pratique courante
observée début 1996, donc avec une partie des additions de Netscape Navigator et Internet
Explorer. Ses plus importantes nouveautés sont la standardisation des tables et de
nombreux éléments de présentation.
Le 18 décembre, le W3C publie la spécification HTML 4.0 qui standardise notamment le
support des styles, les cadres (frames) et les objets (généralisation des images et des
applets).
1998 - 1999
La dernière spécification de HTML est la 4.01 datant du 24 décembre 1999. Elle n'apporte
que des corrections mineures à la version 4.0.
2000 à nos jours
Le développement de HTML en tant qu'application de SGML est abandonné au profit de
XHTML, application de XML. La première étape est la spécification XHTML 1.0, publiée le 26
janvier 2000. Il s'agit d'une reformulation de HTML 4.01 basée sur XML au lieu de SGML.
La seconde étape est la spécification XHTML 1.1, publiée le 31 mai 2001. Il s'agit d'un
classement des fonctionnalités de XHTML 1.0 en modules.
- 82 -
Quelques balises
Balise :
<b>texte</b>
<i>texte</i>
<u>texte</u>
<s>texte</s>
Effet :
Texte en gras
Texte en italique
Texte souligné
Texte barré
<img src="exemple.jpg" alt="Texte
Insère une image
alternatif">
<a
href="accueil.htm"
title="Description
courte
du
lien">texte</a>
<font>texte</font>
<font
color="#cc0000">texte</font>
<font size="2">texte</font>
<table> </table>
<tr> </tr>
<td>texte</td>
Insère un lien hypertexte
Résultat :
Résultat
Résultat
Résultat
Résultat
QuickTime™ et un
décompresseur TIFF (non compressé)
sont requis pour visionner cette image.
Résultat
Font agit sur le texte (pas seul)
Affiche le texte dans la couleur choisie
Résultat
Met une valeur à la taille du texte
Résultat
Génère un tableau vierge
(pas de résultat)
Génère une ligne vierge dans un
(pas de résultat)
tableau vierge
Génère une case dans une ligne
texte
vierge
Un exemple de document HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<title>Mon premier document HTML</title>
</head>
<body>
<p>Bonjour tout le monde&nbsp;!</p>
</body>
</html>
- 83 -
ANNEXE 4
Extensible Markup Language
Un article de Wikipédia, l'encyclopédie libre. [36]
Extensible Markup Language (« langage de balisage extensible »), généralement abrégé
XML, est un standard du World Wide Web Consortium qui sert de base pour créer des
langages de balisage : c'est un « méta-langage ». En ce sens, XML permet de définir un
vocabulaire et une grammaire associée sur base de règles formalisées. Il est suffisamment
général pour que les langages basés sur XML, appelés aussi dialectes XML, puissent être
utilisés pour décrire toutes sortes de données et de textes. Il s'agit donc partiellement d'un
format de données. L'extensibilité de XML est principalement assurée par la notion d'espace
de nommage. Il est donc important de noter que, en lui-même, le format XML ne peut être
utilisé tel quel. Il doit donc être spécialisé et/ou utilisé avec d'autres technologies pour être
utile.
Objectifs et utilité
L'objectif initial de XML était de faciliter le partage de textes et d'informations structurées, par
exemple au travers d'Internet, en séparant le contenu (les données) du contenant (la
présentation des données). Il constitue une simplification (« profil ») de SGML tout en
continuant à assurer la portabilité des documents, notamment grâce à l'intégration
d'Unicode.
Les dialectes XML (XSLT, XML Schema, XHTML, RDF/XML, SOAP, SMIL, MathML, SVG)
sont décrits de façon formelle : une structure de données simple est définie avec une DTD
(Document Type Definition), une structure de données détaillée est définie avec un XML
Schema ou tout autre DSDL (Document Schema Definition Languages, c'est-à-dire langage
de description de schéma).
Il existe des outils (qui peuvent être gratuits ou libres) permettant la manipulation de ces
définitions : les processeurs XML (en). La disponibilité d'une syntaxe standard et d'outils de
manipulation réduit significativement le coût du cycle de développement, permettant à des
programmes de modifier et de valider, sans connaissances préalables, des documents écrits
dans ces langages. En effet, avant l'avènement du populaire langage généraliste de
description de données qu'est XML, les concepteurs de logiciels avaient pour habitude de
définir leurs propres formats de fichiers ou leurs propres langages pour partager les données
entre programmes (à l'exception de quelques standards professionnels tels qu'EDIFACT).
Ceci nécessitait de concevoir et de programmer des analyseurs syntaxiques dédiés.
Fonctionnement
Un fichier XML est un fichier texte. Le codage des caractères est défini dans la première
déclaration du document. Par défaut il s'agit de UTF-8, une transcription binaire particulière
de Unicode, un format qui intègre l'ASCII et beaucoup des caractères utilisés de par le
monde.
Le fichier XML est structuré en « éléments » à l'aide de « balises » qui marquent le début et
la fin de chaque élément. Les éléments peuvent contenir du texte et éventuellement d'autres
éléments. L'ensemble des données du document XML est contenu dans un élément unique
appelé « racine », élément qui contient tous les autres éléments.
- 84 Outre les éléments et le contenu des éléments, on trouve aussi dans un document XML:
des commentaires (qui ne font pas partie des données au sens strict) ;
des instructions de traitement (directives données au processeur XML) ;
des « appels » de caractère (pour coder des caractères qui n'existent pas dans le codage
choisi pour le document tout entier) ;
des « appels » d'entités (permettent l'appel d'une entité nommée qui est une sorte de «
macro » de texte).
Règles fondamentales
L'efficacité de XML dépend fortement des normes strictes qui régissent sa structure. Pour
être considéré comme un document XML, un document doit être bien formé, c'est-à-dire qu'il
doit être conforme aux règles suivantes :
Dans sa première déclaration, le document doit être identifié comme un document XML.
Cette première déclaration est nommée le prologue. Il doit contenir des informations sur la
version de XML utilisée, le codage des caractères (si nécessaire) et indiquer également si le
fichier XML est associé à une DTD ou à un autre langage de définition de document (XML
Schema, Relax NG, Schematron, etc.) ou s'il est autonome.
Un document XML ne doit avoir qu'un seul élément racine, tous les autres éléments sont
contenus dans cet élément, aussi appelé l'élément document.
Chaque élément XML doit commencer par une balise ouvrante et se terminer par une balise
fermante. Un élément vide peut être représenté par une balise d'élément vide qui ressemble
à ceci : <exemple/>; cette balise est considérée comme étant une balise ouvrante suivie
d'une balise fermante. Ceci est utilisé pour éviter de devoir écrire <exemple></exemple> tout
en conservant le bon formatage.
La valeur d'un attribut doit être entre guillemets (simple « ' » ou double « " »).
Il est à noter que XML est sensible à la casse. Par exemple, « <Exemple></Exemple> » est
une paire de balises bien formée alors que « <Exemple></exemple> » n'en est pas une.
Quand un document XML est bien formé et conforme à la DTD auquel il est associé, ce
document est qualifié de valide.
Un document XML peut être associé à des feuilles de style XSLT, feuilles qui permettent de
générer de nouveaux documents contenant des informations provenant du document XML. Il
est ainsi possible de générer des fichiers XML ayant une structure différente du document
initial (transformation), mais aussi d'autres documents : requêtes SQL, pages HTML, etc. Un
document XML peut aussi être affiché par certains navigateurs Web (par exemple Internet
Explorer ou Mozilla) en utilisant une feuille de style CSS.
Exemple d'un fichier XML :
<?xml version="1.0" encoding="ISO-8859-1" standalone="yes" ?>
<?xml-stylesheet href="pages.xsl" type="text/xsl"?>
<bibliotheque>
<section type="cuisine">
<livre couleur="rouge">
<titre>Les petits délices de Monsieur Dupont</titre>
</livre>
<livre couleur="bleu" nombre_de_chapitre="3">
<titre>Pour un peu de choix</titre>
</livre>
</section>
</bibliotheque>
- 85 -
Utilisations actuelles
Le succès de XML s'explique aussi par la définition d'interfaces de programmation (API)
standard pour les processeurs XML. Les API les plus largement utilisées sont :
SAX utilisé pour les traitements de documents à la volée (cette API est utilisée pour des
traitements au fur et à mesure de la réception d'un document XML),
DOM (utilisable par des langages côté serveur comme Php ou Asp) utilisé pour les accès
directs aux éléments d'un document XML, grâce à la construction d'un arbre logique complet
contenant toute la structure du document XML (cette API est utilisée quand le document est
entièrement disponible). DOM permet également de générer de nouveaux documents XML,
en créant un arbre logique, qu'on transforme ensuite en document XML.
Ces API sont les plus utilisées mais d'autres API existent, comme JAXP, JDOM et dom4J
pour Java. StAX est une autre API avec une philosophie différente de SAX et DOM, basée
sur le motif de conception itérateur.
XML est également utilisé dans le cadre d'architectures de type SOA (Service Oriented
Architecture) pour les Web Services.
Une grande partie de l'interface des navigateurs Firefox et Mozilla est construite avec des
langages utilisant XML.
OpenDocument est un standard XML émergeant dans le domaine de la bureautique. Basé
sur le format des premières versions d'OpenOffice.org, il permet maintenant l'interopérabilité
avec d'autres applications comme KOffice.
- 87 -
ANNEXE 5
Feuilles de style en cascade
Un article de Wikipédia, l'encyclopédie libre. [36]
Le langage CSS (Cascading Style Sheets : feuilles de style en cascade) est utilisé pour
décrire la présentation d'un document structuré écrit en HTML ou en XML, et c'est le World
Wide Web Consortium (W3C) qui en a la direction.
Vue d'ensemble
CSS est utilisé pour définir les couleurs, les polices, le rendu, et d'autres caractéristiques
liées à la présentation d'un document. L'objectif est de bien séparer la structure (écrite en
HTML ou similaire) et la présentation (en CSS) du document. Cette séparation fournit un
certain nombre de bénéfices, permettant d'améliorer l'accessibilité, de changer plus
facilement de structure et de présentation, et de réduire la complexité de l'architecture d'un
document. Enfin, CSS permet de s'adapter aux caractéristiques du récepteur.
HTML ne décrit que l'architecture interne, et CSS décrit tous les aspects de la présentation.
CSS peut définir couleur, police, alignement de texte, taille, position, mais aussi le formatage
non visuel, comme la vitesse à laquelle le document doit être lu par des lecteurs de texte.
Ainsi, les avantages des feuilles de style sont multiples :
• La structure du document et la présentation sont gérés dans des fichiers séparés.
•
La conception d'un document se fait dans un premier temps sans se soucier de la
présentation, ce qui permet d'être plus efficace.
•
Dans le cas d'un site Internet, la présentation est uniformisée : Les documents
(pages « html ») font référence à la (aux) même(s) feuille(s) de styles. Cette
caractéristique permet de plus un "relookage" rapide.
•
Un même document peut donner le choix entre plusieurs feuilles de style (impression
ou lecture à l'écran par exemple). Certains navigateurs web permettent d'accéder
facilement à un choix de feuilles de style.
•
Le code HTML est considérablement réduit en taille et en complexité, puisqu'il ne
contient plus de balises de présentation.
CSS utilise une pléthore de mots-outils anglais destinés à caractériser les éléments HTML.
Voici l'exemple d'une portion de feuille de style :
p { font-size: 110%; font-family: Helvetica, sans-serif; }
h1 { color: white; background: red; }
Ce code CSS définit l'élément p (paragraphe) avec une taille de 110% et une police
Helvetica, ou, si Helvetica est indisponible, une police générique. Quant aux titres (éléments
h1) ils seront en blanc, sur fond rouge.
Le CSS permet aussi de définir plus précisément la manière de représenter un élément
grâce aux id et aux class. Les identificateurs (id) sont utilisés pour caractériser un élément
unique (un menu, un mot...), mais les classes (class) sont utilisées pour caractériser un
ensemble d'éléments (comme des menus organisés de manière similaire).
Par exemple : l'on place dans le fichier de contenu (fichier HTML, ou similaires), comme
ceci :
<p class="beauParagraphe">Je suis né en Alsace. [...]</p>
- 88 et dans le fichier de contenant :
.beauParagraphe { text-indent: 1em; }
Ceci donnera un alinéa à la classe .beauParagraphe, soit ici la phrase « Je suis né en
Alsace. »
La présentation est donc bien séparée du contenu. (C'est suite à la prise en compte des
avantages de CSS que le W3C déconseille maintenant les éléments et les attributs de
présentation en HTML, comme align="" ou <font face="">.)
Les descriptions CSS peuvent être données à l'intérieur d'un document HTML, ou importées
séparément dans le lecteur. Cette possibilité donne une certaine flexibilité à CSS. De plus,
CSS peut être utilisé avec XHTML, XML, ou avec n'importe quel format de document
structuré correctement implanté dans un logiciel ou dans un navigateur.
Les feuilles de style peuvent contenir des commentaires. La syntaxe est la suivante : /*
commentaire */
Histoire de CSS
Les feuilles de style étaient déjà là sous une forme ou une autre depuis le début de HTML
dans les années 1990. Plusieurs navigateurs avaient leur langage de style propre qui pouvait
être utilisé pour personnaliser les documents web. À l'origine, les feuilles de style étaient
destinées aux utilisateurs finaux. Les premières versions de HTML ne possédaient pas
beaucoup d'outils pour la mise en forme, et c'était donc souvent à l'utilisateur de décider
comment le document allait s'afficher.
HTML se développait, et il permettait de répondre à l'attente des développeurs web. Avec
ces fonctions naissantes, les feuilles de style devinrent moins importantes, et un langage
externe permettant de définir le style n'a pas été entièrement accepté jusqu'au
développement de CSS.
Le concept des feuilles de style a été à l'origine proposé en 1994 par Håkon Wium Lie ; Bert
Bos travaillait au même moment sur un navigateur appelé Argo, utilisant les feuilles de style ;
ils décidèrent alors de développer ensemble CSS.
Quelques langages de feuille de style avaient déjà été proposés, mais CSS était le premier à
inclure l'idée de « cascade » (feuille de style en cascade) – la possibilité pour le style d'un
document d'être hérité à partir de plus d'une « feuille de style ». Cela permettait
d'outrepasser le style d'un site spécifique, en héritant, ou en « cascadant » le style du site
dans d'autres régions. Cette fonction permet donc un gain de contrôle, à la fois pour l'auteur
du site, et pour l'utilisateur. Elle permet aussi un mélange de préférences relatives de style.
La proposition de Håkon a été présentée à la conférence « Mosaic and the Web » de
Chicago en 1994, et par Bert Bos en 1995. À cette même époque, le World Wide Web
Consortium (W3C) se créait, et le consortium se prit d'intérêt pour CSS, et organisa un
travail autour du langage. Håkon et Bert étaient les responsables du projet. D'autres
membres, comme Thomas Reardon (de Microsoft) y ont participé. Fin 1996, CSS était
presque prêt à être officialisé. La norme CSS1 fut publiée en décembre 1996.
En 1997, CSS a été attribué à un groupe de travail au sein du W3C, présidé par Chris Lilley.
Ce groupe commença par s'occuper des problèmes non réglés par CSS1, ce qui entraîna la
parution de CSS2 comme une recommandation officielle en mai 1998. CSS3 est
actuellement en développement.
Difficulté d'intégration
Bien que CSS1 soit paru en 1996, trois ans ont été nécessaires pour qu'un navigateur
achève l'implémentation complète de cette spécification. Internet Explorer 5.0 pour
Macintosh lancé en mars 2000 fut le premier à supporter complètement (à plus de 99 %)
- 89 CSS1. Les autres navigateurs suivirent peu après, et beaucoup implémentèrent des parties
de CSS2, même si en 2003, aucun navigateur n'avait achevé l'implémentation de CSS2.
Même les navigateurs qui ont achevé leur implémentation l'ont souvent fait avec difficulté ;
beaucoup d'implémentations de CSS sont incomplètes ou boguées. Les auteurs ont la
plupart du temps recours à des astuces (proche du bidouillage) pour réussir à obtenir un
même résultat au travers de différents navigateurs et plates-formes. Un des bogues les plus
connus est celui de Microsoft Internet Explorer concernant sa gestion du système de boîtes
(marges, espaces, bords). En effet, à un élément de boîte possédant une taille fixée, la
recommandation du W3C voudrait que les marges, les espaces et les bords s'ajoutent à la
taille définie. Pour Microsoft Internet Explorer, les propriétés visibles (espaces et bords) sont
incluses dans le calcul de boîte (mode Quirk). Sont concernées par ce bug les versions 5 et
5.5 et la version 6 quand le prologue <?xml version="1.0"?> est déclaré dans l'en-tête d'un
document XHTML. La version 6 du navigateur de Microsoft interprète les documents en
mode Quirk par défaut (s'il n'y a pas de DocType ou un Doctype <!DOCTYPE HTML
PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">), il n'utilise le mode conforme aux
standards que si la première ligne du document est un DocType <!DOCTYPE HTML
PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> ou
<!DOCTYPE
HTML
PUBLIC
"-//W3C//DTD
HTML
4.01
Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> ou un Doctype XHTML. Normalement la première
ligne d'un document XHTML n'est pas le Doctype mais le prologue xml, le DocType vient en
second. Dans ce cas MSIE 6 ne "voit pas" le Doctype et interprète donc le document en
mode Quirk.
Ceci n'est qu'un bug CSS parmi des centaines d'autres qui ont été documentés dans
différentes versions de Internet Explorer, Mozilla ou Opera ; la prolifération de ces bogues
rend le travail multi-plateforme des designers plus compliqué. Actuellement, le moteur de
rendu Gecko de Mozilla est celui qui interprète le mieux CSS, tandis qu'Internet Explorer
reste le pire lorsqu'il s'agit de rendre correctement les feuilles de style paramétrées suivant
les règles du W3C.
Devant les difficultés rencontrées lors de l'implémentation de CSS2, le W3C a décidé de
revoir sa copie, et de présenter une version simplifiée sur la base de ce qui a réellement pu
être intégré à différents navigateurs. Cette nouvelle version, CSS2.1, est actuellement au
stade de Candidate Recommendation en attendant CSS3.
- 91 -
ANNEXE 6
JavaScript
Un article de Wikipédia, l'encyclopédie libre. [36]
JavaScript est un langage de programmation de type script, orienté objets à
prototype, principalement utilisé dans les pages Web.
Histoire
JavaScript a été créé en 1995 par Brendan Eich pour Netscape Communications
Corporation. Il est apparu pour la première fois dans les versions bêta de Netscape
Navigator 2.0.
D'abord appelé LiveScript, il a été rebaptisé JavaScript et est décrit comme un complément
à
Java
dans
un
communiqué
de
presse
(http://wp.netscape.com/newsref/pr/newsrelease67.html) commun de Netscape et Sun
Microsystems, daté du 4 décembre 1995. Cette initiative a contribué à créer auprès du public
une certaine confusion entre les deux langages, proches syntaxiquement mais pas du tout
dans leurs concepts fondamentaux, et qui perdure encore aujourd'hui.
Le propos de JavaScript est de manipuler de façon simple des objets, au sens informatique,
fournis par une application hôte.
JavaScript est aujourd'hui défini par la norme ECMA-262, aussi connue sous l'appellation
ECMAScript. La troisième édition d'ECMA-262 parue en 1999 correspond à la version 1.5 de
JavaScript. Son implémentation par Microsoft porte quant à elle le nom de JScript. Il est
question
d'une
version
JavaScript
1.6
(http://developer.mozilla.org/en/docs/New_in_JavaScript_1.6) supportée par la version 1.5
de Firefox.
SpiderMonkey (http://developer.mozilla.org/en/docs/SpiderMonkey) est le nom de
l'implémentation C du langage JavaScript utilisé dans Gecko, le moteur de rendu développé
par mozilla. SpiderMonkey est disponible sous la licence « MPL/GPL/LGPL tri-license ».
Versions
Les versions du language JavaScript ont pour origine les spécifications de la norme ECMA262 définisant ECMAScript. JavaScript est un sur-ensemble d'ECMAScript, plus les
fonctionalitées suivantes :
1.5
Interpreteur basé sur les spécifications ECMA-262 3e édition.
1.6
Toutes les fonctionalitées de la version 1.5 plus:
• E4X
• Extension de l'objet Array
• Rapprochement des objets String et Array
• pour en savoir plus (http://developer.mozilla.org/en/docs/New_in_JavaScript_1.6)
- 92 1.7
Toutes les fonctionnalités de la version 1.6 plus:
• Générateurs (instruction yield)
• Itérateurs
• Initialisation avancée des tableaux (var evens = [i for (i in range(0, 21)) if (i% 2 ==
0)];)
• Définition de portée locale (instruction let)
• Assignement destructif ([a,b] = maFonction())
• pour en savoir plus (http://developer.mozilla.org/en/docs/New_in_JavaScript_1.7)
2.0
Interpreteur basé sur les spécifications ECMA-262 4e édition.
Utilisation
Dans une page Web
Du code JavaScript peut être intégré directement au sein des pages Web, pour y être
exécuté sur le poste client.
C'est alors le navigateur Web qui prend en charge l'exécution de ces petits bouts de
programmes appelés scripts.
Généralement, JavaScript sert à contrôler les données saisies dans des formulaires HTML,
ou à interagir avec le document HTML via l'interface DOM, fournie par le navigateur (on
parle alors parfois d'HTML dynamique). Ilest aussi utilisé pour réaliser des services
dynamiques, parfois futiles ou strictement cosmétiques.

Documents pareils