Office de Tourisme - Pays
de Gourdon
Atelier Numérique Etourisme

Création d’un
site internet
Lundi 25 Mars 2013
Cyber Base Quercy Bouriane
Gourdon
Aujourd’hui …
 On se présente … Petit tour de table
 « L’avant » site ! Ce qu’il faut savoir
…
 La création en 3 étapes …
Créez, Personnalisez, Administrez

Alors c’est parti !!!
ANT : ???
Qui Cathy MABOUT
suis-je ?
Office de Tourisme Intercommunal du
Pays de Gourdon, Chargée de
l’Animation Numérique de Territoire, et
surtout pas webmaster, community
manager, spécialiste du référencement,
…

ANT : en anglais ça veut dire Fourmi !

L’Animation Numérique de Territoire c’est …
Une nouvelle mission pour les Offices de Tourisme :
accompagner les professionnels du Tourisme dans le Etourisme

Petit tour de table …
Qui êtes vous ?
Où en êtes vous de votre
Blog ou Site Internet ?
Blog

Site basé sur la rédaction régulière
d’articles d’actualités, billets
d’humeur, interactivité avec les
lecteurs …

Site Internet
Le site procure beaucoup plus de
liberté dans l’organisation des
rubriques et des pages (un menu et
des sous-menus). Il y a une réelle
hiérarchisation de votre information

Nous, aujourd’hui, on s’occupe de
créer un Site Internet !!!
Avant de commencer …
Se poser les bonnes questions !
Avant de parler « Technique », il faut parler de
contenus et de cibles !
• À qui votre site s’adresse,
• Pour répondre à quels besoins,
• Avec quels outils et quels contenus ?
La Méthode …
Un stylo et un bloc note :

 Essayer de hiérarchiser
vos infos
 Lister tous vos contenus
 Les Regrouper en
catégories
 Les Structurer
L’Arborescence …
C’est l’articulation des différentes pages entre elles
C’est une étape importante mais
toujours modifiable

Exemples d’arborescences
pour sites touristiques
Aujourd’hui …

Créer un site
internet facilement
Jimdo ? Mais c’est quoi …
Jimdo permet de créer et d'administrer un site web très
facilement

Les avantages :
- Pas besoin de télécharger de logiciel: tout se fait en ligne.
Accessible depuis n'importe quel ordinateur.
- Pas besoin de connaître des langages informatiques.
- Plateforme intuitive d'utilisation, même pour les débutants
- Nombre de page illimité
- Un bon référencement naturel
- Une version « Mobile » générée automatiquement
- Version gratuite et version professionnelle payante (5€/mois)
Les étapes …
Étape 1 : Créer un compte

Rendez-vous
sur :
www.jimdo.c
om
Saisissez le nom de
votre site
Saisissez votre
adresse mail
Acceptez les
conditions
Cliquez sur « Créer
mon site gratuit »
Confirmation & Accès au site
Relevez
vos mails
Lien vers votre site
Votre mot de passe

Votre site
est en
ligne !
Il ne reste
plus qu’à
le
Étape 2 : Connexion au site

Voici la
page
d’accueil
de votre
site.
Petite présentation …
Header : Bannière,
Bandeau, En tête
du site

Menu de
Navigation

Balader la
souris sur
la page,
sans
cliquer …

Barre latérale : est
visible sur toutes
les pages. On
pourra y mettre
différents modules
comme « La Météo
C’est parti ! Personnalisation du
site

Navigation :
Création du Menu :
ajout de pages

Zoom
Ne pas oublier d’enregistrer
Personnalisation du site
Déplacer le
module vers le
haut ou vers le bas
Supprimer le
module

Ajout d’un Titre
dans une page

Dupliquer le
module
Ajouter un
module

Ajout d’un module
: on a beaucoup
de choix !!!
Le contenu : présentation des
outils
 Une page de site Jimdo est composée
d’une succession d’éléments.
 Chaque élément est indépendant
 A tout moment vous pouvez
modifier, déplacer ou supprimer un
élément dans la page
 Tout élément peut être dupliqué. (La
duplication d’une page entière n’est disponible
qu’en version pro)

 Toutes les mises à jour se font
instantanément dès que vous cliquez
sur « Enregistrer »
 Pour ajouter du contenu dans une
nouvelle page, cliquez sur
Les outils de structuration
Les colonnes sont un nouvel outil très
pratique pour structurer la présentation de
votre page.
2 colonnes sont insérées par défaut mais
vous pouvez ajouter autant de colonnes
que nécessaire.

Ensuite chaque colonne s’utilise et
s’alimente comme une page dans la page.
Vous pouvez donc y ajouter autant
d’éléments que vous souhaitez.
Les outils de texte
Les Titres permettent de structurer votre texte
(3 niveaux de titres)

• visuellement pour l’internaute qui va le lire,
• techniquement pour les moteurs de
recherche qui vont les reconnaître comme
des éléments importants de la page
Le Texte s’utilise de la même façon que les
logiciels de traitement de texte type Word.
Les outils de texte

Alignem
ent du
texte

Texte
Gras ou
Italique

Retrait
de
paragra
phe

Insertio
n de
puces
ou
numéro
s

Création
ou
suppress
ion de
liens *

Annule
ou
restaur
e
l’action

Permet d’accéder
Couleur
au code « html »
du texte
Insertion de texte brutde votre texte
ou
suppression de mise en
forme (à utiliser
impérativement pour les
« copier-coller » !!!)

* Création ou suppression
de liens
① Pour créer un lien, sélectionnez le texte sur lequel vous
souhaitez mettre le lien
② cliquez sur le chaînon puis choisissez entre
•
lien interne (lien vers une autre page de votre site)
ou
•
lien externe (lien vers un autre site ou un e-mail)
Les Images & Photos
« Image » et « Texte avec Image » permet très
facilement l’insertion d’une photo dans votre page
ou un Texte positionné par rapport à une photo.
Vous pourrez gérer la taille de votre image, sa
position dans la page, la rotation (si
besoin), spécifier qu’elle soit agrandissable ou
non, ajouter un texte alternatif et mettre un lien
sur vos photos (très important pour chaque visuel
!)

La Galerie
d’Images permet
très simplement
d’afficher une
série de photos :
soit en mode
diaporama , soit
Les outils « Jimdo »
« Téléchargement » offre aux internautes la
possibilité de télécharger des documents, par
exemple votre dépliant d’appel, au format Pdf
(format à privilégier !)
« Le Livre d’Or » offre aux internautes la
possibilité de déposer leur avis ou leur
expérience sur votre établissement. Cela ne
remplace pas les liens vers les différents sites
d’avis existants :
Tripadvisor, Dismoioù, Google, …
« Le Formulaire » permet la création d’un
formulaire de contact et/ou de réservation

« Flux RSS » vous permet de récupérer et
d’intégrer à votre site un flux RSS issu d’un blog
ou d’un autre site internet
Les outils « Jimdo »
« Partager » pour insérer les boutons de partage
– Cela permet aux internautes de partager vos
infos avec leurs amis sur leurs réseaux sociaux.
« Facebook » Bouton « J’aime » avec ou sans
compteur, pour que les internautes signalent
« qu’ils aiment » votre contenu sur leur compte
Facebook
« Twitter » pour faire remonter le fil d’actu de
votre compte Twitter

« Google + » Bouton « G+ » pour que les
internautes signalent qu’ils aiment votre contenu
sur le compte Google +
L’insertion de contenus externes
« Widget / HTML »
On utilisera de préférence cet outil pour intégrer à
notre site des contenus hébergés par des
plateformes telles
Youtube, DailyMotion, Viméo, Flickr, Google, …
HTML : il faut simplement « copier-coller » dans
ce module, le code html de ce que vous
souhaitez insérer dans votre page.
Widget : Dans ce module, Jimdo vous en
propose.
Exemples de widgets : Météo, Google
Maps, Google Agenda, dépôt d’avis
Tripadvisor, Albums photos, Vidéos, …
L’insertion d’une vidéo « You
Tube »
Rendez-vous sur
Youtube.com
ou depuis Google cliquez
sur YouTube
L’insertion d’une vidéo « You
Tube »
Cherchez la vidéo souhaitée

1 Cliquez sur « partager »

2 Cliquez sur « Intégrer »
1
2

3 Ajuster la taille de la vidéo
4

4 Copiez le code HTML et collez le
dans le cadre du module
« widget » sur votre site Jimdo.

3
L’insertion d’un Widget « Météo »

1 Rendez-vous sur www.meteorama.fr et saisir votre comm

1

2 Cliquez sur « Météo gratuit pour sit
2

3 Suivre les étapes du paramétrage de votre
3

widget et voyez à quoi il ressemble. Acceptez
les conditions et cliquez sur « Générer le
code (en bas à gauche)

4 Copiez le code HTML et collez le
dans le cadre du module « widget »
sur votre site Jimdo.
4
Insertion dans la Barre Latérale
Exemples d’insertion de modules dans la
barre latérale : Partage Réseaux
sociaux, Bouton « j’aime » ou Météo
On clique
sur

dans la barre
latérale
Insertion d’un Google Agenda !
Très pratique pour la gestion des
disponibilités !

Depuis Google connectez
vous à votre compte ou
créez en un puis …
cliquez sur
« Agenda »
Insertion d’un Google Agenda !
Cliquez sur la flèche à droite de
« Mes agendas »
puis sur « Créer un agenda »
Insertion d’un Google Agenda !

1 Nommez votre
agenda

3 Indiquez le lieu de votre
établissement

4 Cochez la case de
publication

5 Cliquez sur « Créer

2 Descriptif
(facultatif)
Insertion d’un Google Agenda !
Cliquez sur la flèche à droite de votre
agenda

Cliquez sur « Paramètres
de l’agenda »
Personnalisez votre widget
« Google agenda »
Insertion d’un Google Agenda !

Personnalisation de votre Agenda :
• Modification de la taille
• Choix du mode d’affichage
• Choix des éléments d’affichage
• Cochez les agendas que vous souhaitez insérer
(1 widget / chambre ou 1 widget pour tous les
agendas)
• Cliquez sur « mettre à jour le code html »,
copiez le et collez le sur votre site Jimdo
Personnalisation du « Header » !
Maintenant, on refait une p’tite
BEAUTÉ à notre site !!!
Personnalisation du Header !
Passez votre souris sur la zone
d’entête de votre site, puis cliquez
sur
« Modifier le header »…
Personnalisation du Header

On clique sur
« parcourir » pour
aller chercher notre
Personnalisation du Header

Motif :
Insertion
de motif

Modifier
le header
: changer
la taille :
hauteur et
largeur

Titre :
modificati
on du titre
d’entête
Le Menu « Administration »
Design

Style
Blog
Acheter
Paramè
tres
SEO Référencement

Stats
(achat)
Aide
Onglet « Design » - Mise en page
Onglet « Design »
Onglet « Style »

STYLE :
Ici on personnalise tout le
contenu du site
Police
Couleur
Fond
Texture
…
Onglet « Blog »
Jimdo vous donne la possibilité d’insérer un
« BLOG » à votre site internet !

Un BLOG doit être alimenté quasi
« QUOTIDIENNEMENT »
Tenir compte du temps que cela prend avant
de mettre en ligne !
Onglet « Achat »
Onglet « Paramètres »
Onglet « SEO »
Pour aller plus loin avec Jimdo !!!
Des mentions légales en bonne et due forme
http://www.subdelirium.com/generateur-de-mentions-legales/
Analyser la fréquentation de son site web avec Google Analytics
http://fr.jimdo.com/wiki/Google_Analytics
Créer un design professionnel pour son site
http://fr.jimdo.com/outils/webdesign/
Trouver des bons tuyaux pour améliorer son site Jimdo
http://communautefrancophone.jimdo.com/
http://realia.jimdo.com/
http://funnycat.jimdo.com/
Suivre l’actualité du e-tourisme
http://www.etourisme.info
Les prochains Ateliers
Numériques
PETIT RAPPEL :

• Jeudi 04 Avril : Gérer les Avis Clients
(IMPORTANT)
• Lundi 08 Avril : Internet de Séjour
« La Mobilité »

PENSEZ À VOUS INSCRIRE
Office de Tourisme - Pays
Bandeau de l’OT
de Gourdon
Merci de votre attention
Cathy Mabout
Office de Tourisme Intercommunal du Pays de Gourdon
Tel : 05 65 27 52 50
Mail : info@tourisme-gourdon.com
Web : www.tourisme-gourdon.com
Facebook : Pays de Gourdon Tourisme
Twitter : Gourdon Tourisme
Toute l’info Etourisme sur le centre de ressources :
www.tourisme-lot-ressources.com
Rubrique Etourisme

Pays de Gourdon : Atelier Jimdo

  • 1.
    Office de Tourisme- Pays de Gourdon Atelier Numérique Etourisme Création d’un site internet Lundi 25 Mars 2013 Cyber Base Quercy Bouriane Gourdon
  • 2.
    Aujourd’hui …  Onse présente … Petit tour de table  « L’avant » site ! Ce qu’il faut savoir …  La création en 3 étapes … Créez, Personnalisez, Administrez Alors c’est parti !!!
  • 3.
    ANT : ??? QuiCathy MABOUT suis-je ? Office de Tourisme Intercommunal du Pays de Gourdon, Chargée de l’Animation Numérique de Territoire, et surtout pas webmaster, community manager, spécialiste du référencement, … ANT : en anglais ça veut dire Fourmi ! L’Animation Numérique de Territoire c’est … Une nouvelle mission pour les Offices de Tourisme : accompagner les professionnels du Tourisme dans le Etourisme Petit tour de table … Qui êtes vous ? Où en êtes vous de votre
  • 4.
    Blog ou SiteInternet ? Blog Site basé sur la rédaction régulière d’articles d’actualités, billets d’humeur, interactivité avec les lecteurs … Site Internet Le site procure beaucoup plus de liberté dans l’organisation des rubriques et des pages (un menu et des sous-menus). Il y a une réelle hiérarchisation de votre information Nous, aujourd’hui, on s’occupe de créer un Site Internet !!!
  • 5.
    Avant de commencer… Se poser les bonnes questions ! Avant de parler « Technique », il faut parler de contenus et de cibles ! • À qui votre site s’adresse, • Pour répondre à quels besoins, • Avec quels outils et quels contenus ?
  • 6.
    La Méthode … Unstylo et un bloc note :  Essayer de hiérarchiser vos infos  Lister tous vos contenus  Les Regrouper en catégories  Les Structurer
  • 7.
    L’Arborescence … C’est l’articulationdes différentes pages entre elles C’est une étape importante mais toujours modifiable Exemples d’arborescences pour sites touristiques
  • 8.
    Aujourd’hui … Créer unsite internet facilement
  • 9.
    Jimdo ? Maisc’est quoi … Jimdo permet de créer et d'administrer un site web très facilement Les avantages : - Pas besoin de télécharger de logiciel: tout se fait en ligne. Accessible depuis n'importe quel ordinateur. - Pas besoin de connaître des langages informatiques. - Plateforme intuitive d'utilisation, même pour les débutants - Nombre de page illimité - Un bon référencement naturel - Une version « Mobile » générée automatiquement - Version gratuite et version professionnelle payante (5€/mois)
  • 10.
  • 11.
    Étape 1 :Créer un compte Rendez-vous sur : www.jimdo.c om Saisissez le nom de votre site Saisissez votre adresse mail Acceptez les conditions Cliquez sur « Créer mon site gratuit »
  • 12.
    Confirmation & Accèsau site Relevez vos mails Lien vers votre site Votre mot de passe Votre site est en ligne ! Il ne reste plus qu’à le
  • 13.
    Étape 2 :Connexion au site Voici la page d’accueil de votre site.
  • 14.
    Petite présentation … Header: Bannière, Bandeau, En tête du site Menu de Navigation Balader la souris sur la page, sans cliquer … Barre latérale : est visible sur toutes les pages. On pourra y mettre différents modules comme « La Météo
  • 15.
    C’est parti !Personnalisation du site Navigation : Création du Menu : ajout de pages Zoom Ne pas oublier d’enregistrer
  • 16.
    Personnalisation du site Déplacerle module vers le haut ou vers le bas Supprimer le module Ajout d’un Titre dans une page Dupliquer le module Ajouter un module Ajout d’un module : on a beaucoup de choix !!!
  • 17.
    Le contenu :présentation des outils  Une page de site Jimdo est composée d’une succession d’éléments.  Chaque élément est indépendant  A tout moment vous pouvez modifier, déplacer ou supprimer un élément dans la page  Tout élément peut être dupliqué. (La duplication d’une page entière n’est disponible qu’en version pro)  Toutes les mises à jour se font instantanément dès que vous cliquez sur « Enregistrer »  Pour ajouter du contenu dans une nouvelle page, cliquez sur
  • 18.
    Les outils destructuration Les colonnes sont un nouvel outil très pratique pour structurer la présentation de votre page. 2 colonnes sont insérées par défaut mais vous pouvez ajouter autant de colonnes que nécessaire. Ensuite chaque colonne s’utilise et s’alimente comme une page dans la page. Vous pouvez donc y ajouter autant d’éléments que vous souhaitez.
  • 19.
    Les outils detexte Les Titres permettent de structurer votre texte (3 niveaux de titres) • visuellement pour l’internaute qui va le lire, • techniquement pour les moteurs de recherche qui vont les reconnaître comme des éléments importants de la page Le Texte s’utilise de la même façon que les logiciels de traitement de texte type Word.
  • 20.
    Les outils detexte Alignem ent du texte Texte Gras ou Italique Retrait de paragra phe Insertio n de puces ou numéro s Création ou suppress ion de liens * Annule ou restaur e l’action Permet d’accéder Couleur au code « html » du texte Insertion de texte brutde votre texte ou suppression de mise en forme (à utiliser impérativement pour les « copier-coller » !!!) * Création ou suppression de liens ① Pour créer un lien, sélectionnez le texte sur lequel vous souhaitez mettre le lien ② cliquez sur le chaînon puis choisissez entre • lien interne (lien vers une autre page de votre site) ou • lien externe (lien vers un autre site ou un e-mail)
  • 21.
    Les Images &Photos « Image » et « Texte avec Image » permet très facilement l’insertion d’une photo dans votre page ou un Texte positionné par rapport à une photo. Vous pourrez gérer la taille de votre image, sa position dans la page, la rotation (si besoin), spécifier qu’elle soit agrandissable ou non, ajouter un texte alternatif et mettre un lien sur vos photos (très important pour chaque visuel !) La Galerie d’Images permet très simplement d’afficher une série de photos : soit en mode diaporama , soit
  • 22.
    Les outils «Jimdo » « Téléchargement » offre aux internautes la possibilité de télécharger des documents, par exemple votre dépliant d’appel, au format Pdf (format à privilégier !) « Le Livre d’Or » offre aux internautes la possibilité de déposer leur avis ou leur expérience sur votre établissement. Cela ne remplace pas les liens vers les différents sites d’avis existants : Tripadvisor, Dismoioù, Google, … « Le Formulaire » permet la création d’un formulaire de contact et/ou de réservation « Flux RSS » vous permet de récupérer et d’intégrer à votre site un flux RSS issu d’un blog ou d’un autre site internet
  • 23.
    Les outils «Jimdo » « Partager » pour insérer les boutons de partage – Cela permet aux internautes de partager vos infos avec leurs amis sur leurs réseaux sociaux. « Facebook » Bouton « J’aime » avec ou sans compteur, pour que les internautes signalent « qu’ils aiment » votre contenu sur leur compte Facebook « Twitter » pour faire remonter le fil d’actu de votre compte Twitter « Google + » Bouton « G+ » pour que les internautes signalent qu’ils aiment votre contenu sur le compte Google +
  • 24.
    L’insertion de contenusexternes « Widget / HTML » On utilisera de préférence cet outil pour intégrer à notre site des contenus hébergés par des plateformes telles Youtube, DailyMotion, Viméo, Flickr, Google, … HTML : il faut simplement « copier-coller » dans ce module, le code html de ce que vous souhaitez insérer dans votre page. Widget : Dans ce module, Jimdo vous en propose. Exemples de widgets : Météo, Google Maps, Google Agenda, dépôt d’avis Tripadvisor, Albums photos, Vidéos, …
  • 25.
    L’insertion d’une vidéo« You Tube » Rendez-vous sur Youtube.com ou depuis Google cliquez sur YouTube
  • 26.
    L’insertion d’une vidéo« You Tube » Cherchez la vidéo souhaitée 1 Cliquez sur « partager » 2 Cliquez sur « Intégrer » 1 2 3 Ajuster la taille de la vidéo 4 4 Copiez le code HTML et collez le dans le cadre du module « widget » sur votre site Jimdo. 3
  • 27.
    L’insertion d’un Widget« Météo » 1 Rendez-vous sur www.meteorama.fr et saisir votre comm 1 2 Cliquez sur « Météo gratuit pour sit 2 3 Suivre les étapes du paramétrage de votre 3 widget et voyez à quoi il ressemble. Acceptez les conditions et cliquez sur « Générer le code (en bas à gauche) 4 Copiez le code HTML et collez le dans le cadre du module « widget » sur votre site Jimdo. 4
  • 28.
    Insertion dans laBarre Latérale Exemples d’insertion de modules dans la barre latérale : Partage Réseaux sociaux, Bouton « j’aime » ou Météo On clique sur dans la barre latérale
  • 29.
    Insertion d’un GoogleAgenda ! Très pratique pour la gestion des disponibilités ! Depuis Google connectez vous à votre compte ou créez en un puis … cliquez sur « Agenda »
  • 30.
    Insertion d’un GoogleAgenda ! Cliquez sur la flèche à droite de « Mes agendas » puis sur « Créer un agenda »
  • 31.
    Insertion d’un GoogleAgenda ! 1 Nommez votre agenda 3 Indiquez le lieu de votre établissement 4 Cochez la case de publication 5 Cliquez sur « Créer 2 Descriptif (facultatif)
  • 32.
    Insertion d’un GoogleAgenda ! Cliquez sur la flèche à droite de votre agenda Cliquez sur « Paramètres de l’agenda » Personnalisez votre widget « Google agenda »
  • 33.
    Insertion d’un GoogleAgenda ! Personnalisation de votre Agenda : • Modification de la taille • Choix du mode d’affichage • Choix des éléments d’affichage • Cochez les agendas que vous souhaitez insérer (1 widget / chambre ou 1 widget pour tous les agendas) • Cliquez sur « mettre à jour le code html », copiez le et collez le sur votre site Jimdo
  • 34.
    Personnalisation du «Header » ! Maintenant, on refait une p’tite BEAUTÉ à notre site !!!
  • 35.
    Personnalisation du Header! Passez votre souris sur la zone d’entête de votre site, puis cliquez sur « Modifier le header »…
  • 36.
    Personnalisation du Header Onclique sur « parcourir » pour aller chercher notre
  • 37.
    Personnalisation du Header Motif: Insertion de motif Modifier le header : changer la taille : hauteur et largeur Titre : modificati on du titre d’entête
  • 38.
    Le Menu «Administration » Design Style Blog Acheter Paramè tres SEO Référencement Stats (achat) Aide
  • 39.
    Onglet « Design» - Mise en page
  • 40.
  • 41.
    Onglet « Style» STYLE : Ici on personnalise tout le contenu du site Police Couleur Fond Texture …
  • 42.
    Onglet « Blog» Jimdo vous donne la possibilité d’insérer un « BLOG » à votre site internet ! Un BLOG doit être alimenté quasi « QUOTIDIENNEMENT » Tenir compte du temps que cela prend avant de mettre en ligne !
  • 43.
  • 44.
  • 45.
  • 46.
    Pour aller plusloin avec Jimdo !!! Des mentions légales en bonne et due forme http://www.subdelirium.com/generateur-de-mentions-legales/ Analyser la fréquentation de son site web avec Google Analytics http://fr.jimdo.com/wiki/Google_Analytics Créer un design professionnel pour son site http://fr.jimdo.com/outils/webdesign/ Trouver des bons tuyaux pour améliorer son site Jimdo http://communautefrancophone.jimdo.com/ http://realia.jimdo.com/ http://funnycat.jimdo.com/ Suivre l’actualité du e-tourisme http://www.etourisme.info
  • 47.
    Les prochains Ateliers Numériques PETITRAPPEL : • Jeudi 04 Avril : Gérer les Avis Clients (IMPORTANT) • Lundi 08 Avril : Internet de Séjour « La Mobilité » PENSEZ À VOUS INSCRIRE
  • 48.
    Office de Tourisme- Pays Bandeau de l’OT de Gourdon Merci de votre attention Cathy Mabout Office de Tourisme Intercommunal du Pays de Gourdon Tel : 05 65 27 52 50 Mail : info@tourisme-gourdon.com Web : www.tourisme-gourdon.com Facebook : Pays de Gourdon Tourisme Twitter : Gourdon Tourisme Toute l’info Etourisme sur le centre de ressources : www.tourisme-lot-ressources.com Rubrique Etourisme