Qu’est-ce qu’un site web ?
Formation Strasweb du 23 octobre 2013
Par Anne-Laure Faessel
L’association Strasweb
Formations
Prestations web
Hébergement
Qu’est-ce qu’un site internet ? – Formation Strasweb du 2...
Internet
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
Pourquoi un site internet ?
2002 : 16,4 millions d’internautes en
France
2012 : 40,2 millions d’internautes en
France
Po...
Qu’est-ce qu’internet ?
Réseau de télécommunication
Par câble ou par Wifi
Qu’est-ce qu’un site internet ? – Formation St...
La relation client/serveur
Le serveur transmet des données au
client
Le serveur doit être adapté au trafic
du site
Plus...
L’hébergeur
Met à disposition d’utilisateur des
serveurs
Gratuit ou payant
Différents services inclus ou non dans
l’off...
Le nom de domaine
L’« adresse » du site internet
Différentes extensions possibles
Ex : .fr, .com, .org, etc
Qu’est-ce q...
Les navigateurs
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
Le navigateur
Interprète le code transmis par le
serveur
Les navigateurs n’interprètent pas
tous le code de la même mani...
Les différents navigateurs du
marché
Firefox
Chrome
Internet Explorer
Safari
Opera
Qu’est-ce qu’un site internet ? – ...
Parts de marché
Part de marché en Europe* (09/2013)
Firefox Chrome IE Safari Opera
* Source : http://gs.statcounter.com/
Q...
Firefox
Indépendant
Puissant
Ne récolte pas les données de
navigation
Supporte les derniers standards
Grand choix de ...
Chrome
Le navigateur de Google
Très pratique pour les utilisateurs de
produits Google
Barre d’adresse hybride
Supporte...
Internet explorer
Navigateur par défaut sur Windows
Ne supporte pas toujours les derniers
standard des langages web
Dét...
Démonstrations
Mettre une page en favori dans la
barre de favoris
Voir l’historique de navigation
Lancer une navigation...
Moteurs de recherches
Parts de marché en France (12/2012)*
Google : 94%
Bing : 2%
Yahoo : 2%
*source : http://www.journ...
Démonstrations
Recherche sur Google
Analyse de la page de résultat
Qu’est-ce qu’un site internet ? – Formation Strasweb ...
Les langages du web
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
HTML : balisage de la page
Langage de balises
Deux balises entourent un élément
Ex : <h1>Titre de niveau 1</h1>
Qu’est-...
Exemple de code HTML
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
CSS : mise en forme
Se combine au HTML pour donner un
aspect particulier aux éléments
Peut affecter tous les éléments
se...
HTML / CSS
Ces langages vous intéressent ?
Un très bon cours pas à pas :
http://fr.openclassrooms.com/mooc/h
tml5-css3
Qu...
Langages de programmation
PHP : traité côté serveur
JavaScript : traité côté client
Permettent d’effectuer des traiteme...
Site statique vs Site dynamique
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
Site statique
Utilise quasi exclusivement HTML et
CSS
Toute modification nécessite de
toucher au code
Qu’est-ce qu’un si...
Site dynamique
Utilise un langage de programmation
Conçu pour être mis à jour
régulièrement
Interface pour mise à jour ...
Les systèmes de gestion de
contenus (CMS)
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure ...
CMS
Content Management System
Permet la mise en place de sites
dynamiques
Code « prêt à l’emploi »
Interface pour mise...
Référencement et réseaux sociaux
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
Référencement
Visibilité d’un site sur les moteurs de
recherches
Fonctionne par « mots-clés »
Qu’est-ce qu’un site inter...
Page sur un réseau social
Renseigner des informations basiques
(Horaires, adresse, téléphone, etc)
Contact direct avec s...
Page sur un réseau social ou
site web ?
Une bonne page bien alimentée sur un
réseau social peut faire office de vitrine
p...
Questions ?
Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
Prochain SlideShare
Chargement dans…5
×

comment ça fonctionne un site web

1 228 vues

Publié le

Rien de mieux qu'un petit retour aux notions de base !

Publié dans : Formation
0 commentaire
2 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
1 228
Sur SlideShare
0
Issues des intégrations
0
Intégrations
441
Actions
Partages
0
Téléchargements
17
Commentaires
0
J’aime
2
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

comment ça fonctionne un site web

  1. 1. Qu’est-ce qu’un site web ? Formation Strasweb du 23 octobre 2013 Par Anne-Laure Faessel
  2. 2. L’association Strasweb Formations Prestations web Hébergement Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  3. 3. Internet Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  4. 4. Pourquoi un site internet ? 2002 : 16,4 millions d’internautes en France 2012 : 40,2 millions d’internautes en France Population française actuelle : 65,7 millions Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  5. 5. Qu’est-ce qu’internet ? Réseau de télécommunication Par câble ou par Wifi Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  6. 6. La relation client/serveur Le serveur transmet des données au client Le serveur doit être adapté au trafic du site Plus le trafic est important, plus il doit être puissant Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  7. 7. L’hébergeur Met à disposition d’utilisateur des serveurs Gratuit ou payant Différents services inclus ou non dans l’offre Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  8. 8. Le nom de domaine L’« adresse » du site internet Différentes extensions possibles Ex : .fr, .com, .org, etc Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  9. 9. Les navigateurs Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  10. 10. Le navigateur Interprète le code transmis par le serveur Les navigateurs n’interprètent pas tous le code de la même manière Différences d’affichage entre les navigateurs Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  11. 11. Les différents navigateurs du marché Firefox Chrome Internet Explorer Safari Opera Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  12. 12. Parts de marché Part de marché en Europe* (09/2013) Firefox Chrome IE Safari Opera * Source : http://gs.statcounter.com/ Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  13. 13. Firefox Indépendant Puissant Ne récolte pas les données de navigation Supporte les derniers standards Grand choix de plugins Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  14. 14. Chrome Le navigateur de Google Très pratique pour les utilisateurs de produits Google Barre d’adresse hybride Supporte les derniers standards Collecte les données de navigation Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  15. 15. Internet explorer Navigateur par défaut sur Windows Ne supporte pas toujours les derniers standard des langages web Détesté des intégrateurs web ! Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  16. 16. Démonstrations Mettre une page en favori dans la barre de favoris Voir l’historique de navigation Lancer une navigation privée Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  17. 17. Moteurs de recherches Parts de marché en France (12/2012)* Google : 94% Bing : 2% Yahoo : 2% *source : http://www.journaldunet.com Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  18. 18. Démonstrations Recherche sur Google Analyse de la page de résultat Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  19. 19. Les langages du web Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  20. 20. HTML : balisage de la page Langage de balises Deux balises entourent un élément Ex : <h1>Titre de niveau 1</h1> Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  21. 21. Exemple de code HTML Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  22. 22. CSS : mise en forme Se combine au HTML pour donner un aspect particulier aux éléments Peut affecter tous les éléments semblables (titre, paragraphe) Peut affecter des éléments spécifiques (ajout de « class » ou « id ») Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  23. 23. HTML / CSS Ces langages vous intéressent ? Un très bon cours pas à pas : http://fr.openclassrooms.com/mooc/h tml5-css3 Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  24. 24. Langages de programmation PHP : traité côté serveur JavaScript : traité côté client Permettent d’effectuer des traitements sur les page Ex: récupération des données d’un formulaire, identification d’un utilisateur, etc. Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  25. 25. Site statique vs Site dynamique Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  26. 26. Site statique Utilise quasi exclusivement HTML et CSS Toute modification nécessite de toucher au code Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  27. 27. Site dynamique Utilise un langage de programmation Conçu pour être mis à jour régulièrement Interface pour mise à jour des contenus par un utilisateur sans connaissance des langages du web Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  28. 28. Les systèmes de gestion de contenus (CMS) Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  29. 29. CMS Content Management System Permet la mise en place de sites dynamiques Code « prêt à l’emploi » Interface pour mises à jour aisées Ex : Wordpress, Joomla, Drupal, Spip, etc Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  30. 30. Référencement et réseaux sociaux Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  31. 31. Référencement Visibilité d’un site sur les moteurs de recherches Fonctionne par « mots-clés » Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  32. 32. Page sur un réseau social Renseigner des informations basiques (Horaires, adresse, téléphone, etc) Contact direct avec ses clients (dates de congés, questions/réponses) Peut convenir pour un petit commerce Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  33. 33. Page sur un réseau social ou site web ? Une bonne page bien alimentée sur un réseau social peut faire office de vitrine pour un commerce Les réseaux sociaux sont des lieux d’échange. Il faut prendre le temps de communiquer, et répondre aux commentaires Risque de donner une mauvaise image si page « morte » Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel
  34. 34. Questions ? Qu’est-ce qu’un site internet ? – Formation Strasweb du 23/10/2013 – Anne-Laure Faessel

×