Programmation web

Les bases de la page web - Les langages de balisage

Le langage HTML ou XHTML

Toute page web comprend une base de langage html ou xhtml. Il s'agit d'un langage de balisage qui définit essentiellement la structure de la page web (titres, tableaux, paragraphes, etc.).

C'est un langage qui permet de créer des hyperliens, à savoir des liens d'un document à un autre ou d'un endroit d'un document à un autre endroit du même document.

Au départ se langage ne définissait que la structure de la page mais très vite se sont rajoutées des balises (ou tags) qui s'occupaient de mettre en forme le document (mise en gras, en italique, choix d'un police de caractère, ...). Depuis sa version 4, le langage html s'accompagne des css qui sont des styles qui se chargent la mise en forme de la page.

Le xhtml est la dernière évolution du html adaptée aux normes xml.

Les limites du html

Une page web créée en html est totalement statique et absolument pas dynamique (pas d'interaction avec le visiteur). Seuls deux tags html (<marquee> et <blink> mais qui ne sont pas compatibles avec tous les navigateurs) et quelques fonctionnalités des CSS permettent, à ce stade, de créer un peu de dynamisme dans la page (ex. changement de couleur lors d'un survol).

A propos de l'interactivité, le langage html permettra uniquement de créer le layout d'un formulaire d'interaction avec le visiteur. Il permettra de définir les paramètres d'une actions et de renvoyer vers un 'système' qui gèrera les données mais ne permet pas de définir l'action elle-même.

Il faut donc autre chose pour ajouter de l'animation ou de l'interactivité dans la page web.

Le XML

Le langage de balisage xml peut également servir de base à une page web. Le fichier xml contiendra le contenu de la page web. Ce fichier sera lié à un fichier xsl qui mettra en forme les données du fichier xml.

La plupart du temps, la page web ne sera pas basée sur un fichier xml natif mais celui-ci sera généré dynamiquement par un des langages de programmation web ci-dessous.

L'insertion d'objets

Une première technique pour rendre sa page web plus dynamique, est d'y insérer des objets.

Images

Un premier type d'objet sont les images qu'on intègre dans la page web L'image est généralement statique sauf les gifs animés.

Multimédia

L'intégration de documents multimédia (son ou vidéo) vont également permettre de 'dynamiser' mon site mais ce gene de fichier est souvent très lourd au téléchargement.

Animation Flash

Flash (de Adobe - Macromedia) est un programme qui permet de créer des animations dans un format vectoriel relativement léger. Le programme génère un fichier avec l'extension .fla qui est le fichier de travail et qui sera 'compilé' en un fichier avec l'extension .swf. Swift est un autre programme générant des fichiers swf hors de la sphère Macromedia.

Dans une page web, une animation Flash (fichier avec extension .swf) peut être intégrée comme partie de la page (une publicité, un menu,...) ou l'ensemble de la page peut être en flash mais il y aura toujours un squelette html.

Flash permet de créer des animations de qualité, permet une certaine interaction avec l'utilisateur grâce au langage de programmation ActionScript (dérivé de ECMAScript comme JavaScript). Les dernière versions de Flash permettent également l'interfaçage avec une base de données.

Applet Java (appliquette)

Il est également possible de créer des petits programmes avec interface dans un langage de programmation comme Java. Ces petits programme sont appelés Applets ou appliquettes. Ils sont complètement autonomes mais éventuellement paramètrables et s'intègrent dans une page web.

Exemples: des jeux, des 'chats', des menus, ...

Attention, tous les niveaux de sécurité de tous les navigateurs n'accèptent pas le lancement d'applets.

La programmation web côté client

Les objets ne fournissent pas toutes les solutions aux besoins d'interactivité et de dynamisme des sites ou sont parfois lourds à mettre en place. Il est possible alors de passer à de la programmation.

Principe

Lors d'une simple page html (avec ou sans objets), quand le visiteur demande une page (quand il tape une adresse ou URL), le serveur web lui renvoie simplement la page et son contenu et, c'est le navigateur qui interprète le contenu html et les plug-ins qui interprètent les objets.

Si du code, côté client, est insérer dans la page, le serveur web renverra également la page au client, y compris le code. C'est donc, à nouveau le navigateur qui doit interprèter le code et faire ce que le code demande.

Utilisation

La programmation côté client sera utilisée essentiellement dans le cas de validation de formulaires (champs obligatoires, petits calculs,...) et dans la création de petites animations (menus déroulants, ...).

Langages de Script

La programmation côté client utilise des langages de scripts. A la différence d'autres langages de programmation, ces langages ne sont pas compilés (ils sont juste interprètés par le navigateur du client) et sont simplifiés au niveau de la syntaxe (variables non-typées a priori, ...).

• JavaScript est le plus utilisé des langages de programmation web côté client. Il est reconnu par tous les navigateurs (dans les versions actuelles). Il se base sur le langage normalisé ECMAScript et possède une syntaxe issue du langage Java.

• JScript, fort proche du JavaScript est simplement une adaptation de celui-ci par Microsoft.

• VBScript est le langage de script développé par Microsoft sur base du Visual Basic. Ce langage n'est interprèté que par les navigateurs basés sur ceux développés par [[Microsoft] (soit Internet Explorer et Maxthon). Il est donc peu utilisé sur l'Internet (mais utilisé parfois sur des intranets).

• DHTML N'est PAS un langage de script mais simplement la combinaison, dans une page web, de JavaScript, de HTML 4 ou de XHTML et de CSS.

Avantages et inconvénients

• Avantages:

La programmation côté client est légère et relativement simple à implémenter (syntaxe pas trp complexe).

• Inconvénients:

Le code est envoyé tel quel au client donc est visible par celui-ci (s'il regarde les sources de sa page) et donc peu sécurisé. Le bon déroulement du programme dépend entièrement du navigateur du client, de sa configuration et de son niveau de sécurité.

Il n'est donc pas question ici de lier le site web à une base de données.

La programmation web côté serveur

Principe

Lors de l'insertion de programmation côté serveur dans une page, lorsque le visiteur demande la page, le serveur va d'abord lire celle-ci, il va interprèter le code serveur et encapsuler le résultat dans la page html. Cette dernière sera expédiée au visiteur sans plus aucune trace du code serveur. Le visiteur reçoit donc une pure page html (avec éventuellement encore du code client).

De ce processus, on gagne énomément en sécurisation du code. On a aussi un grand nombre de possibilité d'interactions avec d'autres systèmes ou applications comme les bases de données.

Les pages "côté serveur" ont généralement une extension autre que .htm ou .html. L'extension dépendra de la technologie utilisée.

Les différentes technologies

Les technologies Microsoft

• ASP (Active Server Pages)

• ASP.Net