Comment créer un site Web Martine Mottet Automne 2007.

Présentation au sujet: "Comment créer un site Web Martine Mottet Automne 2007."— Transcription de la présentation:

1 Comment créer un site Web Martine Mottet Automne 2007

2 Comment procéder 1.Faire lanalyse des besoins 2.Concevoir la structure du site 3.Organiser les dossiers et fichiers 4.Concevoir lallure graphique des pages 5.Concevoir les textes du site 6.Réaliser le site 7.Transférer les fichiers sur le serveur Web 8.Tester le site

3 1. Faire lanalyse des besoins Définir la situation de communication –Intention : information, éducation (apprentissage, évaluation) –Clientèle cible Fonction : enseignant, élève, parent Âge : enfant du primaire, enfant du secondaire, adulte Type dutilisateur : familier ou non avec le Web –Interaction : monologue, dialogue, débat –Utilisation : en classe, hors classe –Etc.

4 2. Concevoir la structure du site Trop long à afficher Fichier

5 2. Concevoir la structure du site Trop détalement Fichier

6 2. Concevoir la structure du site Trop de profondeur 5 clics de souris Fichier

7 2. Concevoir la structure du site Clic index.htm scenario1.htm auteurs.htmmembre1.htm exercice1.htm histoire1.htm Page daccueil du site 3 clics de souris membre2.htm theme1.htm plan.htm

8 2. Concevoir la structure du site Évitez les longues pages Incluez plutôt une table des matières ou créez un fichier PDF bla 1. Bla bla 2. Clo clo 3. Dit dit 1. bla bla bla bla 2. Clo clo Clo clo 3. Dit dit

9 3. Organiser les dossiers et fichiers Créez un dossier appelé NomPrenom Placez tous les sous-dossiers et fichiers dans ce dossier Pour tous les dossiers et fichiers, utilisez des noms : Courts (pour éviter les erreurs de frappe) Sans accent Sans espace Sans majuscule Pour les fichiers dimage et de son, conservez lextension des noms :.GIF.JPG.PNG(etc.).WAV.MP3.AU(etc.)

10 Adresse réelle de la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/index.html Adresse absolue de lhyperlien vers la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/image.gif Adresse relative de lhyperlien vers la page de référence image.gif Adresses absolues et relatives des hyperliens

11 Adresse réelle de la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/index.html Adresse absolue de lhyperlien vers la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/image.gif Adresse relative de lhyperlien vers la page de référence image.gif Adresses absolues et relatives des hyperliens

12 Adresse réelle de la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/index.html Adresse absolue de lhyperlien vers la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/HotPotatoes/image.gif Adresse relative de lhyperlien vers la page de référence../image.gif Adresses absolues et relatives des hyperliens

13 Adresse réelle de la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/index.html Adresse absolue de lhyperlien vers la page de référence www.tuxcafe.org/~ten-20727-h07/MottetMartine/HotPotatoes/image.gif Adresse relative de lhyperlien vers la page de référence../image.gif Adresses absolues et relatives des hyperliens

14 4. Concevoir lallure graphique des pages index.htm scenario1.htm auteurs.htmmembre1.htm exercice1.htm histoire1.htm theme1.htm plan.htm Harmonisez un maximum de trois couleursHarmonisez Choisissez des couleurs sûres pour le Webcouleurs sûres Optez pour un bon contraste fond-texte Attribuez un sens aux couleurs membre2.htm

15 Uniformisez la présentation de linformation 4. Concevoir lallure graphique des pages

16 Préférez les polices sans serif plutôt que les polices avec serif (maximum deux polices) Réservez le soulignement pour les hyperliens Choisissez la taille des caractères en fonction du public cible Utilisez seulement des éléments audiovisuels libres de droits Utilisez seulement des éléments audiovisuels ayant une valeur ajoutée Évitez les éléments animés

17 5. Rédiger les textes du site Faites des phrases courtes (lisibilité) Regroupez les phrases en petits blocs dinformation (assimilation) Traitez dun seul sujet dans un bloc dinformation (pertinence) Attribuez des titres significatifs (repérage) Datez chaque page Citez vos sources Source : Horn, Robert (1987) Information Mapping

18 6. Produire le site index.htm auteurs.htmcontenu.htm exercice3.htm exercices.htm plan.htm histoire.htm mediagra phie.htm exercice2.htmexercice1.htm

19 6. Produire le site (équipe de 3 personnes) index.htm auteurs.htmcontenu.htm exercice3.htm exercices.htm plan.htm histoires.htm mediagra phie.htm exercice2.htmexercice1.htm 3 exercices par personne 1 histoire par personne

20 7. Transférer les fichiers sur le serveur Web Un seul ordinateur serveur mais plusieurs services –Service Wiki –Service FTP –Service Web Transférez tous les fichiers sur le serveur dans votre dossier public Gardez tous les fichiers dans le même dossier

21 8. Tester le site À ladresse : www.tuxcafe.org/~ten-20727-h07/NomPrenom