Pourquoi penser à Weebly pour créer une page web éducative? • Parce que l’environnement de travail est configuré de façon intuitive et ressemble à un environnement de bureautique traditionnel • Parce que l’on peut protéger n’importe quelle partie du site par des mots de passe • Parce que les fonctionnalités d’interactivité (blog, partage sur les réseaux sociaux, commentaires) sont faciles à créer et paramétrer • Seul bémol, la section éducation de Weebly n’est pas complètement traduite
Quelques exemples de page
de classe créés avec Weebly https://dcapsulespourlecole.weebly.com/ Un site très bien fait, avec des intégrations de médias (vidéos, documents PDF, codes QR)
https://classedecatherinebrissette.weebly.com/ Un site très épuré, facile à lire, simple à consulter
https://mmekbarry.weebly.com/blog Un site avec des éléments interactifs intéressants (sondage) et un souci de rendre le site intéressant avec des photos. 2 Créer sa page et son environnement de classe
3 Inscription à Weebly éducation
1. Allez sur https://education.weebly.com/ed-features.php
2. Cliquez sur le bouton Sign Up Now
3.Entrez vos informations pour la création d’un site web (nom
d’utilisateur, mot de passe et courriel)
Note:______________________________________________________________________ ___________________________________________________________________________ 4 Inscription à Weebly éducation (suite)
4. Entrez vos informations d’enseignant pour créer
votre environnement de classe.
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
5 Inscription à Weebly éducation (suite) Pour inscrire sa classe sur Weebly 1. Mettre le nom de la classe 2. Inscrire un mot de passe si on veut que les élèves aient un site privé (protégé par votre mot de passe)
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
6 Pour inscrire un étudiant 1. Inscrire le prénom et le nom de l’étudiant. 2. Un nom d’utilisateur est créé par le système. Vous devez créer un mot de passe pour l’étudiant.
Note: Le nom d’utilisateur et le mot de passe sont toujours disponibles
dans le tableau de bord de l’enseignant. Vous devez cliquer sur le nom d’utilisateur de l’étudiant pour consulter le mot de passe.
7 La création de votre page de classe avec
8 Pour commencer! Dans la page SITES, cliquez sur le bouton Ajouter un site.
Choisissez un thème qui vous inspire par son design. Vous pouvez modifier toutes les images et le texte du thème. Vous pouvez même changer de thème en cours de route.
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
9 Pour créer votre site (suite) Choisissez votre nom de domaine. Pour un domaine gratuit, choisissez la première option.
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
10 Pour créer votre site (suite) Un guide de départ s’ouvre pour vous assister et sera toujours disponible en bas à droite.
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
11 Pour modifier le nom de votre site Allez en haut à gauche et cliquer sur le texte MON SITE. Le curseur vous permettra de changer votre nom de site ou le désactiver si vous ne le voulez pas sur la page d’accueil.
Note du participant:___________________________________________________________________ ____________________________________________________________________________ ____________________________________________________________________________
12 Pour modifier les noms des pages
Cliquez sur l’onglet Pages. Un menu à gauche s’ouvrira.
Cliquez sur le titre de la page.
Placez votre curseur dans la case NOM DE LA PAGE et inscrivez le
nouveau nom de la page.
13 Pour changer l’arrière-plan Cliquez sur la grande image. Un menu apparaitra en bas de l’image. Choisissez Modifier l’arrière-plan.
14 Astuces
Pour trouver de belles images libres de
droit, il y a plusieurs sites, mais je préfère Pixabay pour sa facilité d’utilisation: https://pixabay.com/fr
Le site Unsplash est également très bien,
avec un peu moins d’images en stock, par contre: https://unsplash.com/
Paragraphe: Pour insérer un bloc de texte Image: Pour insérer une image Galerie: Pour insérer une galerie d’images Diaporama: Pour insérer un diaporama. Intéressant lorsque l’on a beaucoup d’images
Carte: Pour insérer une carte
pour géolocaliser. Utilisé surtout pour la page Contact Formulaire de contact: Pour insérer un formulaire de contact
16 Les principaux outils d’édition de Weebly (suite)
Bouton: Pour insérer un
bouton. Utile pour inciter l’utilisateur à poser une action Intégration: Pour insérer du code html sur la page (niveau intermédiaire) Section: Pour insérer une section complète préfabriquée (ex. un menu de restaurant) Diviseur: Pour séparer des éléments (par exemple, images ou texte et des images)
Espace: Même fonction que
diviseur, mais on peut contrôler la largeur de l’espacement.
17 Les principaux outils d’édition de Weebly (suite)
Vidéo HD (payant): Pour
insérer vos vidéos HD sur votre page. À déconseiller en général. Son (payant): Pour ajouter du son sur la page. Inutile en général. Document scribd: Pour insérer un document lisible immédiatement Youtube: Pour insérer une vidéo Youtube. Ajoute à l’intérêt du site. Flash: Pour insérer un lecteur Flash au site. À déconseiller.
Document: Pour insérer un
document PDF ou Word et le rendre disponible au téléchargement. 18 Astuce: Pour insérer une vidéo Youtube
1. Placez votre section Youtube à l’endroit désiré sur votre
page.
2. Allez sur https://www.youtube.com/ et sélectionnez
votre vidéo. 3. Cliquez sur le bouton Partagez
4. Copiez l’adresse de la vidéo.
5. Insérez l’adresse de la vidéo dans le menu de la section
Youtube.
19 Exercice guidé La création d’une page avec insertion de blocs de texte et d’images. En bonus, l’insertion d’une vidéo.
Petit rappel: N’oubliez pas de ne publier
que des images libres de droit.
1. Créez votre page
2. Nommez votre page. 3. Insérez une image dans l’en-tête. 4. Insérez un titre en bas de l’en-tête. 5. Insérez un bloc de texte. 6. Insérez un diviseur. 7. Insérez une image. 8. Insérez une section espace. 9. Insérez deux blocs de texte divisés en colonne. 10. Insérez une galerie de photos. 11. Insérez un diviseur 12. Insérez une section Youtube
20 Mes notes de l’exercice guidé 1.Créez votre page. ________________________________________________2 . Nommez votre page. ________________________________________________ 3. Insérez une image dans l’en-tête. ________________________________________________ 4. Insérez un titre en bas de l’en-tête. ________________________________________________ 5. Insérez un bloc de texte. ________________________________________________ 6. Insérez un diviseur. ________________________________________________ 7. Insérez une image. ________________________________________________ 8. Insérez une section espace. ________________________________________________ 9. Insérez deux blocs de texte divisés en colonne. ________________________________________________ 10. Insérez une galerie de photos. ________________________________________________ 11, Insérez un diviseur. ________________________________________________ 12. Insérez une section Youtube. ________________________________________________
21 Les principaux outils d’édition de Weebly (suite et fin)
Recherche (payant): Pour
faire des recherches Citation: Pour insérer un bloc de citation. Inutile. Icônes sociales: Pour partager sur les réseaux sociaux. Confirmation de présence: Pour confirmer la présence à un événement Sondage: Pour faire des sondages sur la page. Intéressant.
22 Exercice guidé La création d’une page avec insertion d’éléments interactifs.
Petit rappel: N’oubliez pas de ne publier
que des images libres de droit.
1. Créez votre page
2. Nommez votre page. 3. Insérez une image dans l’en-tête. 4. Insérez un titre en bas de l’en-tête. 5. Insérez une section Formulaire de confirmation 6. Insérez une liste à cocher dans le formulaire. 7. Insérez une section Sondage sur la page. 8. Modifier le contenu de la section. 9. Insérez l’adresse courriel de réception des réponses. 10. Insérez un diviseur. 11. Insérez une section Icônes sociales. 12. Modifiez les adresses d’icônes sociales.
23 Pour créer une page de blog 1. Allez dans Pages et choisir Page du blog.
2. Vérifiez les paramètres du blog.
3. Assurez-vous que les commentaires soient toujours modérés.
24 Pour créer une page de blog (suite) 4. Cliquez sur Nouvel article.
5. Inscrivez le titre de votre article et choisissez un élément à
ajouter dans la section d’en bas de la même manière que l’on fait une page standard.
25 Exercice guidé et autonome La création d’une page de blog
Petit rappel: N’oubliez pas de ne publier
que des images libres de droit.
1. Allez dans Pages et choisir Page du blog.
2. Vérifiez les paramètres du blog. 3. Cliquez sur Nouvel article. 4. Inscrivez le titre de votre article. 5. Insérez les éléments désirés dans la section du bas.
26 Exercice guidé et autonome La création d’une page Contact
Petit rappel: N’oubliez pas de ne publier
que des images libres de droit.
1. Allez dans Pages et choisir Page standard.
2. Nommez votre page Contact. 3. Insérez une section Formulaire de contact. 4. Modifiez les questions du formulaire en cliquant dessus. 5. Vous pouvez ajouter une carte avec la section Carte
![Manifeste Du Leader[1]](https://imgv2-2-f.scribdassets.com/img/document/168311711/149x198/c73ccc8fb5/1410680377?v=1)
