24/03/14 Rendre son site plus
performant !
Un site
performant, c’est
quoi ?
Mécanique du e-marketing
les 4 paliers décisifs
Visibilité
Accroche
Séduction
Information
Facilitation
Rassurance
Conversion

Partagerebond
abandon
Mécanique du e-marketing
Psychologie de l’internaute
- Rien n’est jamais évident pour l’internaute
- Infos simples. Phrases courtes. Peu de texte. Beaucoup d’images
- Hiérarchisation de l’info dans la mise en page (zoning)
- Eléments de conversion en avant (contact / réserver …)
- Des contenus structurés : paragraphes courts
- Un maximum d’informations (la carotte ne fonctionne pas)
- Toute information accessible en moins de 3 clics
- Accès direct/facile aux pages les plus demandées
- Plein d’ « informations de rassurance »
- Photos nombreuses et grandes
- Intégration / Valorisation d’ avis clients
- Valorisation des labels
Idiot
Aveugle
Paresseux
Peureux
Cheminement sur un site performant
Accroche (5 secondes) :
- J’identifie le site (qui, quoi, où…)
- Je sens du professionnalisme
- Il me semble agréable et clair
Découverte :
- Je comprends immédiatement l’organisation / navigation du site
- Je trouve facilement les premières informations recherchées
Usage :
- Je parcours le site et trouve facilement d’autres informations
- Les informations sont agréables à lire/voir
- Plusieurs niveaux : infos / détails / compléments d’info / suggestions
Conversion :
- je me projette ; je prévois
- Je contacte ; je réserve ;
Concrètement, sur mon site
Je soigne le zoning :
Concrètement, sur mon site
Je structure mes contenus :
- Plusieurs paragraphes par page
- Des titres de paragraphes
- Sauts de ligne (écriture aérée)
- Phrases courtes
- Photos et illustrations nombreuses
Concrètement, sur mon site
Je teste , j’applique la règle des 3 clics :
toute page est accessible depuis 1, 2 ou 3 clics maxi
Concrètement, sur mon site
Je hiérarchise l’information :
- L’information essentielle très visible (Titres)
- L’information importante est visible
(gras, souligné, illustrations…)
- Les détails et compléments d’info sont moins visibles
MAIS ils sont clairs et faciles à lire
Les photos ?
3 choses à faire avec les photos
- Des photos plus qualitatives
- Plus de photos
- Des photos optimisées : petites (ou moyennes) et lègères
Pourquoi une photo est efficace
- Elle est prise avec un bon appareil
- Elle est prise au bon moment (saison, météo…)
- Elle montre ce qu’il y a de plus valorisant
- Elle est originale
- Elle invite à la projection (mise en situation)
Plus de photos, ça veut dire :
- des photos très visibles en page d’accueil
- des photos sur toutes les pages intérieures
- une page dédiée aux photos (galerie photos)
- des photos de thématiques annexes (
Optimisation d’une photo :
> Redimensionner la photo (1000px max)
> Compresser en jpg (qualité inférieure à 50%)
>>> Image inférieure à 200 ko
La Rassurance
Les éléments de rassurance
Ce sont toutes les informations qui vont rassurer
l’internaute, lui ôter les freins psychogiques à la conversion
Important :
sur le web, le moindre doute entraine un abandon
Les éléments de rassurance dans le tourisme
- Identité claire du site - Paiement sécurisé
- Labels , récompenses - Disponibilités
- Partenariats (institutionnels) - Contacts (tél, mail)
- Descriptions détaillées - Avis clients
- Garanties, engagements, charte - Services +
- Information large (environnement, activités…)
- Sobriété graphique
- Nom de domaine
>>> Afficher les éléments de rassurance à différentes étapes de
la visite du site
Le clic de conversion
Incitation à la conversion
Proposer la conversion à divers endroits du site
( voire sur toutes les pages )
5 Trucs à supprimer
A supprimer de mon site
Les animations « Flash » sur mon site >
La musique (ou autre son d’ambiance)
Les Gifs animés
Les couleurs de fonds malheureuses
Compteurs de visite
Ma « splash page »
Les animations « Flash » sur mon site >
La musique (ou autre son d’ambiance)
Les Gifs animés
Les couleurs de fonds « malheureuses »
Mon compteur de visite
Ma « splash page »
Gifs animés
Splash Page
15 supers outils pour
enrichir mon site web
Comprendre la notion d’intégration
Intégrer
Dans mon site internet, je peux intégrer des éléments
(données, images, fonctionnalités…) qui viennent
d’ailleurs (autre site, serveur…)
Exemples : carte, video…
Comment faire ?
Généralement, le service « intégrable » fournit un code à
copier-coller dans mon site. (« embedded code »)
2 principaux types de codes : Javascript ou Iframe
Widget
Outil proposant une (des) fonctionnalité(s) particulière(s)
pouvant être intégré dans un site web facilement (code)
Les Widgets Sitra
A quoi ça sert ?
- Permet d’afficher de façon personnalisée de l’offre touristique
locale.
Exemples :
- Les restos alentours
- l’agenda des 8 prochains jours dans ma commune
- les sites touristiques 20km à la ronde
>>>
Google Map Engine
A quoi ça sert ?
- Permet de créer des cartes personnalisées, d’y intégrer des
données, calques, icones, etc….
S’intègre ensuite dans n’importe quel site
https://mapsengine.google.com/map/
>>>
Moteur de recherche personnalisé
A quoi ça sert ?
- Permet d’intégrer un moteur de recherche à mon site internet.
S’intègre ensuite dans n’importe quel site
https://www.google.fr/cse/?hl=fr
>>>
Google Translate
A quoi ça sert ?
- Permet d’intégrer Google Traduction à mon site internet.
http://translate.google.fr/?hl=fr puis « Gadget Traduction »
>>>
Google Drive (formulaire)
A quoi ça sert ?
- Permet de créer des formulaires, de les intégrer dans mon
site, puis de recevoir/traiter les réponses.
https://drive.google.com
>>>
Wufoo
A quoi ça sert ?
- Permet de créer des formulaires avancés, de les intégrer dans
mon site, puis de recevoir/traiter les réponses.
http://www.wufoo.com/
>>>
Calameo
A quoi ça sert ?
- Permet de mettre en ligne une brochure pdf (magazine, livre),
puis de l’intégrer dans mon site.
Elle sera alors « feuilletée en ligne »
Maxi 100MO/brochure
http://fr.calameo.com/
>>>
Slideshare
A quoi ça sert ?
- Permet de mettre en ligne une présentation (powerpoint ou
pdf) et de l’intégrer dans mon site.
Les diapositives défileront dans la page voulue.
http://fr.slideshare.net/
>>>
Prezi
A quoi ça sert ?
- Permet de créer une présentation originale et de l’intégrer
dans mon site.
https://prezi.com/
>>>
Add this
A quoi ça sert ?
- Permet d’intégrer à mon site, des fonctionnalités de partage
sur les réseaux sociaux.
Boutons / barres personnalisables
https://www.addthis.com/get/sharing
>>>
Modules facebook
A quoi ça sert ?
- Permet d’intégrer à mon site, des fonctionnalités propres à
facebook : suivi, partage…
« facebook social plugins »
https://developers.facebook.com/docs/plugins/
>>>
Likebox : incite à suivre une page facebook
FB Comments: permet de laisser des commentaires
Widgets TripAdvisor
A quoi ça sert ?
- Permet d’intégrer à mon site, des fonctionnalités propres à
Tripadvisor : dépôt d‘avis, affichage de ma note, etc…
www.tripadvisor.fr/Widgets
>>>
Cincopa
A quoi ça sert ?
- Permet d’intégrer à mon site, une gallerie photo, un slider ou
autres effets liés à l’image.
http://www.cincopa.com
MERCI 

A6 rendre son site plus performant

  • 1.
    24/03/14 Rendre sonsite plus performant !
  • 2.
  • 3.
    Mécanique du e-marketing les4 paliers décisifs Visibilité Accroche Séduction Information Facilitation Rassurance Conversion  Partagerebond abandon
  • 4.
    Mécanique du e-marketing Psychologiede l’internaute - Rien n’est jamais évident pour l’internaute - Infos simples. Phrases courtes. Peu de texte. Beaucoup d’images - Hiérarchisation de l’info dans la mise en page (zoning) - Eléments de conversion en avant (contact / réserver …) - Des contenus structurés : paragraphes courts - Un maximum d’informations (la carotte ne fonctionne pas) - Toute information accessible en moins de 3 clics - Accès direct/facile aux pages les plus demandées - Plein d’ « informations de rassurance » - Photos nombreuses et grandes - Intégration / Valorisation d’ avis clients - Valorisation des labels Idiot Aveugle Paresseux Peureux
  • 5.
    Cheminement sur unsite performant Accroche (5 secondes) : - J’identifie le site (qui, quoi, où…) - Je sens du professionnalisme - Il me semble agréable et clair Découverte : - Je comprends immédiatement l’organisation / navigation du site - Je trouve facilement les premières informations recherchées Usage : - Je parcours le site et trouve facilement d’autres informations - Les informations sont agréables à lire/voir - Plusieurs niveaux : infos / détails / compléments d’info / suggestions Conversion : - je me projette ; je prévois - Je contacte ; je réserve ;
  • 6.
    Concrètement, sur monsite Je soigne le zoning :
  • 7.
    Concrètement, sur monsite Je structure mes contenus : - Plusieurs paragraphes par page - Des titres de paragraphes - Sauts de ligne (écriture aérée) - Phrases courtes - Photos et illustrations nombreuses
  • 9.
    Concrètement, sur monsite Je teste , j’applique la règle des 3 clics : toute page est accessible depuis 1, 2 ou 3 clics maxi
  • 10.
    Concrètement, sur monsite Je hiérarchise l’information : - L’information essentielle très visible (Titres) - L’information importante est visible (gras, souligné, illustrations…) - Les détails et compléments d’info sont moins visibles MAIS ils sont clairs et faciles à lire
  • 11.
  • 12.
    3 choses àfaire avec les photos - Des photos plus qualitatives - Plus de photos - Des photos optimisées : petites (ou moyennes) et lègères
  • 13.
    Pourquoi une photoest efficace - Elle est prise avec un bon appareil - Elle est prise au bon moment (saison, météo…) - Elle montre ce qu’il y a de plus valorisant - Elle est originale - Elle invite à la projection (mise en situation)
  • 19.
    Plus de photos,ça veut dire : - des photos très visibles en page d’accueil - des photos sur toutes les pages intérieures - une page dédiée aux photos (galerie photos) - des photos de thématiques annexes (
  • 20.
    Optimisation d’une photo: > Redimensionner la photo (1000px max) > Compresser en jpg (qualité inférieure à 50%) >>> Image inférieure à 200 ko
  • 21.
  • 22.
    Les éléments derassurance Ce sont toutes les informations qui vont rassurer l’internaute, lui ôter les freins psychogiques à la conversion Important : sur le web, le moindre doute entraine un abandon
  • 24.
    Les éléments derassurance dans le tourisme - Identité claire du site - Paiement sécurisé - Labels , récompenses - Disponibilités - Partenariats (institutionnels) - Contacts (tél, mail) - Descriptions détaillées - Avis clients - Garanties, engagements, charte - Services + - Information large (environnement, activités…) - Sobriété graphique - Nom de domaine >>> Afficher les éléments de rassurance à différentes étapes de la visite du site
  • 25.
    Le clic deconversion
  • 26.
    Incitation à laconversion Proposer la conversion à divers endroits du site ( voire sur toutes les pages )
  • 27.
    5 Trucs àsupprimer
  • 28.
    A supprimer demon site Les animations « Flash » sur mon site > La musique (ou autre son d’ambiance) Les Gifs animés Les couleurs de fonds malheureuses Compteurs de visite Ma « splash page » Les animations « Flash » sur mon site > La musique (ou autre son d’ambiance) Les Gifs animés Les couleurs de fonds « malheureuses » Mon compteur de visite Ma « splash page »
  • 29.
  • 30.
  • 31.
    15 supers outilspour enrichir mon site web
  • 33.
    Comprendre la notiond’intégration Intégrer Dans mon site internet, je peux intégrer des éléments (données, images, fonctionnalités…) qui viennent d’ailleurs (autre site, serveur…) Exemples : carte, video… Comment faire ? Généralement, le service « intégrable » fournit un code à copier-coller dans mon site. (« embedded code ») 2 principaux types de codes : Javascript ou Iframe Widget Outil proposant une (des) fonctionnalité(s) particulière(s) pouvant être intégré dans un site web facilement (code)
  • 34.
    Les Widgets Sitra Aquoi ça sert ? - Permet d’afficher de façon personnalisée de l’offre touristique locale. Exemples : - Les restos alentours - l’agenda des 8 prochains jours dans ma commune - les sites touristiques 20km à la ronde >>>
  • 35.
    Google Map Engine Aquoi ça sert ? - Permet de créer des cartes personnalisées, d’y intégrer des données, calques, icones, etc…. S’intègre ensuite dans n’importe quel site https://mapsengine.google.com/map/ >>>
  • 36.
    Moteur de recherchepersonnalisé A quoi ça sert ? - Permet d’intégrer un moteur de recherche à mon site internet. S’intègre ensuite dans n’importe quel site https://www.google.fr/cse/?hl=fr >>>
  • 37.
    Google Translate A quoiça sert ? - Permet d’intégrer Google Traduction à mon site internet. http://translate.google.fr/?hl=fr puis « Gadget Traduction » >>>
  • 38.
    Google Drive (formulaire) Aquoi ça sert ? - Permet de créer des formulaires, de les intégrer dans mon site, puis de recevoir/traiter les réponses. https://drive.google.com >>>
  • 39.
    Wufoo A quoi çasert ? - Permet de créer des formulaires avancés, de les intégrer dans mon site, puis de recevoir/traiter les réponses. http://www.wufoo.com/ >>>
  • 40.
    Calameo A quoi çasert ? - Permet de mettre en ligne une brochure pdf (magazine, livre), puis de l’intégrer dans mon site. Elle sera alors « feuilletée en ligne » Maxi 100MO/brochure http://fr.calameo.com/ >>>
  • 41.
    Slideshare A quoi çasert ? - Permet de mettre en ligne une présentation (powerpoint ou pdf) et de l’intégrer dans mon site. Les diapositives défileront dans la page voulue. http://fr.slideshare.net/ >>>
  • 42.
    Prezi A quoi çasert ? - Permet de créer une présentation originale et de l’intégrer dans mon site. https://prezi.com/ >>>
  • 43.
    Add this A quoiça sert ? - Permet d’intégrer à mon site, des fonctionnalités de partage sur les réseaux sociaux. Boutons / barres personnalisables https://www.addthis.com/get/sharing >>>
  • 44.
    Modules facebook A quoiça sert ? - Permet d’intégrer à mon site, des fonctionnalités propres à facebook : suivi, partage… « facebook social plugins » https://developers.facebook.com/docs/plugins/ >>>
  • 45.
    Likebox : inciteà suivre une page facebook
  • 46.
    FB Comments: permetde laisser des commentaires
  • 47.
    Widgets TripAdvisor A quoiça sert ? - Permet d’intégrer à mon site, des fonctionnalités propres à Tripadvisor : dépôt d‘avis, affichage de ma note, etc… www.tripadvisor.fr/Widgets >>>
  • 48.
    Cincopa A quoi çasert ? - Permet d’intégrer à mon site, une gallerie photo, un slider ou autres effets liés à l’image. http://www.cincopa.com
  • 49.