Mon site Internet Un voyage en quatre étapes

Transcription

1 Mon site Internet Un voyage en quatre étapes

2 Bienvenue au SWITCH Junior Web Award Formidable, que tu participes au SWITCH Junior Web Award! Nous te souhaitons beaucoup de succès dans la préparation de ton propre site Web. Tu vas élaborer avec ta classe ton propre site et le mettre sur Internet. Cette brochure te servira de guide pendant les quatre étapes du projet. Elle te montrera la voie, te donnera des tuyaux précieux et te mettra en garde contre les dangers. Tu trouveras d autres informations plus détaillées sur Les mots soulignés sont expliqués en dernière page. [>] Lorsque ce symbole apparaît, tu trouveras d autres informations et liens sur le sujet sur Tu trouveras aussi dans cette brochure des sujets dont tu n as pas du tout à t occuper pendant le concours, comme l enregistrement du nom de domaine, le choix du fournisseur d hébergement et la question des coûts. Tu peux donc consulter cette brochure si tu souhaites une fois créer un site Web pour toi-même. Éditeur: Direction du projet: SWITCH MKR Consulting AG Concept, conception, textes et illustrations: Atelier Ursula Heilig SGD Nous te souhaitons un voyage passionnant et nous réjouissons de voir ton site sur Internet!

3 Mon site Internet Un voyage en quatre étapes 1 Idée Définir et décider: 2 Planification Sujet Public Objectif Contenu Fonctions Structure Temps nécessaire et délais: Recherche Textes Images Conception du site Internet Programmation Dernier délai 3 Exécution Tâches et travaux: 4 Programmation Prendre des informations: Nom de domaine Offres d hébergement Coûts Recherche Rassembler du matériel Écrire des textes photographier et dessiner Scanner Concevoir des pages enregistrer le nom de domaine Choisir le fournisseur d hébergement Assemblage et réalisation: Construire les pages Introduire des textes introduire du matériel photographique programmer des fonctions Tester, tester, tester! Mettre le site Internet sur le réseau Durée du projet idée Planification Exécution Programmation

4 Quel est maintenant l objectif de ton site Internet? Il doit offrir aux visiteurs autant d informations que CHECK- LISTE Définir et décider: Sujet Public Objectif Contenu Fonctions Structure Idée De quoi mon site Internet doit-il traiter? A qui est-il destiné? Quel est son but? Que doit-il contenir? Quelles fonctions souhaitais-je y intégrer? Combien de pages faudra-t-il pour cela? Et comment ces pages doivent-elles être disposées? Pour ton site Internet, il te faut avant tout une bonne idée, un sujet intéressant. Cela peut être n importe quoi: tu peux par exemple faire une page Internet sur les loups-garous ou bien pour présenter tes propres bandes dessinées. Tu peux proposer des cours d aide en algèbre ou mettre ton arbre généalogique sur le réseau. Tu dois alors te demander qui s intéresse à ce sujet. C est ton groupe-cible. Supposons que tu fasses un site Internet sur les pirates. Tous ceux qui s intéressent aux pirates feront partie de ton public. C est là un très grand groupe-cible: on y trouvera un historien aussi bien qu une élève de sixième classe qui vient de voir «Pirates of the Carribean». possible sur le sujet «Pirates». Il en découle le contenu: l historien voudrait savoir quelque chose sur l histoire de la piraterie, l élève de sixième veut voir de belles photos de Jack Sparrow alias Johnny Depp. Un autre visiteur s intéresse aux pirates d aujourd hui ou est à la recherche d un authentique drapeau pirate. Et c est là que les fonctions entrent en jeu. Peut-être quelqu un veut-il échanger un drapeau pirate contre un couteau d abordage? Si tu proposes sur ton site Internet un «panneau d affichage», les visiteurs pourront y placer des offres d échange et d achat. Ou bien tu peux préparer une page avec des chants pirates que l on peut télécharger, et installer un forum sur lequel les fans des pirates puissent discuter de leur sujet préféré. Une fois que ta liste de contenus et fonctions est complète, il te faut déterminer la structure de ton site Internet. Réfléchis à la manière de classer les thèmes et au nombre de pages dont tu as besoin pour cela. Chaque page de thème peut contenir autant de sous-pages que l on veut qui mènent peut-être à leur tour à d autres pages. La structure doit être aussi logique que possible afin que les visiteurs puissent s y retrouver sans problèmes sur ton site. Voici un projet de structure d un site: tuyaux Pour des sujets vastes, il vaut souvent mieux se concentrer volontairement sur un domaine particulier. Des fonctions comme le livre d or ou le forum existent tout prêts et gratuits sur Internet. Au lieu d une programmation compliquée, il suffit d insérer ou de faire des raccourcis! [>] Attention Un site Internet est public! Tout le monde peut voir ce que tu mets sur le réseau. Songes-y en utilisant des images et informations privées! [>]

5 Ne sous-estime pas non plus le travail nécessaire à la programmation, peu importe que tu sois encore CHECK- LISTE Temps nécessaire et délais: Recherche Textes Images Conception du site Internet Programmation Dernier délai Prendre des informations: Nom de domaine Planification Fixe des délais! Combien de temps me faut-il pour les recherches, les textes, les images, la conception et la programmation? Quand mon site Web doit-il être mis sur le réseau? Mon nom de domaine souhaité est-il encore libre? Quel hébergeur a la meilleure offre pour moi? Combien tout cela coûtera-t-il? Pour ne pas bricoler indéfiniment sur ton site, il te faut un programme. Quant à ce que ton site doit contenir, tu l as déjà fixé à la première étape. Et maintenant, fais une liste de toutes les pages de thème et sous-pages (selon la structure) et note pour chaque page ce dont tu as besoin: informations, images, graphiques, textes tu peux maintenant estimer le temps qu il te faudra pour les différents travaux et te fixer un délai pour chaque tâche. inexpérimenté en matière de site Internet ou déjà un vieux renard. Et enfin, fixe le tout dernier délai: le jour où ton site Internet sera mis en ligne! Jusqu à cette date, tu dois avoir enregistré un nom de domaine et choisi un hébergeur. Réfléchis donc à un nom convenant à ton site. Tu pourras voir sur si le nom est encore libre. C est là également que tu le feras enregistrer à la prochaine étape. Pour que ton site puisse apparaître sur Internet, il doit être enregistré sur un serveur Web. Pour cela, il te faut un hébergeur qui mette à ta disposition la place nécessaire sur son serveur Web et veille à ce que ton site soit accessible 24 heures sur 24. Il y a énormément d hébergeurs et ils ont des offres très différentes. Beaucoup ou peu de place de mémoire, une ou dix adresses , avec ou sans programme de conception du propre site Web. Il est donc très important de bien t informer avant de choisir ton hébergeur. Un programme bien conçu vaut son pesant d or! Un tuyau Un nom de domaine, c est comme une plaquette sur une porte: on doit pouvoir y lire qui attend derrière la porte. En outre, il doit être simple et court, bien lisible et facile à mémoriser. Attention Le nom de domaine et l hébergement coûtent de l argent! Calcule d abord combien ton site Internet va te coûter chaque année. [>] Offres d hébergement Coûts Ton site devra être de bonne présentation! Même le meilleur contenu n a aucun succès s il est mal emballé. Prévois donc suffisamment de temps pour la conception de tes pages, c est tout aussi important que les textes et images!

6 Fais attention en téléchargeant des objets sur le réseau, lors de tes tournées de navigation, pour les utiliser CHECK- LISTE Tâches et travaux: Recherche rassembler du matériel Écrire des textes photographier et dessiner Scanner Concevoir des pages enregistrer le nom de domaine Choisir le fournisseur d hébergement Exécution Tout d abord, je réunis du matériel de diverses sources et le trie. J écris mes propres textes, je photographie et je dessine mes images. Ensuite, je scanne tout ce qui n est pas encore sous forme électronique. Je conçois les différentes pages du site. En outre, j enregistre mon nom de domaine et choisis un hébergeur. Dans cette étape, il te faut tout d abord faire beaucoup de recherches: vas à la bibliothèque, entretiens toi avec des gens qui ont quelque chose à dire à ce sujet, demande à des associations ou autres services compétents de t envoyer des informations Bien entendu, tu peux aussi rechercher directement sur Internet, mais attention: outre beaucoup d informations correctes, tu y trouveras aussi des indications imprécises ou même fausses! Va voir d autres sites sur le même sujet. Tu pourras ainsi comparer ton propre projet à des sites déjà existants. Tu verras ce que d autres font bien et ce qu ils font moins bien. Tu apprendras ainsi d eux et éviteras des erreurs. sur propre site. Tu dois d abord obtenir la permission du propriétaire. D une manière générale: si tu utilises du matériel de tiers, qu il soit pris dans des livres, sur Internet ou ailleurs, tu dois publier sur ton site une liste avec indication des sources! Ceci est valable aussi pour la musique. Si tu fais tout toi-même sans copier sur Internet, tu as sans doute plus de travail mais en revanche un site unique en son genre, pas de problèmes juridiques et pas de coûts non plus, car tout ce qui se trouve sur Internet n est pas gratuit, et de loin! Par la conception des pages, tu donnes à ton site un visage. N oublie pas que ton site ne doit pas plaire qu à toi mais aussi à ton public-cible! Ne te laisse pas tenter par les «péchés de site Web»: Les écritures peu ordinaires sont peut-être originales mais difficiles à lire et causent souvent des problèmes. Les couleurs sont belles mais trop de couleurs, surtout des couleurs trop vives font mal aux yeux. Dans le programme graphique, tu peux bricoler d amusants logos, boutons et bannières mais ici encore: il ne faut pas exagérer! Couche tes idées de conception sur papier! tuyaux Il y a sur Internet des banques de données gratuites pour images, musique et vidéos. La copie y est expressément permise et même souhaitée. Tu trouveras aussi de telles adresses gratuites pour des Gifs (animés). [>] Dans le domaine d Internet, il y a de nombreuses professions passionnantes car tout le monde ne veut pas faire son site Internet lui-même. Dans ce cas, des professionnels assument le travail de réflexion, de conception et de programmation.

7 En insérant des images et graphiques, il y a quelques règles à observer: stocker les photos et les grands CHECK- LISTE Assemblage et réalisation: Construire les pages Introduire des textes introduire du matériel photographique programmer des fonctions tester, tester, tester! Mettre le site Internet sur le réseau Programmation Je construis mes pages au moyen d un éditeur HTML, j y ajoute du matériel de texte et d image et je programme les fonctions. Enfin, je teste chaque page, si possible avec différents navigateurs. [>] Ensuite, je dois simplement encore supprimer quelques erreurs et enfin je mets mon site en ligne! Les sites Web sont écrits en un code particulier (HTML) afin de pouvoir être mis sur Internet. Mais il n est pas nécessaire d apprendre la programmation pour cela. Dans un éditeur HTML approprié, tu peux concevoir ton site comme dans un programme graphique, sans te préoccuper du code. On peut acheter des éditeurs HTML sous forme de vastes programmes de lay-out. Mais peut-être as-tu choisi une offre d hébergement dans laquelle un programme d établissement du site est déjà compris. Autrement, tu trouveras sur Internet du logiciel gratuit de conception à télécharger. [>] graphiques multicolores en.jpg, les petits graphiques avec peu de couleurs en.gif. Les différents fichiers ne doivent pas avoir plus de 100 kilo-octets, autrement ton site sera trop lent! Dès que ton site est (ou paraît) terminé, passe à la phase de test: bien relire encore une fois tous les textes n y a-t-il plus d erreur? Contrôler tous les liens sont-ils actifs et aboutissent-ils à la page voulue? Tester également toutes les fonctions que tu as introduites, certaines ne fonctionnent que lorsque tu es on-line avec ton site. Alors, tout est parfait? C est maintenant la minute de vérité: charge tout le site avec tous les fichiers HTML, images, graphiques, PDFs, etc. sur le serveur Web de ton hébergeur. Ensuite, vas sur Internet et appelle ton site pour la première fois. Dès qu il apparaît, tu peux te réjouir: ton propre site Internet est en ligne! Pour terminer, un dernier bon conseil: rien de plus ennuyeux qu un site désuet! Actualiser, compléter, modifier, renouveler tels sont les mots magiques de l entretien d un site. Un site «oublié» n est bientôt plus visité par personne. La vue de layout et de code en éditeur HTML. Un tuyau Fait connaître ton site web: Occupe-toi de l optimisation du moteur de recherche. [>] Echange des liens avec des sites ayant des thèmes similaires et propose à tes amis de relier leur site au tien. Tu peux également attirer l attention via les médias sociaux en introduisant des boutons de commande «j aime». Attention Tout programme que tu télécharges sur Internet peut être défectueux. Contrôle régulièrement s il y a de nouvelles versions et maintiens ainsi ton site à l état le plus récent et le plus sûr.

8 Bannière Graphiques généralement animés et rectangulaires placés sur des pages Internet à des fins publicitaires et donnant un lien vers le site de l offrant. Banque (ou base) de données Une banque de données est un recueil de nombreuses informations (ou données) sur un sujet particulier et disposées dans un certain ordre. Bouton Petit graphique servant de bouton de commande et contenant une instruction qui est activée dès que l on clique sur le bouton. Code Également appelé code source ou texte de source. Texte écrit dans un langage de programmation d une page Internet déterminant la manière dont elle apparaît et fonctionne. Éditeur HTML Programme permettant de préparer des pages Internet sans connaissances en matière de HTML, l éditeur générant automatiquement le code correspondant. en ligne / on-line En liaison avec Internet. Fichier Ensemble de données apparentées stockées sous un nom univoque. Les fichiers peuvent contenir des images, des texte, des pages Internet, etc. Fonction Partie de site Internet où les visiteurs peuvent être actifs, par exemple forum ou livre d or. Forum Endroit où l on peut avoir des discussions, échanger des opinions ou poser des questions et y répondre. GIf ou Animation Gif Séquence d images dont la succession rapide donne l impression de mouvement comme un cinéma. Hébergement ou Hosting Mise à disposition d espace mémoire sur un serveur Web relié à Internet afin de permettre l accès à des sites sur Internet. Hébergeur (Hosting Provider, Hoster) Société proposant des services d hébergement et s occupant du bon fonctionnement du serveur Web et de sa liaison ininterrompue sur Internet. HTML (Hypertext Markup Language) Langage de programmation pour pages Internet. Des codes de texte fixent la manière dont doivent se présenter la page et son contenu. Indication de la source Indication de l origine par ex. d une image ou d un texte. kilo-octet / Kilo byte Unité de mesure de la place occupée par un fichier dans la mémoire de l ordinateur. 8 bits = 1 octet, 1024 octets = 1 Ko, 1024 Ko = 1 Mo, 1024 Mo = 1 Go. Lien Raccourci qui, en cliquant, appelle une autre page Internet. Logiciel de conception Programmes permettant de préparer des pages Internet. Logiciel de mise en page Programme permettant de préparer des pages Internet au moyen de surfaces, couleurs, lignes, écritures, images, dessins, etc. Logiciel graphique Programme permettant de dessiner et de concevoir. Logo Mots ou noms qui se remarquent facilement par une écriture ou une couleur particulière et sont ainsi inconfondables. médias sociaux (ou Social Media) Technologies permettant aux utilisateurs de s échanger et de créer des contenus seuls ou ensemble. Navigateur Programme permettant de visualiser des sites Internet (par ex. Firefox ou Internet Explorer). Nom de domaine Également appelé adresse Internet. Combinaison de lettres et de chiffres permettant d identifier et de retrouver un site sur Internet. optimisation du moteur de recherche Mesures permettant à des sites web d apparaître à des places plus élevées lors de la recherche. Page (ou page Internet ou page Web) Une page est une partie de site Web, un fichier HTML pouvant être représentée par un navigateur. Programmation Établissement d une page Internet ou d une fonction par écriture d un code dans un langage de programmation (HTML). Recherche Il s agit de la recherche d informations. RéSEAU / NET Abréviation d Internet. Scanner Palpage électronique d un document (dessin, photo) par un scanner qui en fait une image numérique pouvant être stockée et traitée à l ordinateur. serveur Web Ordinateur extrêmement performant servant à stocker les sites Web et veillant à ce qu ils soient toujours en ligne. Site Abréviation de site Web. site Internet ou Site Web Notion générique pour tous les documents faisant partie d une présence sur Internet. Structure Constitution, subdivision du site Web. Téléchargement Action de charger des fichiers ou programmes depuis Internet sur son propre disque dur. Bon à savoir!.gif ou.png Utilise ce format de fichier pour les graphiques simples (peu de couleur, pas d échelle de couleurs)..jpg Tu auras besoin de ce format pour les photos et les graphiques compliqués. Au moment de stocker, tu peux sélectionner la qualité. Fais attention à ce que le fichier ne soit pas trop lourd! Enregistre les images à la grandeur où tu veux les avoir sur le site, avec une résolution de 72 dpi. Une résolution plus élevée n a pas de sens car un écran ne peut représenter que 72 dpi!.html Tout fichier HTML (c est-à-dire les différentes pages de ton site) doit être pourvu de cette terminaison, autrement le navigateur ne peut le représenter. index.html La page d accueil de ton site doit s appeler index.html, autrement le navigateur ne saura pas par où commencer. FTP Pour charger le site de ton ordinateur sur le serveur, il te faut un programme FTP. FTP (file transfer protocol) qui est une possibilité d échanger tes données, comme . Qui est SWITCH? SWITCH exploite un réseau d ordinateurs à hautes performances qui interconnecte les hautes écoles de toute la Suisse. Chez SWITCH, tu peux aussi enregistrer des adresses Internet. Il t en faut une si tu veux mettre un site Web sur Internet. Tu peux la choisir toi-même et, si elle est encore libre, la faire enregistrer chez SWITCH.