CONCEPTION ET PROGRAMMATION WEB

PLAN DU COURS

Introduction Générale

Introduction Programmation web HTML, CSS, JavaScript

Programmation avancé HTML5 , CSS3

Création d’un site web pas à pas

Conception des bases de données MySql exploitées à l’aide de PHP

Sécurité des sites web

Installation, intégration et sécurité d’un site utilisant le CMS WordPress

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 1

 CONCEPTION ET PROGRAMMATION WEB

Chap1 : Introduction Générale

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 2

 Qui ce qu’un site web ?
Techniquement, un site web ce n'est qu'un fichier ou un ensemble de fichiers, hébergés
sur un serveur et accessible via internet. Une page web tel qu’une simple page html, une
image ou un formulaire peuvent tout à fait être des sites internet.

La page web est l'unité de consultation du World Wide Web. Ce terme a une
signification pratique ; il n'a pas de définition technique formelle. Les pages web sont
conçues pour être consultées avec un navigateur web.

Le world wide web est un système permettant d'accéder aux ressources présentes sur
internet et de naviguer à partir de liens hypertextes liant les pages des sites web.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 3

Qui ce qu’un serveur web ?
La fonction principale d'un serveur Web est de stocker et délivrer des pages web qui
sont généralement écrites en HTML. Le protocole de communication Hypertext
Transfer Protocol (HTTP) permet de dialoguer avec le logiciel client, généralement un
navigateur web.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 4

HyperText Transfer Protocol
Le protocole HTTP (HyperText Transfer Protocol) est le protocole le plus utilisé sur
Internet depuis 1990. La version 0.9 était uniquement destinée à transférer des données
sur Internet (en particulier des pages Web écrites en HTML. La version 1.0 du protocole
(la plus utilisée) permet désormais de transférer des messages avec des en-têtes décrivant
le contenu du message en utilisant un codage de type MIME.

Le but du protocole HTTP est de permettre un transfert de fichiers (essentiellement au

format HTML) localisés grâce à une chaîne de caractères appelée URL entre un
navigateur (le client) et un serveur Web

L'URL, pour Uniform Resource Locator, désigne communément l'adresse web d'un site
Internet. Elle se présente sous la forme d'une série de caractères permettant
l'identification d'un site Internet et/ou d'une page web.
COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 5
Les méthodes HTTP
GET
La méthode GET demande une représentation de la ressource spécifiée. Les requêtes
GET doivent uniquement être utilisées afin de récupérer des données.
HEAD
La méthode HEAD demande une réponse identique à une requête GET pour laquelle
on aura omis le corps de la réponse (on a uniquement l'en-tête).
POST
La méthode POST est utilisée pour envoyer une entité vers la ressource indiquée.
Cela entraîne généralement un changement d'état ou des effets de bord sur le serveur.
PUT
La méthode PUT remplace toutes les représentations actuelles de la ressource visée
par le contenu de la requête.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 6

DELETE
La méthode DELETE supprime la ressource indiquée.
CONNECT
La méthode CONNECT établit un tunnel vers le serveur identifié par la ressource
cible.
OPTIONS
La méthode OPTIONS est utilisée pour décrire les options de communications avec la
ressource visée.
TRACE
La méthode TRACE réalise un message de test aller/retour en suivant le chemin de la
ressource visée.
PATCH
La méthode PATCH est utilisée pour appliquer des modifications partielles à une
ressource.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 7

 Langage HTML et CSS
 Il s'agit de langages informatiques qui permettent de créer des sites web. Tous les sites web sont
basés sur ces langages, ils sont incontournables et universels aujourd'hui. Ils sont à la base même du
Web. Le langage HTML a été inventé par un certain Tim Berners-Lee en 1991…

 Tim Berners-Lee suit encore aujourd'hui avec attention l'évolution du Web. Il a créé le World Wide
Web Consortium (W3C) qui définit les nouvelles versions des langages liés au Web. Il a par ailleurs
créé plus récemment la World Wide Web Foundation qui analyse et suit l'évolution du Web.

 Pour créer un site web, on doit donner des instructions à l'ordinateur. Il ne suffit pas simplement de
taper le texte qui devra figurer dans le site (comme on le ferait dans un traitement de texte Word, par
exemple), il faut aussi indiquer où placer ce texte, insérer des images, faire des liens entre les pages,
etc

 Vous pouvez très bien créer un site web uniquement en HTML, mais celui-ci ne sera pas très beau :
l'information apparaîtra «brute ». C'est pour cela que le langage CSS vient toujours le compléter.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 8

HTML (HyperText Markup Language) : il a fait son apparition dès 1991 lors du lancement du Web.
Son rôle est de gérer et organiser le contenu. C'est donc en HTML que vous écrirez ce qui doit être
affiché sur la page : du texte, des liens, des images… Vous direz par exemple : « Ceci est mon titre, ceci
est mon menu, voici le texte principal de la page, voici une image à afficher, etc. ».

CSS (Cascading Style Sheets, aussi appelées Feuilles de style) : le rôle du CSS est de gérer l'apparence
de la page web (agencement, positionnement, décoration, couleurs, taille du texte…). Ce langage est
venu compléter le HTML en 1996.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 9

 Les versions de HTML
HTML 1 : c'est la toute première version créée par Tim Berners-Lee en 1991.

HTML 2 : la deuxième version du HTML apparaît en 1994 et prend fin en 1996 avec l'apparition du
HTML 3.0. C'est cette version qui posera en fait les bases des versions suivantes du HTML. Les règles
et le fonctionnement de cette version sont donnés par le W3C (tandis que la première version a été créée
par un seul homme).

HTML 3 : apparue en 1996, cette nouvelle version du HTML rajoute de nombreuses possibilités au
langage comme les tableaux, les applets, les scripts, le positionnement du texte autour des images, etc.

HTML 4 : il s'agit de la version la plus répandue du HTML (plus précisément, il s'agit de HTML 4.01).
Elle apparaît pour la première fois en 1998 et propose l'utilisation de frames (qui découpent une page
web en plusieurs parties), des tableaux plus complexes, des améliorations sur les formulaires, etc. Mais
surtout, cette version permet pour la première fois d'exploiter des feuilles de style, notre fameux CSS !

HTML 5 : c'est LA dernière version. Encore assez peu répandue, elle fait beaucoup parler d'elle car elle
apporte de nombreuses améliorations comme la possibilité d'inclure facilement des vidéos, un meilleur
agencement du contenu, de nouvelles fonctionnalités pour les formulaires, etc. C'est cette version que
nous allons découvrir ensemble.
COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 10
Les versions de CSS
CSS 1 : dès 1996, on dispose de la première version du CSS. Elle pose les bases de ce langage qui
permet de présenter sa page web, comme les couleurs, les marges, les polices de caractères, etc.

CSS 2 : apparue en 1999 puis complétée par CSS 2.1, cette nouvelle version de CSS rajoute de
nombreuses options. On peut désormais utiliser des techniques de positionnement très précises, qui nous
permettent d'afficher des éléments où on le souhaite sur la page.

CSS 3 : c'est la dernière version, qui apporte des fonctionnalités particulièrement attendues comme les
bordures arrondies, les dégradés, les ombres, etc.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 11

Les Navigateurs
Le navigateur web est un programme qui permet d'afficher des sites web. Il lit les langages HTML et CSS
pour savoir ce qu'il doit afficher.

Il existe de nombreux navigateurs web différents : Google Chrome, Mozilla Firefox, Internet Explorer,
Safari, Opera… Chacun affiche un site web de manière légèrement différente des autres navigateurs.

Il existe des variantes de ces navigateurs conçues pour les téléphones portables, en particulier pour les
smartphones.

Qu'est-ce qu'un nom de domaine ?

Chaque ordinateur connecté au réseau Internet possède une adresse IP constituée d'une suite de chiffres
permettant de l'identifier. Pour plus de commodité et de facilité d'usage, il a été décidé de faire
correspondre à chaque adresse IP un nom différent : le nom de domaine. La correspondance entre le nom
de domaine et l'adresse IP est assurée par le DNS

De cette manière, lorsque l'on saisit dans son navigateur Internet l'adresse d'un site (de type :
www.google.fr), le DNS va rechercher à quelle adresse IP correspond le nom, trouver son emplacement
dans le réseau et en rapporter les informations.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 12

Le nom de domaine est utilisé pour l'ensemble des services liés à Internet : hébergement de site internet,
messagerie, etc.

Un nom de domaine est composé :

- d'un nom (composé d'un ensemble de caractères alphanumériques), Le nom correspond le plus souvent
au nom d'une marque, d'une société, d'une association, d'une personne

- d'un suffixe (.com, .fr, .eu, .org…), le suffixe, que l'on appelle aussi généralement l'extension du nom
de domaine, correspond à la classification du domaine.

Le nom de domaine est indispensable à l'identité de toute marque, société, personne morale ou physique,
souhaitant se positionner sur le réseau Internet.

COURS CONCEPTION ET PROGRAMMATION WEB | ELYES SOUILEM 13