24/03/2006 Création de site web - Club Informatique Saintongeais 1 La création de sites web perso sur internet

24/03/2006 Création de site web - Club Informatique Saintongeais 2 Plan général  Rappel de quelques définitions :  L’internet et Le web  Une page web - Un site web  Les architectures générales :  Les pages web créées « en dur » (statiques)  Le pages web générées dynamiquement  Les Blogues  Présentation générale  La création d’un Blogue  Les sites perso « classiques »  Les étapes pour créer un site,  Le Choix d’un logiciel Editeur HTML  La publication du site chez l’hébergeur

24/03/2006 Création de site web - Club Informatique Saintongeais 3 Internet : c’est Quoi ?  Un réseau informatique mondial reposant sur un système d’adresses TCP/IP (Transmission Contrôle Protocole/Internet Protocol), chaque ordinateur ayant une adresse IP unique (origine : année 72)origine  Un réseau des réseaux chargé de transporter des données selon différents protocoles de communication :  HTTP pour le web,  HTTPS pour le web en mode sécurisé,  FTP pour le transfert de fichiers,  SMTP pour envoyer des s,  ICQ pour dialoguer en ligne,  NNTP pour accéder aux forums de discussion,  P2P pour partager des fichiers,  SSH pour la sécurité,  Et bien d’autres…

24/03/2006 Création de site web - Club Informatique Saintongeais 4  Le Web est une abréviation de World Wide Web ou WWW (la toile mondiale) créé dans les années 89/90 (CERN Suisse),  Le Web est un système hypertexte réparti sur Internet qui permet de consulter, avec un navigateur Web, les pages Web mises en ligne dans les sites Web,  L'image de la toile vient des hyperliens qui lient les pages Web entre elles, ils peuvent être suivis pour passer automatiquement d'une page à une autre.

24/03/2006 Création de site web - Club Informatique Saintongeais 5  La Page Web est l’unité de consultation du Web, un document informatique accompagné de texte, images, son, vidéo…  Un document présenté dans des langages reconnus par les navigateurs, exemple : HTML ( Hypertext Markup Language), XML, PHP, etc…langages  La Page Web contient des liens hypertextes, elle s’accompagne donc d’autres ressources : texte, multimédia, etc…

24/03/2006 Création de site web - Club Informatique Saintongeais 6  On distingue les sites ayant des pages web :  statiques : les pages web sont créées par des éditeurs HTML  dynamiques : les pages web sont générées chez l’hébergeur (Blog, CMS)CMS  Un site web est un ensemble de pages web constituées de fichiers créés ou générés en HTML et des ressources multimédia, CMS = Content Management System = système de gestion de contenu en ligne

24/03/2006 Création de site web - Club Informatique Saintongeais 7 Un créateur du site (Webmaster) Un Hébergeur du site stocke ou génère les pages web L’internaute consulte les pages web Le FAI de l’internaute Architecture générale des sites web

24/03/2006 Création de site web - Club Informatique Saintongeais 8 Le créateur du site Hébergeur du site Fabrique les pages HTML à l’aide d’un Editeur Publie les pages HTML chez l’hébergeur à l’aide d’un logiciel FTP L’internaute Télécharge et visualise les pages web avec son navigateur FAI Un site Web avec pages statiques

24/03/2006 Création de site web - Club Informatique Saintongeais 9 Le créateur du site Hébergeur du site Alimente une base de données en ligne chez l’hébergeur avec un outil d’administration du site (CMS) Le robot de l’hébergeur génère les pages web demandées par l’internaute L’internaute Télécharge et visualise les pages web avec son navigateur FAI Un site Web avec pages dynamiques

24/03/2006 Création de site web - Club Informatique Saintongeais 10 La création d’un « Blogue »

24/03/2006 Création de site web - Club Informatique Saintongeais 11  On distingue différents usages :  Le blogue introspectif : journal perso…  Le blogue d’opinion : militantisme…  Le blogue pro/techno : thèmes divers  Le blogue à part : ovni du web Apparus fin 1997 aux USA, journal intime, coup de gueule ou sélection de l'actualité, les weblogs ou blogues sont un type de site perso. Ils se sont vraiment développés après le 11 septembre 2001, grace à la facilité de création et de publication en ligne.

24/03/2006 Création de site web - Club Informatique Saintongeais 12 Comparatif des outils disponibles sur le web :

24/03/2006 Création de site web - Club Informatique Saintongeais 13 1 – Saisir le nom du site 2 – S’inscrire 3 – Paramétrer les services 4 – Remplir le site Exemple : en ligne sur le site Résultat : un nouveau site : INFODUWEB

24/03/2006 Création de site web - Club Informatique Saintongeais 14 S’inscrire

24/03/2006 Création de site web - Club Informatique Saintongeais 15 S’inscrire

24/03/2006 Création de site web - Club Informatique Saintongeais 16 Remplir le site

24/03/2006 Création de site web - Club Informatique Saintongeais 17 Remplir le site

24/03/2006 Création de site web - Club Informatique Saintongeais 18 Aperçu avant envoi

24/03/2006 Création de site web - Club Informatique Saintongeais 19 Design 1

24/03/2006 Création de site web - Club Informatique Saintongeais 20 Choix du design Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 21 Choix du design Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 22 Choix du design Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 23 Choix du design Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 24 Choix du design Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 25 Choix d’une radio Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 26 Choix d’une radio Par l’internaute

24/03/2006 Création de site web - Club Informatique Saintongeais 27 La création d’un site perso classique

24/03/2006 Création de site web - Club Informatique Saintongeais 28  La réalisation du site :  Les objectifs : se vendre (cv), informer, vendre…  Le choix du public : jeunes, seniors, hobby,…  Le choix du contenu : selon centre d’intérêt  Le choix de la forme : navigation, charte graphique,…  L’ergonomie : selon les attentes du public choisi L’ergonomie  La Conception pour bien définir :  L’architecture : pages statiques ou dynamiques  Les outils : éditeurs (texte ou wysiwing) ou CMS  La publication du site (mise en ligne)  La promotion du site : référencement, maj

24/03/2006 Création de site web - Club Informatique Saintongeais 29  Editeurs fournis avec windows : notepad, wordpad…  Editeurs freewares sharewares : HtmlEdit,… LinternauteLinternaute  Editeurs gratuits Non WYSIWYG :  Editeurs gratuits et WYSIWYG :  FrontPage Express 2.0, Dreamweaver (démo)  Editeurs freewares sharewares : Nvu, Web Construction Kit,…  Editeurs commerciaux spécialisés :  Macromédia Dreamweaver MX,  Microsoft FrontPage,  Et autres outils Microsoft : (non recommandés)  Word, Publisher, PowerPoint etc… (WYSIWYG = What You See Is What You Get = Ce que vous voyez est ce que vous obtenez)

24/03/2006 Création de site web - Club Informatique Saintongeais 30 Voici comment sont imbriqués les conteneurs : C’est la 1 ère ligne du fichier HTML C'est le conteneur de l'entête. ici seront les « métatags » titre, mots clés,… C'est le conteneur du corps. XXXX ici sera le texte vu par les internautesXXXX C’est la dernière ligne Le HTML (HyperText Markup Language) est un langage de balisage pour la publication en hypertexte sur le Web.HTML

24/03/2006 Création de site web - Club Informatique Saintongeais 31 Il existe des centaines de logiciels FTP, gratuits le plus souvent, pour transférer un site web et ses mises à jours, sur le site de l’hébergeur. Le shareware TOTAL COMMANDER intègre cette fonction FTP. Téléchargement sur le site :

24/03/2006 Création de site web - Club Informatique Saintongeais 32

24/03/2006 Création de site web - Club Informatique Saintongeais 33

24/03/2006 Création de site web - Club Informatique Saintongeais 34 vers l’Hébergeur (Free)de chez le Webmaster (Chaniers) Publication du site :

24/03/2006 Création de site web - Club Informatique Saintongeais 35 Le but premier du référencement est de générer du trafic ciblé sur un site afin d'augmenter sa visibilité auprès des internautes francophones et internationaux Le référencement sur les annuaires et moteurs de recherche est devenu un métier, nécessitant une méthodologie.méthodologie L’indice de popularité (Pagerank chez Google) nécessite quelques règles :  Optimiser chaque page pour le référencement,chaque page  Contenu de qualité pour être très référencé  Echanges de liens ou de bannières,  Site très actualisé sans liens brisés,

24/03/2006 Création de site web - Club Informatique Saintongeais 36 Perpsectives d’avenir avec l’arrivée du web 2

24/03/2006 Création de site web - Club Informatique Saintongeais 37 Conçu comme un grand livre à l’échelle mondiale, le web 1.0 s'est contenté de reproduire les modèles connus de l'édition papier. Le web 2.0 transforme le web en une gigantesque base de données. L'arrivée à maturité des technologies XML et une meilleure compréhension du web transforment la Toile en un gigantesque réseau de sources d'information structurées et de services, jetant les bases d'une plate-forme de développement planétaire. Les progrès technologiques de ces dernières années ne sont pas les seules ferments de cette évolution. Les internautes ont changé. Plus nombreux, connectés en haut débit, ils s'impliquent de plus en plus dans la création de «leur» réseau : ils ne se contentent plus de lire, mais publient aussi des données. Web 1.0Web 2.0 Leaders du web :Entreprises, marchandsInternautes Profil de l'internaute :PassifActif Interactivité perçue : Sélection et lecture d'information Sélection, lecture et publication de données Unité de recherche :Mot-cléTag

24/03/2006 Création de site web - Club Informatique Saintongeais 38 Bonne Publication sur le web et Au plaisir de vous lire bientôt !

24/03/2006 Création de site web - Club Informatique Saintongeais 39 Merci de votre attention