Session 2 // Atelier Animation Numérique de Territoire du Pays Vaison Ventoux // Par Laurent Pamato.

1. va i s on
ventoux
touris m e
PRO
N°2
atelier
mon site, mon blog et moi
‘‘JE passe la seconde ’’
jeudi 6 NOVEMBRE 2013
À l’Office de Tourisme Intercommunal du Pays Vaison Ventoux

2. SOMMAIRE
ATELIER N°2
BLOG
OU SITE
INTERNET ?
1
2
3
4
va i s on
ventou x
touris m e
P RO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux
Rappel,
blog et site internet
quelles différences ?
les tendances
du web
avant de se
lancer
Les grandes
étapes dans la
création d’un site

3. INTRO
va i s on
ventou x
touris m e
P RO
60 secondes sur internet
dansCHRONO !!!
TOP le monde

4. internet ? le Web ?...
INTRO
va i s on
ventou x
touris m e
P RO
dans le monde

5. 1
ATELIER N°2
1
va i s on
ventou x
touris m e
P RO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux
Rappel,
BLOG et
Site Internet
quelles
différences ?

6. 1
BLOG
et SITE
BLOG
dans le monde
En réalité, un blog est un site internet qui est organisé d’une
certaine manière, de façon à pouvoir publier des articles (ou des
billets) de manière chronologique.
Certaines entreprises utilisent le blog comme moyen de communication pour relater
l’actualité de la société de manière attractive.
Un autre aspect très particulier des blogs est la possibilité pour le lecteur de réagir
aux articles pour donner son avis via des commentaires.
site internet
Un site internet est organisé par thèmes et par pages. Le site internet
peut avoir toutes les utilités, allant du projet personnel au projet professionnel en
passant par l’associatif.
Créer un site internet vous demandera une première réflexion sur l’organisation et
la structure, car tout est ouvert et vous n’avez aucune limitation.
va i s on
ventou x
touris m e
P RO

7. 1
BLOG
et SITE
lexique du blog
Moblog : Contraction
de « Mobile Blog «. Terme
employé pour décrire un
Blogueur / Blogmaster / Carnetier : L’auteur blog mis à jour à l’aide
d’un téléphone mobile ou
d’un blog.
un assistant numérique.
Blogosphère : L’ensemble des blogs existants ou la Permalink
communauté des blogueurs.
Photoblog : Blog pour lequel le contenu principal
Post : Il s’agit d’une note publiée sur un blog. Le post est de type photo. Le photoblog possède les mêmes
peut être texte, photo ou vidéo selon les cas. Il est le caractéristiques que le blog.
plus souvent court et enrichi de liens vers d’autres
sites.
Videoblog / Vlog : Blog pour lequel le contenu
principal est de type vidéo. Le videoblog possède les
Commentaire : Opinion que l’on poste sur un blog à mêmes caractéristiques que le blog.
la suite d’un article
Ping : Dans le cadre du blogging, un ping est un signal
Tag : Mot-clé ou catégorie permettant de définir ou de envoyé vers des moteurs / annuaires de blogs dès
classifier un contenu.
qu’un blogger met à jour son blog.
Blog / Weblog : Blog est la contraction de « Web » et
« log » (journal web, ou journal en ligne).
Avatar : Petite
symboliquement
image
qui
vous
représente
Trackback : Procédé automatique qui permet d’être
alerté sur votre blog des notes de blogueurs ayant fait
référence aux vôtres.
Pseudo : Surnom utilisé sur les forums pour garder
l’anonymat
....
Smiley : Petite image ronde représentant une figure
avec différentes expressions.
va i s on
ventou x
touris m e
P RO
Blogroll : Liste de liens externes affichés
généralement dans une colonne du weblog et
représentant la blogsophère du blog ou la communauté
des blogs « amis « du blogueur.
décryptage >

8. 1
BLOG
et SITE
lexique du web
dans le monde
(HyperText
Le Web 1.0 est l’internet permettant d’accéder à des HTML
sites constitués de pages web liées entre elles par des Mark-up Language) :
hyperliens. Ce web a été créé au début des années Langage de description
(programmation)
des
1990.
pages Internet.
Le web 2.0 désigne généralement le «web nouvelle
/
Keyword
:
génération» c’est à dire l’ensemble des fonctionnalités Mot-clé
ou
combinaison
d e
communautaires et collaboratives (blogs, avis Expression
consommateurs, flux RSS, plateformes d’échanges plusieurs mots utilisés par les internautes sur les
vidéo, etc.) qui se sont fortement développées sur outils de recherche pour trouver des informations. L
Internet à partir de l’année 2005.
Spam : Technique permettant d’envoyer en grand
Adresse IP (Internet Protocole) : Adresse nombre des messages électroniques publicitaires
composée de 4 nombres qui identifient de façon non sollicités. Technologie considérée comme abusive
précise un ordinateur ou une machine sur un voir frauduleuse.
réseau. Chaque nombre peut varier entre 1 et 254 (ex:
Plug-in : Programme complémentaire permettant
152.25.251.149).
aux navigateurs de lire certains formats d’image, de
Araignée, Robot, Automate, Crawler, Spider : vidéo, d’animation ou de son.
Composante des moteurs de recherche explorant
Internet à la recherche de nouveaux sites, pages ou WIDGET : c’est un petit programme que l’on installe sur
son site et qui est destiné à afficher des informations
contenus.
sur différents thèmes (météo, cours de bourse,
Browser : Programme qui permet d’accéder à un recettes de cuisine…).
site Internet (Internet Explorer, Godzilla, etc …).
Cookie : Information déposée par un site Web sur
l’ordinateur de l’internaute. Ils sont principalement
utilisés à des fins de statistiques et pour conserver le
profil du visiteur.
va i s on
ventou x
touris m e
P RO
Hébergement / Serveur : Espace de stockage et de
traitement de données dédié à un site Web permettant
de rendre accessible ce site de façon permanente aux
utilisateurs connectés au réseau Internet.
En savoir +

9. 2
ATELIER N°2
2
va i s on
ventou x
touris m e
P RO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux
Les
tendances
du web

10. 2
LE RESPONSIVE DESIGN
dans le monde
les tendances
du web
va i s on
ventou x
touris m e
P RO

11. 2
LE RESPONSIVE DESIGN
dans le monde
les tendances
du web
va i s on
ventou x
touris m e
P RO

12. 2
LE RESPONSIVE web DESIGN
dans le monde
en exemples ci-dessous
les tendances
du web
va i s on
ventou x
touris m e
P RO

13. 2
Navigation originale
dans le monde
en exemples ci-dessous
les tendances
du web
va i s on
ventou x
touris m e
P RO

14. 2
LE parallaxe web DESIGN
dans le monde
en exemples ci-dessous
les tendances
du web
va i s on
ventou x
touris m e
P RO

15. 2
ONE pAGE WEB DESIGN
dans le monde
en exemples ci-dessous
les tendances
du web
va i s on
ventou x
touris m e
P RO

16. 2
le flat design
dans le monde
une ‘‘mode’’ actuelle !
les tendances
du web
Le flat design, ou le « design plat » est
la nouvelle corde à l’arc des designers
d’interfaces. Signes distinctifs : ce courant
graphique et ergonomique prône des
interfaces minimalistes et aux couleurs
vives.
Le flat design permet de mieux
véhiculer l’information, de contribuer
à une meilleure expérience de
navigation pour l’utilisateur.
va i s on
ventou x
touris m e
P RO

17. 3
ATELIER N°2
3
va i s on
ventou x
touris m e
P RO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux
AVANT DE
SE LANCER

18. 3
avant de
se lancer
des questions à se poser !?!
à quoi va me servir mon site :
Communiquer ?
Trouver de nouveaux clients ?
Améliorer mon image ?
Vendre un produit ? Un service ? Une activité ?
Informer ?
Fidéliser ?
...
Parfois votre projet de site peut avoir plusieurs objectifs !!
va i s on
ventou x
touris m e
P RO
BIEN DEFINIR SES PRIORITÉS...

19. 3
avant de
se lancer
Définir ses objectifs !!
Quelles sont mes cibles, quelles sont leurs attentes ?
> Local, national, international
> Loisirs, affaires
> Couples, familles, retraités, groupes
…
Quelles vont être les fonctionnalités clés
de mon site ?
va i s on
ventou x
touris m e
P RO
> Décrire ma structure
> Séduire
> Donner les disponibilités
> Réserver en ligne
> Situer, faire un itinéraire…
> Collecter des adresses emails
> Donner des actualités
…

20. 3
avant de
se lancer
Quel type de site ?
Objectifs + cibles = Une solution
technique adaptée
Le site vitrine, le blog, le site e-commerce
Un site visible sur quels supports : ordinateur,
tablette, Smartphone ?
Les modalités de mise à jour
Le référencement sur les moteurs de recherche
gérer son site = le CMS
va i s on
ventou x
touris m e
P RO
Qu’est ce que c’est ?? C’est un outil de gestion du contenu. Il devient le squelette
technique de votre site. Il permet de créer et modifier facilement les pages de
votre site, d’insérer du texte, des images, de créer des liens hypertextes… Le code
html est généré automatiquement.

21. 3
avant de
se lancer
Les différentes techniques
de création
3 façons de faire :
1
2
3
va i s on
ventou x
touris m e
P RO
Sans système de gestion du contenu
Technique ! Langage html // Transfert ftp - Ex : Dreamweaver,
FileZilla...
Avec système de gestion de contenu (CMS)
Proporiétaire :
Système privé créé par des prestataires web. En général achat
d’une licence. Soit tout ce fait en ligne, soit on installe un logiciel.
Ex : 1&1, Jimdo, WebAccapella, WebEasy…
Avec système de gestion de contenu (CMS) open
source :
Développés de manière collaborative par une communauté
internationale. Ils sont gratuits et mis à disposition de tous.
Ex : Wordpress, Joomla, Drupal, Spip

22. 3
avant de
se lancer
Les différentes techniques
de création
Aujourd’hui pensez mobilité !!
Sites mobiles : site internet classique, mais optimisé pour
s’afficher sur un téléphone portable de type Smartphone.
Sites en « Responsive web design »
‘‘Incontournable’’
va i s on
ventou x
touris m e
P RO

23. 3
avant de
se lancer
Et une application mobile,
c’est quoi ?
Une application mobile est un programme téléchargeable de façon gratuite ou payante et
exécutable à partir du système d’exploitation du téléphone ou de la tablette.
Les applications mobiles sont adaptées aux différents environnements techniques des smartphones et à leurs contraintes et
possibilités ergonomiques (écran tactile notamment). Elles permettent généralement un accès plus confortable et plus efficace à
des sites accessibles par ailleurs en versions mobile ou web.
L’application mobile peut avoir une vocation commerciale (m-commerce), marketing et
/ ou publicitaire.
va i s on
ventou x
touris m e
P RO

24. 3
avant de
se lancer
AVEC QUI ?
Tout seul jusqu’au bout…
C’est possible avec les nombreuses solutions clés en main proposées sur
la toile mais… Attention à choisir le bon outil et à bien mesurer le temps
nécessaire.
Garder du recul sur son site, ne pas perdre de vue les objectifs fixés
Avec un Pro
Bien formaliser et contractualiser vos idées et attentes. Comprendre
ce qui est fait à chaque étape. Bien cadrer les domaines d’intervention
de chacun.
Un peu : Le pro peut intervenir seulement à certaines étapes de la création
Beaucoup : ou réaliser la totalité de votre site et de vos contenus
va i s on
ventou x
touris m e
P RO

25. 3
avant de
se lancer
COMBIEN CA COÛTE ?
Le budget varie en fonction :
• Des objectifs fixés
• Des fonctionnalités souhaitées
• Du niveau de personnalisation souhaité
• Du degré d’autonomie souhaité
• De la technique choisie
• De la duplication en langues étrangères
• Du travail de référencement
Attention de bien faire le distingo : entre le coût de création et les
frais annexes : location du nom de domaine et hébergement.
Seul
Avec un pro
A partir de 0€
Entre 1000 et 2000€ pour une
base de site
Mini 50€ par an pour un nom de
domaine propre et un hébergement
va i s on
ventou x
touris m e
P RO
De 100 à 500€ pour des options de
personnalisation ou fonctionnalités
avancés ou achat de licence propriétaire.
Et beaucoup de temps….
5000€ ou plus pour des
demandes spécifiques

26. 4
ATELIER N°2
4
va i s on
ventou x
touris m e
P RO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux
les grandes
étapes dans
la création
d’un site
internet

27. 4
les grandes
ÉTAPES
Étape 1 : Etat des lieux
VOUS :
Décrivez votre structure et les services proposés
Décrivez votre environnement ( les points forts autour )
Vos concurrents :
Qui sont-ils ?
Quels sont leurs points forts et leurs points faibles ?
Vous = Qu’est-ce qui vous différencie (vraiment) ?
va i s on
ventou x
touris m e
P RO
Etablissez un listing de « mots clés ». Ce sont des mots ou expressions
qui sont utilisés pour faire une recherche sur moteur de recherche.
Gardez les sous les yeux pendant toute la période de rédaction.

28. 4
les grandes
ÉTAPES
Étape 2 : Les Contenus
Quels contenus ai-je à ma disposition ?
Quels contenus vais-je devoir trouver ?
Quels contenus sont stables dans le temps ?
Descriptif structure, environnement, prestations tarifs, disponibilités,
coordonnées, réservation en ligne, actualités, liens blogs, réseaux
sociaux…
Définir sa ligne éditoriale. C’est l’identité que vous donnez
de votre établissement au travers de vos contenus : textes
(différentes langues), photos, vidéos…
Les priorités :
L’image !!!!! Faire rêver !!! Photos de qualité !
Des textes courts, fiables (rassurer l’internaute).
va i s on
ventou x
touris m e
P RO
Des titres en forme d’accroche.

29. 4
les grandes
ÉTAPES
va i s on
ventou x
touris m e
P RO
Étape 3 : Hiérarchiser les
contenus
Faire l’inventaire des contenus et les regrouper de manière logique
Réfléchir à une arborescence. Définir le schéma de votre page
Ne pas oublier :
> Les éléments de repère et accès direct aux rubriques principales
(Ex. Carte/ Contact / Galerie photo…)
> Le Logo (souvent un lien de retour à la page d’accueil) présent sur chaque page

30. 4
les grandes
ÉTAPES
va i s on
ventou x
touris m e
P RO
Étape 3 : Hiérarchiser les
contenus
Quels services et fonctionnalités doivent apparaître en permanence
sur toutes les pages ? Ne pas oublier qu’un internaute peut atterrir sur
n’importe qu’elle page et pas seulement depuis la page d’accueil
Le Zoning : Le zoning permet de découper la page en autant de zones que
nécessaire. Cela permet de positionner les zones de navigation, les contenus, le
logo, le pied de page, le moteur de recherche, ou le fil d’Ariane...

31. 4
les grandes
ÉTAPES
Étape 4 : Ergonomie et design
graphique
votre site = votre identité = votre carte de visite
Réfléchissez à l’ambiance que vous souhaitez obtenir pour
votre site :
les couleurs
la tailles des boutons
les interactions ( animations au survol des liens,
des images….)
….
S’assurer de la cohérence entre l’image de votre site et vos
différents supports de communication (Cohérence graphique)
va i s on
ventou x
touris m e
P RO

32. 4
les grandes
ÉTAPES
va i s on
ventou x
touris m e
P RO
Étape 4 : Ergonomie et design
graphique EXEMPLES - CLIQUEZ CI-DESSOUS

33. 4
les grandes
ÉTAPES
Étape 5 : Mise en ligne
Une fois finalisé le site va être hébergé sur Internet il sera
ensuite accessible via une adresse URL :
www.monsiteweb.com
Hébergement : C’est le fait de mettre à disposition des internautes
les pages des sites Web en les stockant sur des ordinateurs
(serveurs) reliés en permanence à l’Internet.
Le nom de domaine : C’est une partie de l’adresse web à
laquelle le site est accessible.
www.monsiteweb.com
Préfixe // Nom de domaine // Extension
va i s on
ventou x
touris m e
P RO

34. 4
les grandes
ÉTAPES
Étape 5 : Mise en ligne
nom de domaine // Petit rappel sur les extensions
.com l’extension pour désigner des sites commerciaux, mais il est très vite
devenu le suffixe de marque sur Internet.
.fr l’extension des sites français comme on peut le deviner. Il est impossible
d’optenir un .fr si on est pas une entreprise. Un particulier peut en obtenir un mais
il faut fournir certains papiers, et il ne pourrat obtenir qu’un nom de domaine
correspondant à son nom de famille...
.eu l’extension du site de l’Union européenne.
.net C’est comme le .com, le .net est une extension très facile à obtenir, c’est
un peu moins surchargé que les .com. Au départ, le .net signifiait «ressources
réseaux».
.org Cette extension est pour les organisations diverses, organisations à but non
commercial.
.edu Les sites portant l’extension .edu sont des tous les sites d’enseignement.
.gov Le .gov est pour les sites gouvernementaux.
.biz détermine un site d’affaire, de commerce.
.mobi extension des sites de service internet pour mobil
va i s on
ventou x
touris m e
P RO
.travel pour le voyage, le tourisme.
.info Cette extension indique le site des services d’information.

35. 4
les grandes
ÉTAPES
Étape 5 : Mise en ligne
Bien choisir son nom de domaine !
Un nom de domaine mémotechnique : court percutant facile à retenir.
Ex : nomdemastructure
Un nom de domaine facilitant le référencement naturel, c’est-àdire contenant des mots clés Ex : hotel-luxe-vaison.com. Séparer les
mots par des tirets = meilleur référencement
Lorsque vous avez fait votre choix :
> Vérifier la disponibilité de votre nom de domaine
> Vérifier la disponibilité des différentes extensions (.fr, .com, .mobi..)
VOIR SUR OVH PAR EXEMPLE
va i s on
ventou x
touris m e
P RO
A noter : Un nom de domaine est « une location » à renouveler chaque
année. Vous pouvez réserver plusieurs extensions. L’ancienneté du nom
de domaine est un facteur facilitant le référencement.

36. 4
les grandes
ÉTAPES
Étape 6 : Et après ?
4 règles à respecter :
ANALYSER / Suivre le trafic (Avec google analytics)
Suivre le positionnement sur les moteurs de
recherche (Créer des alertes, vérifier sur google
de temps en temps, voir même sur google image)
Mettre à jour, enrichir constamment le contenu
Tisser un réseau autour de mon site
(se référencer dans les annuaires, faire des
échanges de liens, faire des connexions avec les
réseaux sociaux)
va i s on
ventou x
touris m e
P RO

37. Lise TRINCARETTO
Directrice
direction@vaison-ventoux-tourisme.com
Laurent PAMATO
Animateur Numérique de Territoire (ANT)
lpamato@vaison-ventoux-tourisme.com
OFFICE DE TOURISME INTERCOMMUNAL
DU PAYS VAISON VENTOUX
Place du Chanoine Sautel
Tél. 04 90 36 02 11
va i s on
vent ou x
t ou risme
PRO
© Office de Tourisme Intercommunal du Pays Vaison Ventoux