Création de site en autonomie Mardi 24 novembre de 9h30 à 12h30 : Mauléon Jeudi 26 novembre de 9h30 à 12h30 : Hasparren

Transcription

1 Création de site en autonomie Mardi 24 novembre de 9h30 à 12h30 : Mauléon Jeudi 26 novembre de 9h30 à 12h30 : Hasparren Offices de Tourisme de la Montagne Basque St-Palais et Hasparren-La Bastide Clairence St Jean Pied de Port-Baigorry & Soule

2 Programme Présentation / tour de table Présentation : Animatrices Numériques de Territoire Notre sujet : créer son site en autonomie avec Jimdo Insérer un bandeau Créer l arborescence du site Insérer ses coordonnées dans le bas de page du site Créer un formulaire de contact Petit bilan de la 1ère séance

3 Et si on faisait connaissance?

4 Animatrices numériques de territoire...? Anaïs et Maïté / Emmanuelle et Maïtena Animatrice Numérique de Territoire : formation qualifiante portée par la MOPA (struct régionale) en 2009 et destinée aux employés des OT & SI Idée : comprendre, découvrir, s adapter aux évolutions du comportement des touristes sur Internet et aux évolutions des outils numériques But : conseiller, éclairer sur les questions que vous vous posez (fondamentaux et outils) sous forme de conférences, d ateliers pratiques en petits groupes de 8 personnes maximum, de tutoriels mis à votre disposition Pôle Montagne Basque : regrouper les 4 territoires = mutualiser les moyens matériel et humains

5 Le sujet qui nous intéresse aujourd hui? Créer son propre site internet. dur dur?

6 JIMDO C est quoi en 2015? Société allemande fondée en février 2007 (prix de l entrepreneur allemand en 2015) après 8 ans 15 millions de sites mis en ligne + de boutiques en ligne depuis de 200 salariés de 26 nationalités différents

7 Les avantages de Jimdo un site en responsive web design (qui s adapte aux tablettes, smartphones) un site facile à utiliser, ne nécessitant pas de connaissances en codage un site avec de nombreux designs disponibles, un nombre de pages illimité un site modifiable en ligne où que l on se trouve (pas besoin d installer un logiciel), et qui se met à jour en temps réel version gratuite & payante à des tarifs abordables (pour ceux qui optent pour un pack Jimdo pro) une rubrique d aide en ligne

8 Les packs Jimdo Toutes les informations : Pack JimdoPro : 1 nom de domaine et 1 compte mail dédié outil statistiques de Jimdo e-boutique (15 articles) pas de publicité Pack Jimdo Business : tout le JimdoPro 2 noms de domaines et 2 comptes mails e-boutique illimitée pas de publicité

9 Vous êtes prêts? Prest zide?

10 Pour vous connecter à votre site Internet Entrez l adresse de votre site Internet (celle que vous avez indiqué lors de la création de votre compte Jimdo) dans la barre du navigateur

11 Pour vous connecter à votre site Internet Descendre en bas de la page d accueil, cliquez le bouton connexion

12 Pour vous connecter à votre site Internet Entrez votre mot de passe dans la case prévue à cet effet

13 Pour vous connecter à votre site Internet Cliquez sur Connexion

14 Pour vous connecter à votre site Internet On vous invite à patienter le temps du chargement du site

15 Pour vous connecter à votre site Internet Cette page s affichera automatiquement quand vous vous connecterez

16 Tour d horizon de votre site Internet Vocabulaire -header = en tête : partie supérieure du site (souvent un visuel) -barre de navigation = menu -footer = pied de page : partie basse du site

17 Les différents menus disponibles Designs : les possibilités de gabarits que vous pourrez modifier ensuite Style : caractéristiques (couleur, police, taille, ) pour les titres, les liens, Blog : possibilité d intégrer cette fonction sur le site pour communiquer sur les actus,... Paramètres : configurer le fonctionnement du site (mot de passe, mémoire dispo, ) SEO : optimisation pour les moteurs de recherche ; référencement Statistiques : analyse du trafic, du comportement des visiteurs pour mettre en place des actions correctives le cas échéant (prestataires en version pro) Services externes : aide professionnelle pour votre site internet (prestataires pro) Aide : réponses aux questions fréquemment posées Acheter : passer à la version pro

18 J insère une photo dans l en tête (header) de mon site Cliquez sur l onglet Designs à droite de la page

19 J insère une photo dans l en tête (header) de mon site Cliquez sur l onglet Arrière plan en haut à gauche de la page

20 J insère une photo dans l en tête (header) de mon site Cliquer sur Ajouter une image pour pouvoir aller choisir une de vos photos personnelles, que vous aurez enregistré dans un dossier sur le bureau de votre PC

21 J insère une photo dans l en tête (header) de mon site Cliquer sur Choisissez un fichier ; à partir de là vous serez dirigé vers vos dossiers pour choisir la photo personnelle que vous voulez intégrer

22 J insère une photo dans l en tête (header) de mon site Sélectionnez la photo souhaitée, puis cliquez sur Ouvrir. La photo se télécharge.

23 J insère une photo dans l en tête (header) de mon site Passez la souris sur la photo que vous avez choisi, une main apparaît. Maintenez le clic sur la photo et déplacez la sur la gauche, pour remplacer la photo contenue dans image actuelle

24 J insère une photo dans l en tête (header) de mon site Cliquez sur enregistrer en bas de la page afin que les modifications soient prises en compte

25 J insère une photo dans l en tête (header) de mon site Votre photo remplace le visuel précédent. Si le rendu vous convient, cliquez sur oui en haut à gauche

26 Je crée l arborescence de mon site Arborescence = architecture globale du site (les grandes parties et sous parties) qui permet d organiser et de structurer le contenu 1. définissez les grandes rubriques du site (maxi 5-7), et sous rubriques 1. définissez le contenu de chaque page (texte et photo) 1. définissez les outils (carte de localisation, module météo, ) Objectif : permettre à l internaute de naviguer facilement sur le site et donc trouver les réponses à ses questions Pour démarrer dans la création de votre site, nous vous proposons une arborescence type, à adapter en fonction de votre activité

27 Je crée l arborescence de mon site Survolez l en tête du site pour que le menu Modifier la navigation apparaisse. Cliquez sur la partie bleue

28 Je crée l arborescence de mon site

29 Menu de navigation de votre site Internet Titre 1 Titre 2 Titre 3 Avec ces flèches vous faites passer la page 2 en page 1 (du coup la page 1 devient page 2) et ainsi de suite

30 Menu de navigation de votre site Internet

31 Je crée l arborescence de mon site Remplacez le premier menu par l objet de votre activité, en cliquant dessus. Pour l exemple, nous l avons appelé Mon activité 1, mais pour vous il peut s agir de chambre, gîte, etc.

32 Je crée l arborescence de mon site Pour rajouter une nouvelle page sur le même niveau que la précédente, cliquez sur le + de votre première rubrique. S ajoute alors une nouvelle page. Renommez la à votre convenance.

33 Je crée l arborescence de mon site Procédez ainsi jusqu à avoir ajouté l ensemble des rubriques suivantes

34 Je crée l arborescence de mon site Pour valider l arborescence ainsi créée, cliquez sur Enregistrer Vous pourrez par la suite la modifier en suivant les étapes faites précédemment

35 Je crée l arborescence de mon site

36 Je modifie mes coordonnées dans le bas de page (ou footer) Allez en bas de la page d accueil du site Internet. Cliquez sur les coordonnées. Apparaît alors ce module.

37 Je modifie mes coordonnées dans le bas de page (ou footer) Cliquez dans la partie où sont inscrites les coordonnées et modifiez le texte pré rempli

38 Je modifie mes coordonnées dans le bas de page (ou footer) Vous pouvez modifier la taille, la police, la couleur etc. de votre bas de page 1 : gras / italique 2 : liste à puce / liste numérotée 3 : insérer un lien sur un ou plusieurs mots 4 : pour annuler ou rétablir votre dernière modification 5 : aligner à gauche, centrer, aligner à droite, justifier 6 : taille du texte 7 : alinéa 8 : couleur du texte 9 : pour supprimer la mise en forme si vous utilisez quand même le copier/coller 10 : l éditeur source HTML vous permet de modifier vos textes avec du code HTML (réservé aux utilisateurs avancés)

39 Je modifie mes coordonnées dans le bas de page (ou footer) Cliquez sur enregistrer afin de conserver vos modifications

40 Créer un formulaire de contact Allez dans Ajouter un élément, puis sélectionnez l élément Formulaire 1 : champs du formulaire par défaut 2 : pour ajouter des éléments dans le formulaire 3 : modifier le style du formulaire 4 : rédiger un message de confirmation d envoi qui apparaîtra lorsque le formulaire est rempli et envoyé 5 : vous permet de rajouter une boîte anti spam (captcha) 6 : insérez l adresse sur laquelle vous souhaitez recevoir les messages laissés via votre élément formulaire

41 Je me déconnecte de mon site Internet Descendez jusqu en bas de votre site Internet. Cliquez sur le bouton Déconnecter

42 PROCHAIN RENDEZ-VOUS Création de site en autonomie (seconde séance) Comment intégrer du contenu dans votre site Internet : intégrer des colonnes intégrer du texte intégrer des photos intégrer la cartographie intégrer un Widget météo Mardi 1er décembre de 9h30 à 12h30 : Mauléon Vos ANT : Anaïs et Maité Jeudi 3 décembre de 9h30 à 12h30 : Hasparren Vos ANT : Emmanuelle et Maïtena

43

44 Merci de votre attention Anaïs Inçaurgarat Maite Hontaas Erbin