Développer un site Internet avec FrontPage

Transcription

Développer un site Internet avec FrontPage
Journées pédagogiques 2007 « Établir des ponts »
Mercredi, le 10 janvier 2007
13 h 30 à 16 h
Laboratoire informatique F-3720
OBJECTIF
Tout en apprenant les fonctions de base du logiciel FrontPage, vous construirez un site Web
de type « coffre à outils » qui pourra s'avérer très utile pour accompagner votre enseignement.
Voici les principaux thèmes de l’atelier :

CONTENU
13 h 30
14 h
Georges Chouinard, enseignant
Département des techniques de bureautique
[email protected]
Créer un site Web et une page d’accueil.
Ajouter des pages comportant des liens hypertextes.
Importer des documents.
Insérer des photographies et des éléments graphiques.
Concevoir la navigation entre les pages Web.
Préparer le site Web pour publication sur un serveur.
Créer un site Web et une page d’accueil
Caractéristiques d’un site Web FrontPage.
o Principes à respecter pour la création de votre site Web.
o Exercices 1 à 7 : Observation de la structure de base d’un site Web
Procédure de création d’un site Web.
o Expérimentation des étapes pour créer un site Web FrontPage.
Créer et modifier la page d’accueil.
Ajouter des pages comportant des liens hypertextes
Modifier une page Web pour insérer des signets et
des liens hypertextes internes.
Insérer des liens hypertextes vers un emplacement dans le document, vers une autre page du
site Web et vers un site Web sur Internet.
Modifier un lien hypertexte.
Enregistrer et fermer la page Web.
Produire un rapport de liens hypertextes.
14 h 30
Importer des documents et concevoir la navigation entre les pages Web
Importer une page Web, un document Word, des images.
Choisir un thème pour la page Web et le Site Web.
Insérer une bannière de page et des boutons de navigation.
14 h 45
15 h
Pause
Insérer des photographies et des éléments graphiques
Insérer une photographie dans une page Web.
Utiliser la barre d’outils Images et la barre d’outils Dessin.
Sites Web pour obtenir des images libres de droits pour une utilisation
à des fins éducatives et non commerciales.
15 h 30
Préparer le site Web pour publication sur un serveur
Ce qu’il faut savoir à propos du droit d’auteur avant de publier un site Web.
Le processus de publication d’un site Web.
Georges Chouinard et Sylvie Nadeau
Page 1
1- CRÉER UN SITE WEB FRONTPAGE
1.1
Caractéristiques d’un site Web FrontPage
FrontPage 2003 est un logiciel de gestion de sites Web qui offre plusieurs outils pour simplifier
les tâches de conception, de mise en page, de publication et de mise à jour de pages Web.
Le processus de conception d’un site Web comprend généralement les étapes suivantes :
1- La planification du projet de site Web : objectif, clientèle
visée, contenu, structure de navigation, hébergement, etc.
2- La création du site Web, un dossier qui regroupera tous les
documents utiles : pages Web, images, photos, etc.
3- La création de pages Web et l’importation de documents.
4- La conception d’une structure de navigation entre les
pages du site Web en utilisant des boutons interactifs ou des
liens hypertextes.
5- La publication du site Web sur un serveur spécialisé pour
l’hébergement des sites Web.
Lors de la création d’un site Web, FrontPage enregistre le site
dans le dossier Mes documents\Mes sites Web.
Si vous oubliez de spécifier un nom lors de la création d’un
site Web, FrontPage attribuera le nom monsiteweb1.
La page d’accueil du nouveau site Web FrontPage
porte le nom de index.htm.
Principes à respecter pour la création de votre site Web
En raison des différents protocoles de traitement de l’information des serveurs de pages Web, il
est important de respecter les principes suivants :
1.
Afin de réduire les erreurs qui surviennent parfois lors de la publication d’un site Web, les noms de
dossiers et de documents ne doivent pas comporter d’espaces, de lettres accentuées, de majuscules, ou
de caractères spéciaux (symboles, soulignement, etc.).
2.
Avant de pouvoir publier votre site Web, vous devez obtenir auprès des responsables du serveur
d’hébergement un nom d’usager et un mot de passe. De plus, le nom de la page d’accueil peut être
différent selon le serveur (ex. : index.htm, index.html, default.htm ou default.html).
Le Service du développement des technologies informatiques gère le serveur « Pedagogie » du Collège.
Sur réception de votre courriel adressé à [email protected], la personne responsable du guichet
technique créera un espace qui vous permettra de publier et de mettre à jour votre site Web. Vous recevrez
des instructions concernant votre nom d’usager, votre mot de passe, l’adresse de publication et le nom
qu’il faut attribuer à la page d’accueil. Nous vous invitons à conserver ces renseignements en lieu sûr.
3.
Le droit d’auteur s’applique à presque tous les documents disponibles sur Internet. Les enseignantes et les
enseignants qui souhaitent publier un site Web pédagogique ont le devoir de connaître les règles
fondamentales qui régissent la protection du droit d’auteur. À ce sujet, nous vous invitons à lire la section
3.1 intitulée Ce qu’il faut savoir à propos du droit d’auteur (p. 15).
Page 2
Exercice 1 : Un coup d’œil sur le serveur « Pedagogie » du Collège
Sur un ordinateur du Collège, ouvrez le navigateur Internet
Explorer et entrez le mot PEDAGOGIE dans la barre d’adresse.
À l’extérieur du collège, entrez l’adresse suivante :
http://pedagogie.cegep-fxg.qc.ca/
Dans le menu du côté gauche, cliquez sur « Les enseignants ».
Trois suggestions de sites à visiter : Dioury, Lacroix, et Pelletier.
http://pedagogie.cegep-fxg.qc.ca/profs/mdioury/default.htm
http://pedagogie.cegep-fxg.qc.ca/profs/rlacroix/
http://pedagogie.cegep-fxg.qc.ca/profs/jpelletier/
La procédure pour publier votre site Web sur le serveur « Pedagogie » du Collège est décrite à la page 16 de cet aide-mémoire.
Exercice 2 : Copier un site Web FrontPage
Utilisez le Poste de travail ou le gestionnaire de fichiers Windows pour sélectionner le
dossier d’un site Web FrontPage nommé « site demo 1 ».
Copiez ce dossier et collez-le dans votre dossier « Mes documents » ou sur le « Bureau ».
Exercice 3 : Ouvrir et fermer un site Web FrontPage
Démarrez FrontPage. Dans le menu Fichier, sélectionnez
la commande Ouvrir le site…
Sélectionnez le dossier « site demo 1 ».
que vous avez copié dans « Mes documents » ou sur le bureau.
Observez l’arborescence des dossiers et des pages Web.
Dans le menu Ficher, sélectionnez la commande
Fermer un site.
Exercice 4 : Ouvrir et fermer une page Web (la page d’accueil)
Ouvrez à nouveau le site Web (Fichier, Ouvrir le site…, Site demo 1)
Sélectionnez la page Web nommée :
.
Dans le menu Fichier, sélectionnez la commande Ouvrir.
Observez le contenu de la page d’accueil du site Web.
Exercice 5 : Explorer les principaux modes d’affichage de FrontPage
Dans le coin supérieur gauche de
l’écran, des onglets vous permettent de sélectionner les
pages Web ouvertes.
Dans le coin inférieur
gauche de l’écran, vous pouvez sélectionner les modes
d’affichage de la page Web :
Le mode création est utilisé pour l’édition de la page Web affichée.
Les liens hypertextes ne sont pas actifs.
Le mode fractionné et le mode code permettent l’affichage des balises du
langage HTML.
Le mode Aperçu permet de vérifier l’affichage des liens hypertextes.
Page 3
Exercice 6 : Afficher les balises HTML (mode Code)
Dans le coin inférieur gauche de l’écran, cliquez sur Code pour afficher la page Web en langage
HTML. Voici quelques notions de base à propos des principaux codes affichés à l’écran.
Les balises HTML (notions de base)
Les pages Web sont écrites en langage HTML
(HyperText Markup Language).
Elles contiennent des balises HTML, c'est-à-dire des commandes
incorporées qui fournissent des informations sur la structure,
l'apparence et le contenu d'une page.
Les navigateurs Web utilisent ces informations pour déterminer
comment afficher la page.
Balise d'ouverture
Balise de fermeture
<html>
</html>
Première balise et dernière balise d’une page Web.
<head>
</head>
En-tête d'un fichier HTML. C’est dans cette zone que l’on
insère des balises telles que <title> et meta name ="
description" qui permettent de codifier une page Web pour le
référencement dans les moteurs de recherche.
<title>
</title>
<meta name="description" content="Brève
description du contenu du site Web"
Description
Titre de la page Web. Cette balise est utilisée pour le
référencement dans les moteurs de recherche.
Balise servant à fournir une description du contenu de la
page Web. Dans FrontPage, on peut compléter la balise
Description en utilisant la commande Fichier, Propriétés,
Description de la page.
Balise servant à fournir une liste de mots clés pour le
référencement sur les moteurs de recherche. On sépare les
<meta name="keywords" content="mot 1,mot 2,
mots clés par une virgule. Dans FrontPage, on peut compléter
mot 3, …,mot 100,"
la balise Keywords en utilisant la commande Fichier,
Propriétés, Mots clés.
<body>
</body>
Corps du document


Texte en gras
 

Saut de ligne
<center>
</center>


Paragraphe (saut de 2 lignes)


Texte souligné
Centrage
Pour un dossier complet concernant les balises HTML, consultez le site Web Comment ça marche :
Introduction aux balises HTML http://www.commentcamarche.net/html/htmlbalise.php3
Pour les balises Meta et le référencement de votre site Web, consultez le site Web de l’auteur du livre Créez du trafic sur son site Web
http://www.abondance.com/docs/meta_1.html et http://www.abondance.com/ressources/meta.html
Exercice 7 : Fermer le site Web
Cliquez maintenant sur Création pour afficher la page en
mode normal.
Fermez la page Web en confirmant son enregistrement.
Fermez le site Web en sélectionnant la commande
Ficher, Fermer le site.
Page 4
1.2
Procédure pour créer un nouveau site Web
Étape
Commande
Résultat
1
Dans le menu Fichier, sélectionnez Nouveau.
Le volet FrontPage « Nouveau » s’affichera à
droite de l’écran.
Cliquez sur Site Web à une page…
2
Dans la boîte de dialogue sélectionnez
Site Web Personnel.
3
Cliquez sur Indiquez l’emplacement du
nouveau site Web
Observez bien le chemin par défaut où
sera créé le nouveau site Web et
changez l’expression monsiteweb1
par site01
4
Pour modifier les paramètres ou
renommer un site Web, utilisez le menu
Outils, Paramètres du site…
et entrez le nouveau nom du site Web.
5
FrontPage a créé le dossier site01, une
page
, cinq pages Web modèles, un
dossier pour regrouper les images, un dossier
pour les photos et des dossiers servant à la
gestion des ressources du Site Web par
FrontPage (Il est important de ne jamais
supprimer les dossiers _fpclass, _overlay et
_themes).
C:\Mes documents\Mes sites Web\monsiteweb1
C:\Mes documents\Mes sites Web\site01
Observez les boutons au bas de l’écran.
Cliquez sur le bouton
.
Page 5
Étape
Commande
6
Le mode Navigation affiche le site Web sous
la forme d’un organigramme. Il comprend des
boutons pour modifier la taille et l’orientation
de l’organigramme. On peut aussi insérer une
nouvelle page et créer des liens hypertextes.
Résultat
Exercice : Cliquez sur la page Contactez-moi. Utilisez
les commandes Copier et Coller du menu Édition.
Vous observerez l’insertion d’une nouvelle page portant
le nom de Copie de Contactez-moi. Sélectionnez cette
page pour la faire glisser sur la page Galerie Photo.
Enfin, supprimez cette page du site Web.
7
Le mode Liens hypertextes affiche le site
Web sous une forme qui permet d’observer les
liens hypertextes entre les pages Web.
Exercice : Cliquez sur le bouton
pour
expérimenter ce mode d’affichage des liens hypertextes.
8
9
Le mode Rapports vous donne accès à
différents outils.
Exercice : Sélectionnez l’utilitaire
« Liens hypertexte rompus »
vous obtiendrez une liste
de liens hypertextes qui ne
sont plus en fonction.
Cliquez sur le mode
afin d’afficher
la liste des documents et des dossiers du site
Web.
afin
Double-cliquez sur la page
d’ouvrir la page d’accueil.
Observez les onglets dans le haut de l’écran.
10
Pour afficher simultanéement le mode dossier
et le mode page Web, cliquez sur le bouton
Ouvrir / Fermer le volet, de la barre d’outils.
11
Lorsque vous ouvrez plusieurs pages Web, les
onglets de chaque page apparaissent.
En cliquant sur un onglet, on affiche la page
Web sélectionnée.
L’onglet blanc indique la page active.
Une étoile à droite du nom indique que la page
a été modifiée, mais qu’elle n’a pas été
enregistrée.
Onglets pour afficher le mode
Dossiers ou la page Web
Cliquez sur le X pour
fermer la page Web.
Page 6
1.3
Contenu d’une page d’accueil
La page d’accueil constitue le premier contact de l’internaute avec votre site Web. Planifiez son
contenu en fonction des caractéristiques suivantes :
- Son chargement sera rapide (moins de 10 secondes). Si un élément graphique retarde le
chargement, il est préférable de le supprimer. On peut vérifier la durée en kilobits/seconde
du chargement d’une page Web, en cliquant sur la zone
du coin inférieur droit
d’une page Web. On peut aussi utiliser le rapport « Pages chargées » dans le menu
Affichage, Rapports.
- Les informations devraient être centrées, alignées à l’aide d’un tableau et limitées à un seul
écran (pas de défilement horizontal, ni de défilement vertical).
Bannière de page
Gif animé
Barre de navigation
Texte défilant
Lien hypertexte
Dater
Mention du droit d’auteur
Compteur
Durée de chargement
Éléments FrontPage
Commande
Commentaire
Bannière de page
Insertion, Bannière de
page
S’affiche correctement lorsque l’organigramme du site Web a été
structuré en mode Navigation. Les éléments graphiques varient
selon le thème utilisé.
Barre de navigation
Insertion, Navigation…
S’affiche correctement lorsque le site Web contient plus d’une
page et que l’organigramme a été structuré en mode navigation.
Les boutons varient selon le thème utilisé.
Propriétés de la page
Fichier, Propriétés
Pour préciser le titre, la description et les mots clés qui serviront
au référencement de la page Web. Pour ajouter un fond sonore.
Thème
Format, Thème
Choix de modèles prédéfinis par FrontPage. On peut créer un
thème plus personnel en modifiant un thème existant.
Arrière plan
Format, Thème
Dans le volet Office, cliquez sur le thème par défaut. Utilisez le
bouton droit de la souris pour sélectionner l’option
« Personnaliser ». Vous pourrez alors cliquer sur le bouton
« Graphiques » et sélectionner « Image d’arrière-plan ».
Texte défilant
Insertion, Composant
Web, Effets
dynamiques,
Texte défilant
Entrez une citation ou un court message.
Cliquez deux fois sur le composant pour modifier ses paramètres.
Page 7
Éléments FrontPage
Commande
Commentaire
Tableau
Tableau, Insérer
Les tableaux sont très utiles pour la mise en page
comportant des images et du texte. Dans le menu Tableau,
Propriétés du tableau, on peut changer la taille des
bordures. Avec l’option Bordures, Taille = 0, on obtient
une grille de mise en page qui ne s’affiche pas dans les
navigateurs Web.
Énoncez la mission de votre site Web. Par exemple :
Ce site Web a pour but de vous fournir de l’information
pertinente en rapport avec les thèmes abordés dans mes
cours.
Texte de présentation
Date et heure
de mise à jour
Insertion, Date et heure
Permet de sélectionner différents formats de date et
d’heure qui se mettront à jour lors des modifications et de
l’enregistrement de votre page Web.
Symbole Copyright ©
Insertion, Caractères spéciaux
Pour ajouter un avis visant à protéger le droit d’auteur.
Mention du droit
d’auteur
Prénom Nom, année de
publication
Cette mention est importante pour avertir les visiteurs que
les textes, les éléments graphiques et les photographies
contenues sur votre site Web sont protégés en vertu de la
Loi sur le droit d’auteur. Vous pouvez créer un lien
hypertexte vers une page Web qui contiendra des
conditions d’utilisation et de reproduction et la démarche
à suivre pour obtenir une autorisation écrite. Pour en
savoir plus à ce sujet, lire la page 15.
Exercices
Suivez les instructions données par l’enseignante ou l’enseignant pour créer la première version
de la page d’accueil de votre site Web personnel.
1. Fermez FrontPage.
2. À l’aide du poste de travail, copiez le site Web « sitedemo2 » et collez-le dans votre dossier
« Mes documents » ou sur votre bureau Windows.
3. Démarrez FrontPage
4. Ouvrez le site Web : sitedemo2
5. Modifiez le texte de la bannière de page (Votre prénom et votre nom)
6. Modifiez les propriétés du tableau (Alignement, taille, bordures)
7. Insérez un composant Texte défilant (Modifiez la couleur et la taille du texte).
8. Insérez le caractère spécial © et corrigez la mention du droit d’auteur.
9. Insérez le composant Date de mise à jour.
10. Vérifiez la durée de chargement en kilobits/seconde pour un modem de 56 k.
11. Affichez la page Web dans le navigateur (Fichier, Afficher dans le navigateur)
12. Modifiez les propriétés de la page d’accueil (Fichier, Propriétés, Titre, mots clés)
13. Enregistrez et fermez la page d’accueil.
Page 8
La barre d’outils Standard
Nouvelle page, Nouveau site Web,
Nouvelle Tâche, Nouveau Dossier
Annuler
Ouvrir un document ou un dossier
Ouvrir un site Web
Rétablir
Enregistrer
Insérer un composant FrontPage
Publier le site Web
Insérer un tableau
Liste des dossiers
Insérer une image depuis un fichier
Imprimer
Lien hypertexte
Afficher dans le navigateur
Actualiser le contenu d’une page Web
Orthographe
Arrêter
Couper
Afficher tout
Copier
Affichage du volet Office 2003
Ressources d’aide en ligne sur le site
Web de Microsoft.com
Coller
Reproduire la mise en forme
Notes :
Page 9
2. CRÉER DES PAGES WEB COMPORTANT
DES SIGNETS ET DES LIENS HYPERTEXTES
Exercices
Suivez les instructions données par l’enseignante ou l’enseignant pour compléter les tâches
suivantes dans la construction de votre site Web pédagogique.
1. Ouvrez la page Web « Recherche.htm ».
2. Au début de la page, Insérez un signet « Début ».
3. Insérez une bannière de page (Insertion, Bannière de page)
4. Sélectionnez un thème FrontPage pour cette page. (Format, Thème)
5. Cliquez deux fois sur le bouton Accueil. Dans le menu Barre de navigation, sélectionnez
l’option Même niveau.
6. À gauche du titre Moteurs et répertoires de recherche, créez un signet « Moteurs ».
À gauche du titre Portails, créez un signet « Portails ».
À gauche du titre Annuaires, créez un signet « Annuaires ».
7. Dans le premier tableau de la page sélectionnez le texte Moteur de recherche.
Insérez un lien hypertexte en lien avec le signet « Moteurs ».
Sélectionnez le texte Portails gouvernementaux. Insérez un lien hypertexte en lien avec le
signet « Portails ».
Sélectionnez le texte Annuaires spécialisés. Insérez un lien hypertexte en lien avec le signet
« Annuaires ».
À la fin de la page, sélectionnez le texte Retour au début de la page et créez un lien
hypertexte avec le signet « Début ».
8. Enregistrez la page Web et sélectionnez la commande
Fichier, Afficher dans le navigateur.
Après avoir cliqué sur les liens hypertextes pour vérifier la navigation à l’intérieur du
document, fermez la fenêtre du navigateur.
9. Dans le tableau des moteurs de recherche, sélectionnez le texte Kartoo.com. Insérez un lien
hypertexte avec le site Web : www.kartoo.com
Attention : ce site Web doit s’ouvrir dans une nouvelle fenêtre. Donc, il faut sélectionner
l’option Cadre de destination, Nouvelle fenêtre dans le menu Lien hypertexte.
10. Dans le menu Annuaires, sélectionnez le texte Pages Jaunes Canada. Supprimez le lien
hypertexte.
11. Insérez une barre de navigation au bas de la page Web.
12. Enregistrer et fermer la page Web.
13. Affichez le menu Rapports (Affichage, Rapports) et commandez un rapport de liens
hypertextes.
Page 10
La gestion des liens hypertextes
Insérer un Signet
Placez le curseur à l’endroit où vous souhaitez ajouter un
signet.
Dans le menu, sélectionnez Insertion, Signet
Dans la boîte de dialogue, entrez un nom qui sera utilisé
comme référence au signet.
Insérer un Lien hypertexte vers un Signet
Sélectionnez le texte qui fera référence à un signet.
Dans le menu, sélectionnez Insertion, Lien hypertexte
Dans la boîte de dialogue, cliquez sur la zone des signets.
Sélectionnez le bon signet.
Insérer un Lien hypertexte vers une autre page Sélectionnez du texte, un bouton ou un objet.
du site Web.
Dans la liste des fichiers, sélectionnez la page Web du site que
vous souhaitez lier.
Cliquez sur OK.
Insérer un Lien hypertexte vers un fichier sur
l’ordinateur ou le serveur.
Sélectionnez du texte, un bouton ou un objet.
Cliquez sur le bouton Fichier
Cliquez sur OK.
Insérer un Lien hypertexte vers un site
Internet
Insérer un Lien hypertexte de courrier
électronique
Supprimer un Lien hypertexte
Sélectionnez du texte, un bouton ou un objet.
Supprimez le contenu de la zone URL.
Cliquez sur OK.
Page 11
Utilisation des thèmes
Les thèmes vous permettent de contrôler les propriétés globales de
la page, telles que les couleurs, les polices, les styles des puces, les
boutons graphiques et les fonds d’écran. Vous pouvez appliquer des
thèmes page par page ou à la totalité d’un site Web.
Vous pouvez créer vos propres thèmes en modifiant un thème
existant ou en utilisant vos propres images, en appliquant vos jeux
de couleurs et en définissant des styles.
Procédure pour appliquer un thème à votre site Web ou à vos pages
Web.
1. Dans le Menu, sélectionnez Format, Thèmes
2. Cliquez sur l’un des 60 thèmes prédéfinis.
3. Au besoin, cliquez sur les options Toutes les pages ou
Pages sélectionnées.
4. Sélectionnez d’autres options : Couleurs vives,
Graphismes animés, ou Image d’arrière-plan.
Bannière de page
Une bannière de page permet d'ajouter rapidement des titres aux
pages. Ces bannières peuvent s’afficher comme texte ou comme
objet graphique lié au thème sélectionné pour la page Web.
Direction générale
En mode Page, positionnez le point d'insertion là où vous voulez
ajouter une bannière de page. Dans le menu Insertion, cliquez sur
Bannière de page.
Les bannières de page utilisent les titres de page du mode
Navigation.
Si vous modifiez le titre d'une page, l'étiquette de sa bannière sera
modifiée aussi.
Barre de navigation
Une barre de navigation est un ensemble de liens hypertextes gérés
par FrontPage, sous forme de texte ou de boutons, proposés au
visiteur pour atteindre les pages de votre site Web.
En mode Page, placez le point d'insertion là où vous souhaitez créer
une barre de navigation. Dans le menu Insertion, , sélectionnez
Barre de navigation.
Dans l’exercice de création d’un site Web, Si vous modifiez la page
d’accueil, sélectionnez le Niveau Enfant et cliquez sur OK.
Page 12
3- IMPORTER DES DOCUMENTS ET
CONCEVOIR LA NAVIGATION ENTRE LES PAGES
WEB
Importer des images Un site Web FontPage regroupe dans un dossier unique tous les éléments
nécessaires : textes, dessins, images animées, photos, sons, vidéo. Lorsque
ou des fichiers
vous insérez une photo qui provient de l’extérieur du dossier du site Web,
FrontPage vous propose d’enregistrer une copie du document dans le site Web.
La fonction Fichier, Importer permet d’intégrer au site Web la copie d’un ou
de plusieurs documents que vous pourrez ajouter à la structure de navigation
de votre site Web.
L’organigramme
du site Web
Le mode navigation vous permet de concevoir l’organigramme de navigation
de vos pages Web.
La création d’un organigramme est essentielle si vous utilisez les composants
Bannière de page et Barre de navigation.
Dans la barre de navigation :
On désigne les pages supérieures par le nom de pages parents.
On désigne les pages inférieures par l’expression pages enfants.
Exercices
1. Importez les documents suivants dans votre site Web :
2. Au début de la page, Insérez un signet « Début ».
3. Insérez une bannière de page (Insertion, Bannière de page)
4. Sélectionnez un thème FrontPage pour cette page. (Format, Thème)
5. Cliquez deux fois sur le bouton Accueil. Dans le menu Barre de navigation, sélectionnez
l’option Même niveau.
6. Ajoutez une page Web à l’organigramme. Supprimez une page Web de l’organigramme.
7. Ouvrir la page Web Langues.htm.
8. Sélectionnez le thème par défaut du site Web (Format, Thème).
Insérez une bannière de page.
9. Dans le premier tableau, insérez une image (Terre2.gif).
Puis, remplacez les mots du menu par des boutons interactifs en lien
avec les signets déjà créés.
Page 13
4- INSÉRER DES PHOTOGRAPHIES, DES ÉLÉMENTS
GRAPHIQUES ET DES COMPOSANTS FONTPAGE
Exercices
1. Ouvrir la page Web Index.htm.
2. Sélectionnez le thème par défaut du site Web (Format, Thème).
Insérez une bannière de page.
3. Insérez une photographie. Modifiez sa taille.
4. Affichez la barre d’outils Images. Explorez les différents boutons.
5. Explorez la barre d’outils dessin. Insérez une forme. Ajoutez du texte. Associez un lien
hypertexte vers un signet, une page Web ou un site Web sur Internet.
6. Observez le temps de chargement (coin droit de la barre d’état).
7.
En cliquant sur le bouton Aide, connectez-vous à la banque d’images et de photos de
Microsoft Office pour copier ou télécharger des dessins, des images animées, des photos et
des sons.
Le contrat de licence pour contenu Microsoft en ligne vous autorise à copier, modifier, afficher et distribuer les
Éléments Multimédias, ainsi que les modifications que vous leur apportez, en tant que partie intégrante de vos
produits logiciels et services, y compris vos sites Web.
Mais attention :
• Vous n’êtes pas autorisé à vendre, concéder sous licence ou distribuer des exemplaires des Éléments
Multimédias seuls ou dans le cadre d’une collection, d’un produit ou d’un service dont la valeur principale
repose sur les Éléments Multimédias.
• Vous n’êtes pas autorisé à utiliser les Éléments Multimédias pour créer des œuvres obscènes ou
diffamatoires, telles qu’elles sont définies par la législation fédérale américaine au moment de leur création.
En outre, vous devez (a) garantir et défendre Microsoft contre toute réclamation ou action en justice, y compris
en ce qui concerne les honoraires d’avocats et de conseils, qui résulteraient de la concession de licence, de
l’utilisation ou de la distribution d’Éléments Multimédias que vous auriez modifiés, et (b) inclure une mention
de droits d’auteur valable dans vos produits et services qui incluent les Éléments Multimédias.
8.
Autres sites Web pour trouver des images libres de droits :
Le Québec en images : http://www.ccdmd.qc.ca/quebec/
Pics for Learning : http://www.pics4learning.com/index.php
Carrefour Éducation : Documents libérés de droits
http://carrefour-education.qc.ca/ressourcesdidactiques/doc_libere_droit.asp
Page 14
5- PRÉPARER LE SITE WEB POUR LA PUBLICATION
3.1
Ce qu’il faut savoir à propos du droit d’auteur avant de publier
Internet permet d’accéder à une grande quantité de textes, de photos, de musique, de vidéoclips
et de logiciels. Pour plusieurs enseignantes et enseignants, la publication d’un site Web
personnel et la reproduction de documents disponibles sur Internet soulèvent plusieurs
questions. Dans ce contexte, il importe de préciser certains points au sujet du droit d’auteur.
1. Le droit d'auteur est le droit exclusif de reproduire une œuvre créatrice ou de permettre à une autre personne de le
faire. Ce droit s'applique à toute œuvre originale à caractère littéraire, dramatique, musical et artistique, y compris
les livres, les autres écrits, les œuvres musicales, les sculptures, les peintures, les photographies, les films et les
programmes d'ordinateurs. Ainsi, on peut dire que le droit d’auteur s’applique à presque tous les documents
disponibles sur Internet
2. Tout écrit original créé par une enseignante ou un enseignant est automatiquement protégé par la Loi sur le droit
d’auteur. Il n’est donc pas nécessaire d’enregistrer votre droit d’auteur pour bénéficier de la protection prévue par
la Loi. Ce droit d’auteur demeure valide pendant toute la vie de l'auteur, puis pour une période de 50 ans suivant la
fin de l'année civile de son décès. Après cette date, l'œuvre appartient au domaine public et quiconque le désire
peut l'utiliser.
3. Au Canada, il n’est pas obligatoire d'indiquer sur l'œuvre l'identité du titulaire du droit d'auteur. Par contre, la
Convention universelle sur le droit d'auteur exige que tous les exemplaires d'une œuvre soient marqués d'un « © »
suivi du nom du titulaire du droit d'auteur et de l'année de la première publication de l'œuvre (par exemple,
©Georges Chouinard, 2007). Lors de la création d’un site Web, la mention du droit d’auteur vise à rappeler aux
visiteurs que les documents qu’il contient sont protégés par un droit d'auteur et fournir des précisions concernant
l’utilisation et la reproduction.
4. Avant d’importer un texte ou une photo sur votre site Web, il est nécessaire d’obtenir la permission écrite du
titulaire du droit d’auteur. La reproduction non autorisée d'une œuvre constitue une violation du droit d’auteur.
Toute œuvre originale créée par une étudiante ou un étudiant, qu’il s’agisse d’une rédaction, d’une vidéo ou d’un
site Web, est protégée par le droit d’auteur. Par conséquent, la reproduction de ces œuvres dans votre site Web doit
être autorisée par écrit.
5. Lorsqu’une œuvre paraît sur Internet avec la mention qu’elle peut être librement copiée, cela constitue une licence
de reproduction. Ce droit de reproduction est souvent accompagné de conditions. En respectant ces conditions,
vous avez la permission de copier l’œuvre. Nous vous invitons à imprimer et à conserver cette mention.
6. La mention « Utilisation à des fins personnelles » n’autorise pas l’utilisation et la reproduction à des fins
éducatives. Pour obtenir cette autorisation écrite, nous vous invitons à envoyer une demande par courriel au
titulaire du droit d’auteur de l’œuvre.
7. Lorsqu’une œuvre est du domaine public, elle peut être utilisée sans qu’il soit nécessaire d’obtenir une permission.
L’expression « domaine public » désigne des œuvres qui appartiennent au grand public.
8. Le site Web de Carrefour éducation publie une liste de documents libérés de droits. Les permissions et les
restrictions sont clairement indiquées.
Carrefour Éducation : Documents libérés de droits
http://carrefour-education.qc.ca/ressourcesdidactiques/doc_libere_droit.asp
9. Pour plus de renseignements à propos du droit d’auteur, consultez les sources suivantes :
Office de la propriété intellectuelle du Canada
http://strategis.gc.ca/sc_mrksv/cipo/cp/cp_main-f.html
Le droit d’auteur ...ça compte! Quelques questions et réponses à l’intention du personnel enseignant
Conseil des ministres de l’Éducation (Canada)
http://www.cmec.ca/else/copyright/matters/indexf.stm
Page 15
3.2
Procédure pour publier un site Web sur le serveur « Pedagogie »
Avant de publier, il faut :
1) Changer le nom de la page Web index.htm pour default.html
Afin d’expérimenter la publication, nous utiliserons des dossiers temporaires :
Adresse FTP :
ftp://pedagogie.cegep-fxg.qc.ca/prive/public00
Nom d’usager :
public00
Mot de passe :
usager00
Remplacez 00 par le numéro qui vous a été attribué par l’enseignante ou l’enseignant.
Pour afficher le site Web dans le navigateur une fois la publication terminée :
Adresse :
http://pedagogie/prive/public00
Remplacez 00 par le numéro qui vous a été attribué par l’enseignante ou l’enseignant.
Vous publiez sur l’Intranet du Collège. Votre site Web sera accessible sur tous
les ordinateurs du Collège qui sont reliés à Internet.
Ce site Web n’est pas accessible à partir d’un ordinateur situé à l’extérieur du Collège.
Cet espace d’hébergement temporaire demeurera en fonction jusqu’au 31 mai 2007.
Pour obtenir un espace d’hébergement permanent et accessible partout sur Internet,
vous devez envoyer un courriel aux techniciens du Guichet technique, à l’adresse suivante :
[email protected]
Page 16
Procédure de publication du site Web
1) Fichier, Publier le site…
2) Dans le champ « Emplacement du site
Web distant : » entrez l’adresse de
publication suivante :
ftp://pedagogie.cegep-fxg.qc.ca/www/profs/(votre nom*)
3) Cochez l’option
« Utiliser le mode FTP passif »
4) Cliquez sur le bouton OK
* Suite à votre demande par courriel,
le SDTI vous fera parvenir les instructions
concernant votre nom d’usager, votre mot de passe
et l’adresse de publication.
5) Entrez votre nom d’usager
6) Entrez votre mot de passe
7) Cliquez sur le bouton OK.
La boîte de dialogue suivante montre deux
écrans.
Du côté gauche, le site web local que vous
avez créé sur votre ordinateur.
Du côté droit, votre espace d’hébergement
sur le site web distant (pedagogie).
La première fois que vous publierez votre
site Web, le site web distant sera vide.
Pour publier votre site Web, cliquez sur
Après la publication, vous verrez la liste
des dossiers et des pages Web sur le
serveur Web distant.
Si la procédure de publication échoue, il est
conseillé de fermer complètement le site Web et de
quitter Frontpage. Par la suite, démarrez FrontPage
et ouvrez le site Web afin de publier à nouveau.
Quittez FrontPage et ouvrez Internet
Explorer pour entrer l’adresse de votre site
Web.
http://pedagogie.cegep-fxg.qc.ca/profs/(votre nom*)
Page 17
Bordures partagées
La fonction Bordures partagées applique toute
combinaison de bordures – supérieures,
inférieures, gauches ou droite, ainsi que leur
contenu, à certaines pages ou à un site Web tout
entier.
Les bordures partagées sont très pratiques pour
normaliser les styles des titres, les pieds de page
ou un contenu de marge à l’échelle du site Web.
La boîte de dialogue suivante active les bordures
partagées pour un site Web tout entier. Le petit
graphique affiché montre la position de chaque
bordure sélectionnée.
Vous pouvez modifier les zones de bordure
partagée d’une page les utilisant, mais souvenezvous que les modifications que vous apportez
affectent toutes les pages de votre site Web.
Activer ou désactiver les bordures partagées
Si l’option Bordures partagées n’est pas disponible dans le menu format, il faut activer cette option en
utilisant la procédure suivante :
1. Dans le menu Outils, cliquez sur Options de page, puis sur l'onglet Opérations d'auteur.
2. Pour activer ou désactiver les bordures partagées, activez ou désactivez la case à cocher
Bordures partagées.
Page 18
LE RÉFÉRENCEMENT DU SITE WEB
Le référencement de votre site Web auprès
des moteurs de recherche est une étape
importante qui nécessite la création de
balises hypertextes spéciales, nommées les
balises Meta.
Dans Frontpage, on peut insérer ces
balises dans chaque page Web en utilisant
le menu Fichier, Propriétés de la page.
Les balises importantes sont :
Titre (Title),
Description et
Mots clés (Keywords).
Le moteur de recherche Google utilise la balise
Titre (Title) comme titre avec lien hypertexte.
La balise Description indique le descriptif de votre
page Web. La taille du descriptif est limitée à 200
caractères.
La balise Keywords comprend les mots clés
indexés par le moteur. Les mots sont séparés par
des virgules. La liste des mots clés ne doit pas
excéder 1000 caractères.
Les balises META
<HTML>
<HEAD>
<TITLE>Votre titre</TITLE>
<META name="description" content="votre descriptif">
<META name="keywords" content="mot1, mot2, ...">
</HEAD>
Des sites Internet utiles au sujet des balises Meta et du référencement
Site Web de l’auteur du livre Créer du trafic sur son site Web
http://www.abondance.com/docs/meta_1.html
http://www.abondance.com/ressources/meta.html
Page 19