Internet, créer son site personnel. - Yves Cornil
Transcription
Internet, créer son site personnel. - Yves Cornil
Plan • • • • • • • • • • • t, rne ite e t In ns o s l. er cré sonne per Yves Roger Cornil Microcam06, Fréjus Vous Accueille Créer son site Internet 7 mars 2005 Pourquoi publier sur Internet 2 Avant de créer son site. • Vous commencez à être un utilisateur averti d'Internet. • Vous avez une passion et vous voulez la partager. • Vous animez une association et vous voulez utiliser ce moyen moderne de communication. • Bref, il y plein de bonnes raisons pour franchir le pas pour devenir un acteur et plus seulement un consommateur d'Internet. Créer son site Internet Pourquoi publier sur Internet? Quelques prérequis et quelques logiciels Combien ça coûte? Rappels sur Internet Quelques modèles de pages Construction de pages Créer des pages avec Microsoft Word Vous aviez dit HTML? Le transfert des fichiers Quelques réalisations personnelles Et pour suivre … 3 • Prendre un abonnement à un fournisseur d'accès Internet, payant ou gratuit, qui vous met à disposition un espace disque (généralement 100 Mo) pour héberger votre œuvre. • Il vous faut ensuite un logiciel de création de pages HTML. • Et des logiciels complémentaires. • Créer des pages personnelles sur Internet, c'est d'abord de la créativité, du bon goût avant d'être de l'informatique de haut niveau. Créer son site Internet 4 Logiciels pour créer des sites Internet Quelques logiciels complémentaires Logiciels généralistes (traitement de texte) ou logiciels spécialisés. • Quelques logiciels généralistes: - AppleWorks, Microsoft Word, Microsoft Publisher, OpenOffice, Star Office… • Quelques logiciels spécialisés: - Dreamweaver, Freeway, FrontPage, Adobe Golive, HomeSite, NamoWeb Editor, Netscape Composer, WebExpert… • Traitement des images : - Graphic Converter (Mac), PaintShop Pro (PC), PhotoShop (Mac ou PC), PhotoShop Elements (Mac ou PC)… • Création de Gif’s animés: - AnimationShop (avec Paint Shop Pro), e-Picture Pro (Mac ou PC) • Eventuellement FTP : - Cute-FTP (PC), Fetch (Mac), FTP Expert (PC)… • Si vous créez des sites avec des animations sophistiquées : - Macromedia Flash … Créer son site Internet 5 Créer son site Internet 6 1 Combien coûtent quelques logiciels généralistes? Mais combien ça coûte? Créer son site Internet 7 Combien coûtent quelques logiciels spécialisés? Web Studio créateur 2 (PC) 29 € Namo Web Editor 6 (PC) 129 € Adobe Golive cs (Mac ou PC) 572 € Dreamweaver 2004 570 € FrontPage 2003 273 € Créer son site Internet Word 2003 (PC) 310 € Word 2004 (Mac) 320€ Publisher 2003 (PC) 232 € OpenOffice (PC ou Mac) 0€ Créer son site Internet 8 Généralités sur Internet • Internet est un réseau mondial d'ordinateurs interconnectés (Web, toile) • accessible, généralement, par l'intermédiaire d'un Fournisseur d’Accès Internet (F.A.I.) • au prix de communications téléphoniques locales (avec éventuellement des forfaits) • ou d’une connexion ADSL. 9 Quelques chiffres sur Internet Créer son site Internet 10 Sauter le pas… • 24,14 millions d’internautes en France (janvier 2005 source JDN) • 7,64 millions de foyers ont une connexion Internet (12/2004 source JDN) • Dont 6,5 millions de connexions au haut débit • Vous vous lancez, vous faites, vous refaites vos pages, vous téléchargez des logiciels des éditeurs , vous glanez des images Gif et Jpeg, des sons, des plugins ... bref vous passerez beaucoup de temps. • Mais le métier de graphiste ne s'invente pas... (1/2005 source JDN) Créer son site Internet 11 Créer son site Internet 12 2 Demander des conseils Quelques modèles de pages • Vous aurez un avantage certain si vous faites partie d'un club micro-informatique, tels que les clubs Microcam ou Fréjus Vous Accueille. • A plusieurs, c'est plus facile et il y a toujours quelqu'un pour vous donner le bon conseil. Créer son site Internet 13 Créer son site Internet 14 Quelques modèles de pages (suite) Quelques modèles de pages Page avec cadres Page sans cadres Créer son site Internet 15 Quelques modèles de pages (suite) Créer son site Internet 16 Quelques modèles de pages (suite) Page appelant un document PDF Page avec zones sensibles (mappage). Créer son site Internet 17 Créer son site Internet 18 3 Quelques modèles de pages (suite) Quelques modèles de pages (suite) Page contenant des adresses. Page utilisant des tableaux Créer son site Internet 19 Créer son site Internet Construction des pages Composition d’une page. • • • • • • • Créer son site Internet 21 texte avec Golive Créer son site Internet 20 Une page est composée: d'un titre (facultatif) Du texte D’un fond Des images (fixes ou animées) des liens, sur du texte, sur des images, des fichiers … Des sons (.wav, realplayer, midi), des films (QuickTime, Avi, Divx…). Créer son site Internet 22 texte avec Namo Web Editor 3.0 23 Créer son site Internet 24 4 Le fond d’une page Les images • Pour agrémenter vos pages insérez une image de fond ou une couleur. • L'image sera en général une petite image (en format Gif ou jpeg) qui se multipliera sur votre page telle une mosaïque. • Attention à ce que l'image ne rende pas difficile la lecture de votre page. Créer son site Internet 25 Le poids des photos • Les navigateurs Internet acceptent les images en format: • Jpeg (.jpg) ou Png (.png) pour les photos -16 M couleurs • Gif (.gif) pour les images - 256 couleurs. - gif progressif • - gif animé Créer son site Internet 26 Quelques gif’s animés • Veillez à minimiser la taille (en kilo-octets) de vos images. • Pour l’affichage des images réduisez la définition des images (72 ou 96 pixels par inch). • Réduisez la grandeur des images et choisissez un bon taux de compression. • Utilisez des logiciels spécialisés (Graphic Converter, PaintShop Pro, PhotoShop …). Créer son site Internet 27 Créer son site Internet Les liens. Créer un lien • Les liens permettent d’afficher une autre page, de votre site ou vers un autre site Internet. • Ou une image, une vidéo… • Dans le cas de texte, le lien est généralement visible au niveau de la couleur (violet) • La flèche de la souris se transforme, généralement,en main Créer son site Internet 28 29 Avec Namo Web Editor 3 Créer son site Internet 30 5 Exemple d’un lien sur une photo Créer son site Internet un lien (suite) 31 33 Créer une page avec Microsoft Word Pour insérer une image, placez le curseur à l’endroit désiré de votre document, puis allez dans le menu insertion image à partir d’un fichier ou images de la bibliothèque de Word (clip art). Créer son site Internet 32 Créer une page avec Microsoft Word un lien (suite) Créer son site Internet Créer son site Internet 35 Créer son site Internet 34 Créer une page avec Microsoft Word Vous pouvez créer des liens aussi bien sur du texte que sur des images Pour insérer un lien hypertexte sur une image, sélectionnez l’image puis allez sur le menu insertion lien hypertexte. Vous pouvez aussi utiliser la commande ctrl k Créer son site Internet 36 6 Créer un lien avec Microsoft Word Sauvegarder le fichier HTML avec Microsoft Word Pour transformer votre document Word en format html, il suffit de l’enregistrer en tant que page Web. Vous entrez le nom du fichier (ici oepop1.gif) ou vous passez par le menu document de la boîte de dialogue insérer un lien hypertexte. Vous pouvez aussi insérer une info-bulle qui sera affichée par le navigateur Microsoft Internet Explorer mais aussi avec Microsoft Word. Créer son site Internet 37 Créer un fichier PDF avec Microsoft Word version X Créer son site Internet 38 Vous avez dit HTML ? <html> <head> <title>MICROCAM06 - Page d'accueil de MICROCAM06</title> </head> <body bgcolor="#ffffff" background="images/f-osx.jpg"> <p><img src="images/bandm61.gif" alt="image Microcam" align="bottom" width="500" height="59" naturalsizeflag="3"> <br> <b><font color="#af0000" size="+1" face="Arial">Clubs Microcam clubs de micro-informatique du </font></b><font size="+1" face="Arial"><a href="http://www.ca-pca.fr/">Crédit Agricole </a></font><br> <font face="Arial"><a href="http://www.augfrance.com/Microcam06">Nice</a></font><font color="#af0000" face="Arial"> - </font><font face="Arial"><a href="http://www.augfrance.com/Microcam35">Rennes</a> </font><font color="#af0000" face="Arial">- Caen - </font><font face="Arial"><a href="http://www.Microcam29.net/">Quimper</a></font> </p> <p><b><font color="#af0000" size="+2" face="Arial">Bienvenue à Microcam06 - Nice</font></b><br> Créer son site Internet 39 Transférer ses pages sur Internet Créer son site Internet 40 Exemple d’un FTP - Fetch • Pour transférer ses pages personnelles on utilisera un logiciel de transferts de fichiers (FTP) • Ou, mieux, on utilisera les fonctions de transferts (publier) de son logiciel de création de pages. Créer son site Internet 41 Créer son site Internet 42 7 Exemple d’un FTP - Fetch Exemple d’un FTP - Namo Web Editor 3 Créer son site Internet 43 Quelques adresses Créer son site Internet 44 NamoWebEditor 3.0 Pages personnelles sur Wanadoo: http://perso.wanadoo.fr/frejusva http://perso.wanadoo.fr/forum-julii/ Pages personnelles sur Free : http://yves.cornil.free.fr Adresse avec nom de domaine http://www.cornil.com Adresse comprise dans un nom de domaine: http://www.augfrance.com/Microcam06 Créer son site Internet 45 NamoWebEditor 3.0 - Page vide Créer son site Internet Créer son site Internet 46 NamoWebEditor 3.0 - menu fichier 47 Créer son site Internet 48 8 NamoWebEditor 3.0 - une page Créer son site Internet NamoWebEditor 3.0 - insertion d’une image 49 NamoWebEditor 3.0 - insertion d’une image Créer son site Internet 50 NamoWebEditor 3.0 - insertion d’une image 51 NamoWebEditor 3.0 - insertion d’une image Créer son site Internet Créer son site Internet Créer son site Internet 52 NamoWebEditor 3.0 - Publier sur Internet 53 Créer son site Internet 54 9 CuteFTP NamoWebEditor 3.0 - Publier sur Internet Créer son site Internet 55 CuteFTP Créer son site Internet 56 CuteFTP 57 CuteFTP Créer son site Internet Créer son site Internet Créer son site Internet 58 CuteFTP 59 Créer son site Internet 60 10 Pour suivre… TP 54 Le Monde est à vous … Créer son site Internet 62 11