Ce document décrit les différences entre les sites web statiques et dynamiques. Il explique qu'un site statique utilise seulement HTML et CSS tandis qu'un site dynamique utilise en plus une base de données et un langage serveur comme PHP. Le document détaille également les notions de back-office et front-office.
0 évaluation0% ont trouvé ce document utile (0 vote)
27 vues10 pages
Ce document décrit les différences entre les sites web statiques et dynamiques. Il explique qu'un site statique utilise seulement HTML et CSS tandis qu'un site dynamique utilise en plus une base de données et un langage serveur comme PHP. Le document détaille également les notions de back-office et front-office.
Ce document décrit les différences entre les sites web statiques et dynamiques. Il explique qu'un site statique utilise seulement HTML et CSS tandis qu'un site dynamique utilise en plus une base de données et un langage serveur comme PHP. Le document détaille également les notions de back-office et front-office.
Ce document décrit les différences entre les sites web statiques et dynamiques. Il explique qu'un site statique utilise seulement HTML et CSS tandis qu'un site dynamique utilise en plus une base de données et un langage serveur comme PHP. Le document détaille également les notions de back-office et front-office.
Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
Télécharger au format pdf ou txt
Vous êtes sur la page 1sur 10
Sites web statique et
dynamique Table des matières Objectifs 3
I - Sites web statique et dynamique 4
1. Notions de Sites statique et dynamique .......................................................................................................... 5
1.1. Site statique .................................................................................................................................................................................. 5 1.2. Site dynamique ............................................................................................................................................................................. 6
2. Différence entre un site statique et dynamique .............................................................................................. 6
3. front-office et back-office .............................................................................................................................. 7
À la fin de cette leçon, l'apprenant sera capable de :
Définir les notions de Sites web statique et dynamique
Différencier un sites web statique d'un site web dynamique ; Les notions de front-office et back-office
3 Sites web statique et dynamique
Sites web statique et
dynamique I
4 1. Notions de Sites statique et dynamique 1.1. Site statique On entend par site statique,non pas un site dont une page est sans mouvements ou sans animations, mais une page visible telle qu'elle a été conçue.Ces pages peuvent présenter toute forme de contenu, animations flash, images, musique, vidéo etc... mais elles sont toujours présentées de la même façon quelque soit le visiteur. Elle ne change pas et c'est en ce sens qu'elle est statique
Le site statique est souvent coder avec de l'HTML (HyperText Markup Language) est le langage de balisage conçu pour représenter les pages web) et du CSS (Cascading style sheets ou feuille de style en cascade) est un langage informatique qui décrit la présentation des documents HTML) seulement. Un site statique n'a pas de base de données
Fonctionnement d'un site statique
1. Le client (Navigateur = Chrome ....) émet une requête (Demande d'une page statique) vers le serveur web 2. Le serveur web envoi au client (Navigateur) la page statique demandée par le visiteur
Syntaxe SITE WEB STATIQUE = HTML + CSS
Exemple
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title> Bonjour depuis HTML </title> 6 </head> 7 <body> 8 <p> Bonjour j'apprends du HTML !</p> 9 </body> 10 </html> 11
Après exécution on à : Bonjour j'apprends du HTML !
5 Différence entre un site statique et dynamique
1.2. Site dynamique
Un site dynamique est un site dont le contenu change dynamiquement. Par exemple on veut afficher le nombre d’étudiants inscris au cours de CMS. On aura recours à une une fonction qui s'occupe de compter le nombre de personnes qui se sont inscrits au cours de CMS. Et on l'affiche le résultat de la requête sur notre page. Sans changer le code source. Un site dynamique a une base de données.
Fonctionnement d'un site web dynamique
1. Le client (Navigateur = Chrome ....) émet une requête (Demande d'une page statique) vers le serveur web 2. Le serveur web en interprétant le code PHP communique ensuite avec la base de données pour récupérer les informations recherchés 3. Le serveur web envoi au client (Navigateur) du contenu HTML avec les informations trouvées dans la base de données ( Envoi de la page générée)
Syntaxe SITE DYNAMIQUE = HTML + CSS + SERVEUR WEB + BASE DE DONNÉES
Exemple : avec un Blog :
Sur un site statique on devra créer un fichier HTML pour chaque article de notre Blog.
Sur un site dynamique on créera un fichier PHP nommé article.php qui s'occupe de récupérer le bon article dans notre base de données en fonction du nom ou de son identifiant. Puis il l'affichera.
2. Différence entre un site statique et dynamique
Site statique
- Pas de base de données
- HTML/CSS seulement (avec du JavaScript si l'on désir) - Modifier le contenu via le code source - Pas d'exécution de calcul avec le serveur
6 front-office et back-office
Site dynamique
- Base de données - PHP en plus des autres langage de programmation (pas obligatoirement du PHP mais c'est le plus connu) - Modifier le contenu via la base de données - Exécution de calcul côté serveur
Complément : PHP
Le PHP est un langage programmation permettant la
création d’application web. Le terme PHP est un acronyme récursif de "PHP: Hypertext Preprocessor". Ce langage est principalement utilisé pour produire un site web dynamique. Il est associé à une base de données, tel que MySQL.Exécuté du côté serveur (l'endroit où est hébergé le site) il n'y a pas besoin aux visiteurs d'avoir des logiciels ou plugins particulier. Néanmoins, les webmasters qui souhaitent développer un site en PHP doivent s'assurer que l'hébergeur prend en compte ce langage. Lorsqu'une page PHP est exécuté par le serveur, alors celui-ci renvois généralement au client (aux visiteurs du site) une page web qui peut contenir du HTML, XHTML, CSS, JavaScript ...
Après exécution du script on à : Bonjour j'apprends du PHP !
3. front-office et back-office Les CMS sont constitués du Back‐Office et du front-office. dans cette partie nous aborderons ces différentes notions.
7 3.1. back-office
Définition Appliqué aux sites web dynamiques, le terme back-office désigne simplement l'interface permettant de gérer tout le cycle de vie d'une information (la création du contenu, son stockage et le maintient en version, sa structuration et son classement) d'un site dynamique (bien souvent un CMS). Par opposition à « front-office », le back-office est la coulisse où travaillent les administrateurs de site web, les webmasters.
Accès au back-office et sécurité des données
On accède généralement au back-office d'un site web par une url dédiée. Sous Wordpress, par défaut, on accède au back office d'un site en ajoutant /wp-admin (par exemple : www.monsite.com/wp-admin).
Les bonnes pratiques en matière de sécurité recommandent d'ailleurs de changer cette url pour éviter que des outils malveillants comme des robot ne tentent en permanence de rentrer dans le back-office, notamment à grand coup d'attaques brut force.Après s'être identifié à l'aide de son identifiant / mot de passe (il est également recommander de ne pas garder le nom d'utilisateur “admin” pour les même raisons que ci-dessus), on peut accéder à l'interface de gestion du site. Cette interface ressemble à ça :
Back-office Wordpress
3.2. front-office Le Front-Office Par opposition à « back-office », permet de publier le contenu et de contrôler l'accès à celui‐ci. Il se présente sous la forme d'un site frontal ou d'un portail.
8 Front-office
9 Activité d'auto evaluation
Activité d'auto evaluation
II Exercice
Remplissez les champs vides
SITE = HTML + CSS + + BASE DE DONNÉES
Exercice
Saisissez la bonne réponse
Une page web est une page web générée à la demande
