0% ont trouvé ce document utile (0 vote)
8 vues9 pages

Programmation Web et Langage HTML

La programmation web permet de créer et d'éditer des sites web, incluant des pages statiques et dynamiques. Elle utilise divers langages de programmation côté client et côté serveur pour générer du contenu interactif et dynamique. Les langages comme HTML, CSS, JavaScript, PHP, et Python sont couramment utilisés pour développer des applications web modernes.

Transféré par

nguingnissonanga9
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
8 vues9 pages

Programmation Web et Langage HTML

La programmation web permet de créer et d'éditer des sites web, incluant des pages statiques et dynamiques. Elle utilise divers langages de programmation côté client et côté serveur pour générer du contenu interactif et dynamique. Les langages comme HTML, CSS, JavaScript, PHP, et Python sont couramment utilisés pour développer des applications web modernes.

Transféré par

nguingnissonanga9
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Programmation web

La programmation web est la programmation


informatique qui permet de créer et 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 :

les « pages web statiques » : il s'agit de fichiers ; leur


contenu n'est pas influencé par l'internaute qui le
demande et il évolue seulement avec une intervention
manuelle de son code source. Une fois une page
statique chargée sur le navigateur web du client, des
scripts JavaScript peuvent permettre de faire évoluer
la page via des appels côté serveur par exemple Logo du langage HTML5.
(Ajax).
les « pages web dynamiques » : leur 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 ne soit modifié manuellement. Ce contenu est généré selon
l'interaction des utilisateurs (paramètres d'URL, saisi de formulaires, etc.) et selon les
données chargées par calcul au moment de l'appel (pour un blog, par exemple : 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 vocation à être affichées sur le navigateur du client
mais de retourner de la donnée (XML, JSON, etc.) ou permettre l'envoi d'informations côté
serveur (authentification, insertion de données, etc.).
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, etc.), qui
est interprété par son navigateur (Chrome, Firefox, Safari, Edge, Brave, Opera, etc.),
produisant une interface utilisateur. Ce code, 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 (SQL, MySQL, PHP, etc.), pouvant faire appel à des bases de données, des
API, etc.

Il existe différentes techniques 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
plugins qui interprètent certains objets.

La programmation « côté client » (ou développement web frontal) consiste à produire du


code (HTML, CSS, Javascript, etc.) 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éfinit, au départ, que la structure de la page ; mais, très vite, se sont ajoutées
des balises (ou tags) qui spécifient 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 de feuilles de style en cascade (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 multi-plateforme du web : la
majorité des navigateurs web savent afficher des 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 grâce à la balise <img>.

Multimédia
L'intégration de documents multimédia (son ou vidéo).

Mise en place
Une fois un 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 étant souvent lourds ils sont plus longs à télécharger (que du texte,
par exemple). Ils peuvent réduire les performances (temps de chargement) de la page web.
Cependant il existe des techniques permettant d'améliorer le temps de chargement, par
exemple : la lecture en flux (streaming).

Jusqu'au début des années 2010


Animation Flash (obsolète)

Flash (d'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 de travail avec l'extension .fla qui sera compilé en un fichier avec l'extension
.swf. Swift était 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 pouvant être
en flash mais avec la présence d'un squelette HTML.

Flash permet de créer des animations de qualité, offrant 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.
1
Adobe Flash Player est officiellement abandonné en décembre 2020 , ainsi que son support
dans les navigateurs web.

Applet Java (appliquette) (obsolète)


Il était é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 étaient 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 (obsolète)

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 manuellement
rafraîchie.

Le langage HTML est multi-plateformes. 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.

Les composants web permettent aux développeurs de créer des balises HTML
personnalisées et réutilisables.

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, donc
rapide côté 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, feuilles de style en cascade) est un langage de
programmation permettant la mise en forme d'une page web. L'HTML et le CSS sont
complémentaires.

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, tels 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, les langages suivants étaient parfois utilisés :

le JScript, fort proche de JavaScript en est simplement une adaptation par Microsoft.
le VBScript est le langage de script développé par Microsoft sur la base de 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 le chargement d'une URL sur son navigateur (ce qui constitue
une « requête »), un appel (le plus souvent via HTTP ou HTTPS) est effectué sur le serveur
web qui héberge le site correspondant. Ce 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 sera ensuite 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, etc.), va résulter en
un contenu qui sera envoyé « côté client ».

Différents langages et techniques

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) : technique 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
frameworks tels que Wt (en), ou CppCMS (en) par exemple.

Techniques Microsoft

ASP (Active Server Pages) : technique 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 technique est implémentée sur les serveurs web de Microsoft (IIS et
PWS (en)).
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] : technique 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 techniques, de bien séparer le contenu de la page web, sa
2
mise en forme et la programmation des aspects dynamiques (travail en Code Behind ).

Langages utilisés : C#, [Link], JScript .NET... et de nombreux autres langages


partageant le Common Language Runtime du Framework .NET.
Portabilité : la technique 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 technique 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 (en), Firebird, InterBase, FrontBase (en),
3
IBM DB2, Cloudscape, Informix, Ingres, ODBC, Enterprise Access , Microsoft SQL Server,
4
MySQL, PostgreSQL, SQLite, SQLite3, SQLSRV , Sybase, MariaDB.

Technique Ajax : communication sans rechargement


entre « serveur » et « client »
AJAX (Asynchronous JavaScript And XML) est une technique, avec ses avantages et
5
inconvénients , 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 technique 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, pouvant contenir des informations ou du code permettant
de 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
6, 7
« promesse » et d'appel d'une ressource réseau en tâche de fond . Ou encore les

8
8
communications serveur vers client comme le protocole Mercure . 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
([Link] », sur [Link]
(consulté le 19 février 2020)
2. (en) Haiying Yu, « [Link] Code-behind model overview - [Link], Microsoft Learn ([Link]
[Link]/en-us/troubleshoot/developer/webapps/aspnet/development/code-behind-m
odel) », sur Microsoft Learn (consulté le 25 février 2025).
3. (en) « Enterprise Access ([Link]
roduction_to_Enterprise_Access.htm) », sur Actian (consulté le 25 février 2025).
4. « PHP: SQLSRV - Manual ([Link] », sur [Link]
(consulté le 25 février 2025).
5. [Link] ([Link]
6. (en-US) « AJAX - Glossaire | MDN ([Link] », sur
[Link] (consulté le 2 août 2021)
7. (en-US) « Utiliser Fetch - Référence Web API | MDN ([Link]
API/Fetch_API/Using_Fetch) », sur [Link] (consulté le 2 août 2021)
8. « Mercure, un protocole pour pousser des mises à jour vers des navigateurs et app mobiles en
temps réel ([Link]
ers-des-navigateurs-et-app-mobiles-en-temps-reel) », sur [Link] (consulté le
27 avril 2023).

Voir aussi

Sur les autres projets Wikimedia :


Programmation web, sur Wikibooks

Articles connexes

Composants web
Site web
Conception de site Web
Développement web frontal
Développeur web

Ce document provient de « [Link] ».

Vous aimerez peut-être aussi