Programmation

web
type de développement de logiciel

La programmation web est la

programmation informatique qui permet
d'éditer des sites web. Elle permet la
création d'applications, destinées à être
déployées sur Internet ou en Intranet.
Ces applications web sont constituées
de pages web pouvant prendre
différentes formes, telles que :
pages « statiques » : Il s'agit de
fichiers. Le contenu n'est pas influencé
par l'internaute qui la demande, et il
évolue seulement avec une
intervention manuelle de son code
source. Une fois une page statique
chargée sur le navigateur du client, des
scripts Javascript peuvent permettre
de faire évoluer la page via des appels
côté serveur par exemple (Ajax).
pages « dynamiques » : son contenu -
ou « réponse » - est dynamiquement
généré côté serveur au moment de la
demande. Il évolue sans que le code
du site web soit modifié
manuellement. Le contenu est généré
selon l'interaction des utilisateurs
(paramètres d'URL, saisi de
formulaires..) et selon les données
chargées par calcul au moment de
l'appel (ex: Pour un blog : les articles
du jour, contenu de widgets, etc). C'est
le cas de la très large majorité des
sites web et blogs entre le début des
années 2000 et jusqu'au début des
années 2020. Parmi les pages
dynamiques, on peut également citer
les pages - ou « endpoints » - API : Il
s'agit d'une forme de pages
dynamiques qui n'ont pas vocations à
être affichée sur le navigateur du client
mais de retourner de la donnée (XML,
JSON, ...) ou de permettre l'envoi
d'informations côté serveur
 (authentification, insertion de données,
etc).

Logo langage HTML version 5

Pour un internaute qui fait appel à une

URL, la page web correspondante, qu'elle
soit statique ou dynamique, consiste en
du code « côté client » (HTML, CSS,
Javascript, ...) qui est interprété par son
navigateur (Google Chrome, Firefox, ...)
produisant une interface utilisateur. Ce
code, qui est renvoyé par un serveur web,
peut ou non avoir été généré par du
calcul « côté serveur », via des langages
de programmation particuliers, pouvant
faire appel à des bases de données, des
API...

Il existe différentes technologies et

différents langages permettant de
construire des sites web par
l'intermédiaire de serveurs web, que l'on
peut classer selon deux principes : des
langages de programmation côté client,
ou côté serveur. Cette distinction est
faite pour séparer les langages « côté
serveur » dont le code est exécuté sur le
serveur web avant d'arriver sur le
navigateur de l'utilisateur, des langages
« côté client » dont l'exécution ne
nécessite pas de calcul sur le serveur
web mais, seulement après le
téléchargement de la page, une
interprétation par le navigateur de
l'utilisateur.

Programmation web côté

client

Principe

Lorsqu'un visiteur demande une page en

tapant une adresse ou URL, le serveur
web lui renvoie le contenu de la page
demandée, le plus souvent en HTML,
Javascript ou XML.

C'est ensuite le navigateur web qui

interprète le contenu retourné, en
utilisant ou non des plug-ins qui
interprètent certains objets.

La programmation "côté client" (ou

développement web frontal) consiste à
produire du code (HTML, CSS, Javascript,
...) qui sera interprété par un navigateur
web (ou une fenêtre, pour les logiciels de
bureau ou applications mobiles) et
produira un rendu visuel : une interface
utilisateur (UI), et dont certains éléments
permettront une navigation, des liens,
avec les autres pages (UX).
Les langages de balisage

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, listes,
etc.).

Initialement, 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 (identificateur de
fragment).
Ce langage ne définissait au départ que
la structure de la page, mais très vite se
sont rajoutées des balises (ou tags) qui
s'occupaient de spécifier les
caractéristiques de la page web
(hiérarchisation du contenu, attributs
donnés aux balises...).

Depuis sa version 4, le langage HTML

s'accompagne des CSS qui sont des
styles se chargeant de la mise en forme
et de l'animation de la page.

Le XHTML est une évolution du HTML

basée sur XML.
Insertion d'objets en HTML

Pour rendre une page web plus

dynamique en HTML, il est possible d'y
insérer des objets, grâce aux tags
<object>, <img>, <applet> ou <script> par
exemple.

Images

Un premier type d'objet sont les images

qu'on intègre dans la page web. Les
images sont généralement statiques
sauf les gifs animés.

Portabilité
Pour autant qu'on se limite aux
formats de fichiers standards pour le
 web (.gif, .jpg ou .jpeg et .png), les
images sont sans doute un des objets
les plus multiplateforme du web : la
majorité des navigateurs web savent
afficher les images.

Mise en place
Les images numériques deviennent un
média très "grand public" et sont assez
aisées à implémenter dans un site web
au travers de la balise img.

Multimédia

L'intégration de documents multimédia

(son ou vidéo).

Mise en place
 Une fois le fichier son ou vidéo produit,
le placement dans la page HTML peut
se faire, en HTML5, via des balises
<audio> ou <video>.

Performance
Les fichiers multimédia sont souvent
lourds et donc longs à télécharger. Ils
peuvent réduire les performances
(temps de chargement) de la page
web. Cependant il existe des
technologies permettant la lecture en
flux (streaming).

Jusqu'au début des années 2010

Animation Flash
Flash (de Adobe Systems - Macromedia)
est un programme qui permet de créer
des animations dans un format vectoriel
propriétaire 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ères versions de Flash permettent
également l'interfaçage avec une base de
données.

Adobe Flash Player sera officiellement

abandonné en décembre 2020[1], ainsi
que son support dans les navigateurs
web.

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. Ils sont
téléchargés avec la page web et
exécutés par l'ordinateur client.

Le code est indépendant de la plate

forme grâce à la machine virtuelle Java.

ActiveX

Les ActiveX sont une solution de création

d'applications développée par Microsoft.
Les principes de fonctionnement sont
très semblables au fonctionnement des
applets. Voir aussi Component Object
Model

Limites du HTML

Une page web créée en HTML est

totalement statique et n'offre qu'une
faible possibilité d'interaction avec le
visiteur. Chaque page doit être créée au
préalable et doit être manuellement mise
à jour.

Le langage HTML est multiplateformes.

Tous les navigateurs web reconnaissent
le langage HTML de base, seuls
certaines balises ou attributs sont
propres à certains navigateurs. Les CSS,
même s'ils sont standardisés par le W3C,
ne sont pas toujours reconnus de la
même manière par les différents
navigateurs web.

Mise en place

Le langage HTML a l'avantage d'être

facile à mettre en place, et ne demande
pas de compétences techniques très
poussées. Ses pages sont d'un
traitement très léger et rapide par le
serveur.

XML (eXtended Markup Language)

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 peut être lié à un fichier XSL

(Feuilles de style XML) 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.

Langages de mise en forme (CSS)

Le CSS (cascading style sheets) est un

langage de programmation permettant la
mise en forme d'une page web. L'HTML
et le CSS sont complémentaires.

Cette section est vide, insuffisamment

détaillée ou incomplète. Votre aide est la
bienvenue ! Comment faire ?

Langages de Script

La programmation côté client utilise des

langages de scripts. À la différence des
langages de programmation côté
serveur, ces langages ne sont pas
compilés. Ils sont interprétés par le
navigateur web du visiteur.

Les langages de script sont utilisés au

départ dans le cas de validation de
formulaires (champs obligatoires, petits
calculs, ...) et dans la création
d'animations sur le navigateur de
l'utilisateur (menus déroulants,
rafraîchissement du contenu sans
rechargement de la page, …). Ils
permettent toutefois aujourd'hui de faire
beaucoup plus, tel que la création de jeux
vidéo (API Canvas), la création
d’environnements sonores (API Web
Audio), la communication en temps réel
(API RTC), etc.

Dès le milieu des années 2010, la

programmation Script est devenue très
courante pour le développement
d'applications web complètes avec
l'arrivée de plateformes logicielles et de
frameworks open-source basés sur
JavaScript, très documentés et
largement recommandées par la
communauté des développeurs, tels que
le programme [Link], mais également
les frameworks et librairies [Link]
(indépendant), ReactJS (Facebook) ou
encore AngularJS (Google).

Il existe historiquement plusieurs

langages de script :

JavaScript, qui est compatible sur tous

les navigateurs. Il se base sur le
langage normalisé ECMAScript.
Au début des années 2000, étaient
parfois utilisés :
le JScript, fort proche du
JavaScript est simplement une
adaptation de celui-ci par
Microsoft.
le 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.
 le DHTML, qui 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.

Programmation web côté

serveur

Principe

Lorsqu'un visiteur demande (ou requête)

le chargement d'une URL sur son
navigateur, un appel (le plus souvent via
HTTP ou HTTPS) est effectué sur le
serveur web qui héberge le site
correspondant. Le serveur web va
ensuite identifier le ou les scripts (écrits
dans un langage « côté serveur »)
correspondant à cette URL, et demander
leur exécution. L'exécution va alors
résulter en un contenu HTML, qui va
ensuite être expédié en réponse au
visiteur, lisible par son navigateur.

La programmation "côté serveur"

consiste donc à produire du code dont
l'exécution, du calcul et de la
récupération de données externes (bases
de données, API, ...), va résulter en un
contenu qui sera envoyé au client. Ce
contenu peut être du code "côté client".
Différents langages et technologies

Javascript

Il est possible de mettre en place un

serveur web en utilisant le programme
[Link], exposant des URL, via
notamment [Link], à un projet de
code développé en Javascript.

PHP

PHP (PHP: Hypertext Preprocessor) est

un langage de script interprété côté
serveur. Le code PHP est lu par le
serveur et interprété pour produire une
page HTML (ou d'autres types de fichier
comme des images ou des documents
PDF) à chaque fois que la page sera
demandée. Ce langage a été créé
initialement dans le cadre des logiciels
Open Source. De nombreux développeurs
ont ensuite profité de l'Open Source pour
développer de nombreux modules prêts
à l'usage et paramétrables à volonté.

Les modules serveurs de PHP sont

implémentés sur les serveurs Apache et
Unix mais PHP peut être implémenté sur
d'autres plates-formes via des CGI.

La syntaxe, relativement simple, part

d'une base de C.

Frameworks notables : Symfony, Laravel

Python

Django : Framework open-source

largement répandu pour construire et
déployer une application côté serveur en
Python.

Ruby

Ruby on Rails : Framework open-source

largement répandu pour construire et
déployer une application côté serveur en
Ruby.

Java

JSP (JavaServer Pages) : Technologie

développée par Sun Microsystems
dans le but de créer des pages
dynamiques avec le langage Java. Les
JSP permettent d'ajouter du code Java
dans la page HTML qui sera interprété
par le serveur. On peut distinguer trois
ensembles d'instructions JSP :
Les instructions de
programmation permettent
d’insérer des bouts de code Java
directement dans la page web, et
donnent accès à une grande partie
de la bibliothèque de
programmation de la version
standard de Java (composants
JavaBeans, accès aux bases de
données via JDBC etc.)
Les directives qui permettent de
spécifier certaines propriétés de la
page, l’inclusion du contenu
d’autres fichiers et l’utilisation
d’autres classes et bibliothèques
de balises personnalisées.
Les actions permettent
essentiellement d’utiliser des
composants JavaBeans existants.
Portabilité : Très grande
portabilité grâce à Java : serveurs
Apache mais aussi IIS, etc.
Mise en place : Utilisation de Java
comme langage de
programmation.
Performance : Très variable en
fonction de l'implémentation
utilisée.
 Utilisation : Tout type de
fonctionnalités.
Servlets : Le nom vient d'une analogie
possible à faire avec les applets. Il
s'agit donc de programmes créés en
Java et tournant sur le serveur web.
L'exécution du programme génère les
pages web renvoyées au client.
Langages utilisés : Java.
Portabilité : Très grande
portabilité grâce à Java : serveurs
Apache mais aussi IIS, etc.
Mise en place : Utilisation de Java
comme langage de
programmation.
 Performance : Très variable en
fonction de l'implémentation
utilisée.
Utilisation : Tout type de
fonctionnalités.
C++

Il est possible de développer un site web

« côté serveur » en C++, notamment avec
des framework tels que Wt, ou CppCMS
par exemple.

Technologies Microsoft

ASP (Active Server Pages) :

Technologie développée par Microsoft
à partir de 1996 dans le but de créer
des pages dynamiques. ASP permet
d'ajouter du code dans la page HTML
qui sera interprété par le serveur. La
partie ADO (ActiveX Data Object) de
ASP permet de se connecter à une
base de données.
Langages utilisés : VBScript
(langage par défaut) ou JScript.
Portabilité : La technologie est
implémentée sur les serveurs web
de Microsoft (IIS et PWS).
Mise en place : Utilisation de
langage de Script donc d'accès
relativement aisé (mais se
complexifie vite).
Performance : Bonne
performance surtout si l'on utilise
 du code compilé (dll).
Utilisation : Tout site web
dynamique peut être créé en ASP.
Dernière version : ASP 3.0.
[Link] : Technologie développée par
Microsoft sur base du [Link].
L'évolution est importante par rapport à
ASP et les possibilités deviennent
quasi infinies. [Link] a le gros
avantage, par rapport à d'autres
technologies, de bien séparer le
contenu de la page web, sa mise en
forme et la programmation des
aspects dynamiques (travail en Code
Behind).
Langages utilisés : C#, [Link],
[Link]... et de nombreux
autres langages partageant le
Common Runtime Language du
[Link].
Portabilité : La technologie est
implémentée sur les serveurs web
de Microsoft (IIS 2003).
Mise en place : Utilisation de
langage de programmation et
nécessite donc de bonnes bases
en programmation mais le
langage importe peu (plusieurs
langages possibles). Avec la
version 2 ([Link] 2.0) et un outil
de développement comme Visual
 Studio, le développement
d'applications peut déjà aller très
loin sans programmation :
beaucoup de contrôles sont gérés
par leurs propriétés.
Performance : Excellentes
performances car tout le code est
compilé (soit précompilé, soit
compilé à la volée).
Utilisation : Tout type d'application
web peut être créé avec [Link].
ColdFusion

ColdFusion est une technologie de

création de pages dynamiques
développée par Macromedia. Les pages
d’application sont des pages web
contenant des instructions de
programmation écrite à l’aide d’un
langage propriétaire, le CFML
(ColdFusion Markup Language). Le
CFML est un langage simple basé sur
des balises dont la syntaxe est similaire
à celles du langage HTML mais
interprétées par le serveur.

Base de données

Chacun de ces langages, pour permettre

de construire des pages dont le contenu
et les données sont construits
dynamiquement en fonction de l'usage
des utilisateurs ou d'autres paramètres
externes, peut faire appel à une ou
plusieurs bases de données.

Il en existe de nombreuses sortes :

dBase, filePro, Firebird/InterBase,
FrontBase, IBM DB2, Cloudscape,
Informix, Ingres, EDBC, Enterprise
Access, Mssql, MySQL, PostgreSQL,
SQLite, SQLite3, SQLSRV, Sybase.

Technologie Ajax :
Communication sans
rechargement entre
« serveur » et « client »
AJAX (Asynchronous JavaScript And
XML) est une technologie, avec ses
avantages et inconvénients[2], qui
combine plusieurs éléments :

du XHTML pour la structure de la page,

les CSS pour la mise en forme de la
page,
du JavaScript et le DOM pour la partie
dynamique,
XML, XSLT et XMLHttpRequest pour la
manipulation des données (ou d'autres
formats de fichiers de données).

Cette technologie permet d'effectuer une

requête HTTP asynchrone (en parallèle)
depuis un client au serveur web
(effectuer une action, mettre à jour une
information...). Le serveur renvoie la
ressource demandée, celle-ci pouvant
contenir des informations ou du code
pour mettre à jour la page HTML.

Depuis le milieu des années 2010, avec

l'arrivée de standards plus modernes du
web, AJAX (dont la définition est
associée à l'API XMLHttpRequest) est
progressivement remplacé par de
nouvelles fonctions telle que fetch() (API
Fetch) qui repose sur un principe de
« promesse » et d'appel d'une ressource
réseau en tâche de fond[3],[4]. Ou encore
les communications serveur vers client
comme le protocole Mercure[5]. Le
principe reste le même : faire
communiquer, sans rechargement, une
interface client avec une ressource sur
un serveur.

Notes et références
1. « Gérer Flash dans les navigateurs
Chrome de vos utilisateurs - Aide
Google Chrome Enterprise » (https://
[Link]/chrome/a/answ
er/7084871?hl=fr) [archive], sur
[Link] (consulté le
19 février 2020)
2. [Link] ([Link]
[Link]/fr/[Link]
m) [archive]
3. (en-US) « AJAX - Glossaire | MDN » (http
s://[Link]/fr/docs/Glo
 ssary/AJAX) [archive], sur
[Link] (consulté le
2 août 2021)
4. (en-US) « Utiliser Fetch - Référence Web
API | MDN » ([Link]
[Link]/fr/docs/Web/API/Fetch_API/U
sing_Fetch) [archive], sur
[Link] (consulté le
2 août 2021)
5. « Mercure, un protocole pour
pousser des mises à jour vers des
navigateurs et app mobiles en
temps réel » ([Link]
p/blog/mercure-un-protocole-pour-po
usser-des-mises-a-jour-vers-des-navi
gateurs-et-app-mobiles-en-temps-ree
 l) [archive], sur [Link]
(consulté le 27 avril 2023).

Voir aussi

Articles connexes

Site web
Conception de site Web

Portail de la programmation inform

Portail d’Internet

Ce document provient de
« [Link]
title=Programmation_web&oldid=206656181 ».
La dernière modification de cette page a été faite
le 5 août 2023 à 08:45. •
Le contenu est disponible sous licence CC BY-SA
4.0 sauf mention contraire.