PROJET DATELIEU 20 MARS 2012LCP SALLE B105 création du site internet avec Weebly.

Présentation au sujet: "PROJET DATELIEU 20 MARS 2012LCP SALLE B105 création du site internet avec Weebly."— Transcription de la présentation:

1 PROJET DATELIEU 20 MARS 2012LCP SALLE B105 création du site internet avec Weebly

2 Se connecter à Weebly Pour commencer, rendez-vous sur la page d'accueil de Weebly à l'adresse suivante : http://www.weebly.com http://www.weebly.com Puis inscrivez-vous sur le site en renseignant les champs de texte nécessaires. N'oubliez pas de cochez la case pour acceptation des conditions d'utilisation du site (que vous aurez lues bien entendu auparavant). Et pour finir, cliquez sur le bouton SIGN UP.

3 Créer un site avec Weebly Lors de votre première connexion, Weebly vous proposera automatiquement de créer votre tout premier site. Vous devrez tout d'abord commencer par choisir un nom pour votre site. Choisissez un nom simple et parlant. C'est ce nom qui apparaîtra en en-tête de toutes les pages de votre site. Le site vous demande ensuite de choisir une adresse pour votre site. Par défaut Weebly, vous propose une adresse reprenant le nom de votre site. Attention : par convention les adresses des sites Internet ne comporte jamais ni majuscule, ni espace. Modifier ladresse en conséquence !

4 Créer un site avec Weebly Attention également, pour définir l'adresse de votre site, Weebly vous propose de choisir entre trois cas de figure différents. Choisissez l'option A qui est gratuite et sécurisée puisque votre site sera hébergé par Weebly

5 Définir le style de son site Avant de vous lancer dans la création de votre site, vous devrez en définir le design, c'est-à-dire le style. Pour cela cliquez sur l'onglet "conception" en haut de votre écran. Faites défiler les différents styles à votre disposition dans la bannière horizontale. Lorsque vous laissez votre curseur sur une imagette, le style en question s'affiche. Pour le sélectionner définitivement, cliquez sur l'imagette correspondante. n.b : cochez vos design préférés pour en faire vos favoris!

6 Créer une page avec weebly

7 Ajouter des éléments simples à votre page L'utilisation de Weebly est relativement simple. Son fonctionnement est basé sur la méthode du glisser/déposer (drag&drop). L'écran de Weebly se divise en deux espaces. En haut la barre d'outils horizontale. En bas, l'espace de travail.

8 Dans la barre d'outils, sélectionnez l'onglet "Eléments". Vérifiez que le sous- domaine "De base" est bien sélectionné. La Barre d'outils vous permet alors d'ajouter du texte et des images à votre page. Pour se faire, rien de plus simple. Sélectionnez d'un simple clic l'icône de l'élément que vous désirez ajouter à votre page. Ne relâchez pas le bouton de votre souris, et venez déposer l'élément à l'endroit désiré sur votre page. Relâchez le bouton, lorsque l'objet est bien positionné. Ajouter des éléments simples

9 Une fois l'élément positionné, il suffit d'un clic pour l'éditer : remplir du texte, le mettre en forme, sélectionner une image sur votre disque dur. Exercice : création de la page daccueil Ajouter des éléments simples

10 Ajouter des éléments complexes

11 Weebly vous permet également d'ajouter des éléments plus complexes sur vos pages. Pour les découvrir, sélectionnez, dans l'onglet "Eléments" de la barre d'outils, le sous-domaine "Multimédia". Vous pourrez ici ajouter différents éléments plus ou moins interactifs à votre site. Prenons l'exemple d'un élément Google Map.

12 Ajoutez l'élément Google Map par un glisser/déposer sur votre espace de travail. Cliquez sur l'élément et définissez ses caractéristiques : choisissez le lieu à montrer, le fond, la position et la taille de la carte... Attention, certains éléments complexes sont réservés à la version "pro" payante de Weebly. Ajouter des éléments complexes

13 Effacer un élément simple ou complexe de votre page Il est également très simple d'effacer un élément de votre page. Pour se faire, survoler l'élément à effacer avec le curseur de votre souris. Le cadre bleu de l'élément apparaît alors en surbrillance. Cliquez sur la petite croix rouge en haut à droite du cadre : l'effacement de l'élément est soumis à votre approbation.

14 Insérer une nouvelle page Une site Internet ne vaut que s'il est constitué de plusieurs pages. Pour créer des pages supplémentaires, sélectionnez l'onglet "Pages" de la barre d'outils. Puis cliquez sur "Add Page". Vous pouvez dès lors donner un nom à cette page et commencer à l'éditer.

15 Attention, par défaut, Weebly crée une barre de navigation sous le titre du site : chaque page y apparaît afin de permettre à l'internaute de passer de l'une à l'autre. Si vous ne souhaitez pas que la page apparaissent dans le menu de navigation, décochez la case correspondante. N'oubliez pas de cliquer sur "Sauvegarder les paramètres" à chaque création de page. Insérer une nouvelle page

16 Créer des liens hypertextes entre vos pages Vos pages sont créées. C'est bien ! Maintenant il faut les lier entre elles. Pour se faire, vous disposer dans chaque élément texte d'un outil "lien hypertexte", reconnaissable à son icône en forme de chaînon. Sélectionnez le texte sur lequel créer le lien, cliquez sur l'icône.

17 Weebly vous propose alors de créer des liens vers les pages de votre site ; mais également vers des pages extérieures sur le Web, vers des fichiers, et même vers des adresses mail. Sélectionnez la page qui convient, ou spécifiez l'adresse de votre choix. Puis cliquez sur "Save". Créer des liens hypertextes entre vos pages

18 Publier son site avec weebly

19 Publier son site Publier son site avec Weebly est également très simple. Cliquez tout simplement sur le bouton "Publiez" de votre barre d'outils. Weebly vous indique alors l'adresse de votre site. C'est tout !

20 Publier son site Vous pouvez également modifier le site à tout moment. Pour cela, reconnectez-vous sur le site de Weebly. Votre espace personnel présente tous les sites que vous avez créés. Cliquez sur "Modifier" tout simplement. Lorsque toutes les modifications auront été effectuées, cliquez à nouveau sur le bouton "Publiez" de votre barre d'outils.

21 Version pro

22 Images Les images uploadées peuvent être modifiées avec quelques outils intégrés : - luminosité, contraste, saturation, rognage, etc...

23 Diaporama Possibilité de créer un diaporama en uploadant les photos sous différents formats (jpeg, bmp, png,...)

24 Vidéos Ce composant est payant! Démonstration: http://www.weebly.com/features.php

25 MERCI POUR VOTRE ATTENTION!