Construction d un Site Internet Cours 1 : Notions de base UCO - IPLV Emmanuel Planas UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 1
Plan Qu est-ce qu un site Internet (SI)? Introduction Réseau Internet Site Statiques / Dynamiques Les CMS Les Wikis Le fournisseur d accès Internet (FAI, IAP, ISP) Les Hébergeurs de site Internet Notion de domaine Internet Les Outils Éditeurs d images Éditeurs de pages HTML Les grandes étapes de la construction d un SI Sur PPT HTML Revue de bases HTML Premier site hyper simple Construction de deux pages HTML liées Transfert sur site UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 2
Qu est-ce qu un site Internet? UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 3
Introduction On peut comparer un site Internet à une maison de ville desservie par le train : La maison (site) avec ses pièces (ses pages) est un répertoire de pages HTML liées entre elles La ville héberge ce site et les met à disposition sur le réseau Internet (réseau ferré) L adresse de la maison correspond à l adresse Internet vers laquelle on se dirige pour accéder au site Internet Un aiguilleur Internet, le serveur DNS dirige vers l hébergeur (ville), puis le site (maison) Le réseau Internet correspond au réseau ferré UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 4
Réseau Internet UCO Ecran Clavier Ordinateur serveur Ordinateur d un collègue Ordinateur réseau Disque dur UC Fournisseur d Accès Internet Serveur Proxy Internet Hébergeur Internet Ordinateur police www.tf1.fr Serveur DNS Disque dur Pages de votre site UC UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 5
Le site Internet Un site internet est un répertoire de pages HTML liées entre elles. Il y a plusieurs types de sites : Les Sites Statiques Les pages sont créées et déposées par avance sur le site Internet Lorsque l on demande l affichage du «code HTML» de ces pages, ont «voit» l ensemble du contenu affiché sur le site. Les Sites Dynamiques Les pages sont créées au moment où elles sont consultées (à la volée). Lorsque l on demande l affichage du «code HTML», ont «ne voit pas» l ensemble du contenu affiché sur le site. Des textes sont remplis par des logiciels au moment de la consultation («à la volée») On y voit le code de scripts qui remplissent ces textes UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 6
Sites Statiques Les pages sont donc créées à l avance et ne changent pas tant que le créateur ne les modifie pas Exemple de site statique : http://www.alp-traduction.fr/ UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 7
Sites dynamiques La structure globale des pages est fixée, mais le contenu est fabriqué à chaque consultation (à la volée) Le contenu provient de bases de données qui sont interrogées par des programmes de type PHP, ASP, PERL, JAVASCRIPT Exemples de sites dynamiques : www.lemonde.fr http://www.angers.fr/ UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 8
Site dynamique Interactifs Certains sites sont dynamiques et peuvent changer sous l action de l internaute Ces sites sont de deuxième génération Web 2 (utilisation de techniques «Ajax»). Exemple : Google Agenda Facebook UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 9
CMS et WIKI Content Management System (CMS) Logiciel informatique qui permet de gérer un système d information (édition et publication d un site Internet, documents, bases de données, mails, agenda,...) WIKI Un type particulier de CMS Utilise les technologies Web 2 pour permettre l édition directement en ligne du contenu du site Internet (depuis n'importe quel ordinateur connecté sur Internet) Le plus connu : Wikipedia UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 10
Fournisseur d Accès Internet (FAI) Le Fournisseur d Accès Internet est un organisme qui : Donne accès à Internet via l un de ces types de connexion : Filaire : un réseau de fils physiques est utilisé réseau téléphonique (Modem 56K, RNIS (Réseau numérique à intégration de services), xdsl dont l'adsl, Câble (Modem câble, FTTH, T-carrier : T1, T2, T3) Optique réseau de fibres optiques Hertzien (sans fils) Téléphone portable Bornes terrestres d émission (Wifi, WinMax) Satellite Il se connecte à la sortie de votre maison / entreprise / université / organisme Fournisseur d Accès Internet (FAI) se dit en anglais : Internet Access Provider : IAP ou Internet Service Provider : ISP UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 11
Réseau Internet UCO Ecran Clavier Ordinateur serveur Ordinateur d un collègue Ordinateur réseau Disque dur UC Fournisseur d Accès Internet Serveur Proxy Internet Hébergeur Internet Ordinateur police www.tf1.fr Serveur DNS Disque dur Pages de votre site UC UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 12
Hébergeurs Internet Un hébergeur Internet est un organisme qui : Héberge des pages HTML Gère les noms de domaines Internet (uco.fr, europa.eu, gouv.fr, tf1.com), en utilisant des organismes officiels Fournit d autres services : Messagerie, sauvegarde des pages, etc. UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 13
Quelques noms d hebergeurs Certains FAI font office d hébergeur : Orange, SFR, Free, Noos,. Hébergeurs purs Gandi OVH Amen Voir liste sur : http://www.hebergementweb.org/ UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 14
Notion de domaine Internet Un domaine Internet, c est : un nom composé de deux parties : Le corps : tf1, uco, elsevier L extension :.fr,.com,.org,.eu,.net,.es,.jp,.cn Ex : uco.fr, tf1.com, ntt.co.jp, europa.eu La propriété de ce nom Les domaines Internet sont gérés par des organismes spécifiques : AFNIC en France Les hébergeurs Test sur Amen ou OVH : aller sur site pour «essayer» un nom de domaine. UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 15
Les grandes étapes classiques de la création d un site Internet Définir qui sera l hébergeur Louer son domaine et contrat d hébergement Paramétrer l environnement d hébergement (Administration de son site) Définir la structure de son site Création des pages Envoi des pages Maintenance en modifiant en local et rechargeant les pages UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 16
Les grandes étapes de la création d un site Internet avec un CMS Définir qui sera l hébergeur Acheter son domaine et contrat d hébergement Paramétrer l environnement d hébergement (Administration de son site) Installer son CMS / Wiki Définir la structure de son site Création des pages Modifications en ligne à volonté UCO - IPLV - E. Planas - Master - Site Internet - Cours 1 - eplanas@uco.fr 17