#prezsynerg
Hashtag twitter :
La Junior-Entreprise du Web
Qui sommes-nous ?
• Synerg’heTiC en chiffres
2004 : Création de la JE
2006 : Label meilleur espoir
120 : Études réalisées ...
Nos références
Viral Film Festival
www.viralfilmfestival.ch
Groupe Chronos
www.groupechronos.org
Générali Formation
Outil ...
Nos références
Portail des Métiers de l’Internet
www.metiers.internet.gouv.fr
Film Danone
Communication interne
Beauty Exe...
5
Réaliser et promouvoir
un site internet
5
Robin Llopis
Président
Estelle Courdoisy
Resp. Projets
Hedi Smida
Resp. Commer...
6
Sommaire
La création d’un site web, de A à Z
Objectifs, cibles, concurrence : définir la stratégie de communication
Arbo...
7
Sommaire
Un site mais pas seulement
Stratégie de communication globale
Facebook : l’incontournable
Twitter : l’instantan...
8
8
Communiquer sur Internet
9
Chiffres clés :
9
• Internet en France
20,4 millions d’abonnements au haut débit
37,4 millions d’internautes en juillet
...
10
Créer son site web
11
11
Expression des besoins
12
Objectifs, cibles, concurrence : définir la stratégie de communication
12
• Pourquoi ?
Générer / augmenter le chiffre d...
13
Objectifs, cibles, concurrence : définir la stratégie de communication
13
• Pour qui ?
Particuliers ou professionnels ?...
14
Objectifs, cibles, concurrence : définir la stratégie de communication
14
• La concurrence
Ai-je identifié mes concurre...
15
Objectifs, cibles, concurrence : définir la stratégie de communication
15
• La stratégie
Les actions à mettre en oeuvre...
16
16
Organisation des contenus
17
Arborescence, contenus : la structure générale
17
• L’arborescence
L’organisation des pages et de la navigation
Regroup...
18
Arborescence, contenus : la structure générale
18
• Les contenus
Quelles sont les natures de contenus qui serviront au ...
19
Arborescence, contenus, et référencement naturel
19
20
Arborescence, contenus, et référencement naturel
20
• Le référencement naturel
Le SEO (Search Engine Optimization) se p...
21
Arborescence, contenus, et référencement naturel
21
• Les leviers
Soigner la densité des mots-clés
Soigner son arboresc...
22
22
Conception ergonomique
23
Conception ergonomique
23
WireframesWireframesZoningZoning Cinématiques
(storyboard)
Cinématiques
(storyboard)
24
Conception ergonomique
24
Zoning
25
Conception ergonomique
25
Wireframe
26
Conception ergonomique
26
Cinématiques
27
Conception ergonomique
27
• Le «Grid System»
Impossible de concevoir une interface sans grille de référence
Structure l...
28
Conception ergonomique
28
Interface de site utilisant un «Grid System» à 16 colonnes
29
Conception ergonomique
29
Interface de site utilisant un «Grid System» à 16 colonnes
30
Conception ergonomique
30
• Avant tout du bon sens
L’ergonomie est synonyme de simplicité
Les bonnes pratiques ergonomi...
31
Conception ergonomique
31
• Quels outils ?
Du papier et un crayon !
Powerpoint / Keynote (mac)
Mockingbird (en ligne)
B...
32
32
Spécifications fonctionnelles
33
Spécifications fonctionnelle : comment ça marche ?
33
• Les spécifications fonctionnelles
Détailler l’expression des be...
34
34
Spécifications techniques
35
35
Du fonctionnel au technique
Etude de faisabilité
Mise en place technique de l’ensemble des fonctionnalités
Choix de ...
36
36
CMS ou Framework ?
En utilisant un CMS, la phase de développement consiste principalement à
installer et à configure...
37
Spécifications techniques : quelle plateforme ?
37
• Quels critères ?
Le plus important : couverture fonctionnelle et p...
38
Spécifications techniques : quelle plateforme ?
38
Wordpress Drupal
39
Spécifications techniques : quelle plateforme ?
39
• Outils de benchmark
Le benchmark devient quasi inutile avec l’expé...
40
40
Conception graphique
41
41
• À qui plaire ?
C’est votre client / interlocuteur principal qu’il faut convaincre
Soyez pragmatiques
Votre client ...
42
42
• L’esprit créatif
Un webdesigner n’est pas un artiste !
La création sert des objectifs business
Un site moche peut ...
43
43
• Le choix des typos
Maximum 3 typos différentes sur un même support
Avec ou sans empattement ?
Les typos dites «web...
44
44
Intégration et développement
45
45
• L’intégration
Intégrer un site sans jouer à Tetris !
L'intégration comme outil de référencement
Les balises html o...
46
46
Intégration et développement
• HTML5/CSS3/JS
Nouveaux standard, nouvelles règles
Plus de balises -> plus de sémantiq...
47
47
<!DOCTYPE html><html lang="fr">
<head></head>
<body>
<header>
<nav></nav>
</header>
<section>
</section>
<aside>
<ar...
48
48
• L’optimisation
Optimiser pour tous les navigateurs Internet Explorer 6, oui ou non ?
La validation W3C, oui mais ....
49
49
Les méthodes de développement
Développement collaboratif
Utilisation de Subversion (système de gestion de versions)
...
50
50
L’url rewriting
Eviter les url du type "product_page.php?cat=34&id=25&color=3”
Préférer les url du type produits-sal...
51
51
Recette et debug
52
52
 La recette
Un "soupçon" d'Armagnac pour le CDP
Reprise de tous les éléments listés dans les spécifications
Vérific...
53
53
Recette et debug
Trac
54
54
Le mobile
55
Quelques chiffres
55
• Une révolution des usages
Des technologies maîtrisées : smartphones, réseaux sociaux, 3G, Wifi
L...
56
Déterminez votre stratégie
56
• Posez-vous les bonnes questions
Quelle est l’histoire à raconter ? Quel message à faire...
57
Applications VS Site mobile
57
• La guerre des stores
Apple caracole en tête avec 60 % du marché (!)
La forte progressi...
58
Applications VS Site mobile
58
• Les applications sont reines
Des dispositifs riches en médias (son, vidéo, GPS, Sms …)...
59
Applications VS Site mobile
59
• Un accès instantané
Idéal pour générer un contact rapide
Une démocratisation des techn...
60
Conception : outils et best-practices
60
• L’ergonomie utilisateur avant tout
Lisibilité, simplicité d’accès et interfa...
61
Développement Web Apps vs Applications
61
• Des technologies courantes
Le web mobile est (relativement) simple à prendr...
62
Développement Web Apps vs Applications
62
• Des langages propriétaires
L’Objective-C, extension du C chez Apple
Java C/...
63
63
Promouvoir un site internet
64
Stratégie de communication globale
64
• Une communication se pense à 360°
Il est nécessaire d’intégrer les leviers clas...
65
Quelques chiffres
65
[Vidéo] Social Media Revolution 2
http://www.youtube.com/watch?v=lFZ0z5Fm-Ng
66
66
Facebook
67
Sur Facebook : créer et gérer une page fan
67
• Les avantages
+ de 500M d’utilisateurs dans le monde / 15M en France
Le...
68
Sur Facebook : créer et gérer une page fan
68
• Les bonnes pratiques pour sa page fan
Créer une page fan plutôt qu’un g...
69
Sur Facebook : créer et gérer une page fan
69
• En cas de problème
Ne pas s’énerver et devenir agressif
Ne pas se cache...
70
Sur Facebook : créer et gérer une page fan
70
• Le cas Nestlé
Demande de retrait de la vidéo sur Youtube
Tentative de c...
71
71
Twitter
72
Sur Twitter : comment se vendre sur Twitter ?
72
• Twitter, c’est quoi ?
C’est comme un article de blog
sauf que vous n...
73
Sur Twitter : comment se vendre sur Twitter ?
73
Un feedback de ses clients en temps réel
• Les avantages
Une progressi...
74
Sur Twitter : comment se vendre sur Twitter ?
74
Ne pas utiliser Twitter que pour sa promotion personnelle
• Les bonnes...
75
75
Blog
76
Blog : un outil à intégrer
76
• Du contenu de qualité, régulièrement
Se positionner en tant qu’expert sur son domaine
A...
77
77
Newsletter
78
Mettre en place une newsletter
78
Du trafic qualifié à moindre coût
• Les avantages
Facilité d’inscription et d’utilisa...
79
79
Quelques pistes à explorer
80
Quelques pistes à explorer
80
• Des outils supplémentaires
Création de chaînes youtube, dailymotion, viméo...
- Central...
81
Développement Web Apps vs Applications
81
Développement mobile
http://www.appcelerator.com/
http://jquerymobile.com/
ht...
82
Sur Facebook : créer et gérer une page fan
82
Facebook
Inside Facebook.com
Mashable (Facebook Guidebook)
Tigerlily (Per...
83
Quelques pistes à explorer
83
• Quelques lecturesLectures conseillées :
Ergonomie Web
Amélie Boucher
http://www.ergolab...
84
Sources
84
• On les remercie beaucoup :
Vanksen pour le partage de toutes leurs présentations
http://www.slideshare.net...
On reste en contact ?
twitter.com/synerghetic
facebook.com/synerghetic.je
blog.synerghetic.net/
contact@synerghetic.net
Prochain SlideShare
Chargement dans…5
×

Formation : Réaliser et promouvoir un site internet (V2)

3 056 vues

Publié le

Support de la formation "Créer et promouvoir un site internet" donnée à l'occasion du Congrès National d'Hiver des Junior-Entreprises 2010.

Publié dans : Technologie, Business
0 commentaire
2 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
3 056
Sur SlideShare
0
Issues des intégrations
0
Intégrations
272
Actions
Partages
0
Téléchargements
0
Commentaires
0
J’aime
2
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive
  • Ajouter : parmi les 30 meilleures JE en 2010 -&amp;gt; OK
    Mettre à jour graphique -&amp;gt; Chiffres ?
  • Mettre à jour ?
  • Mettre à jour ?
  • Mettre à jour les noms
  • Communiquer grâce à internet
    Chiffres clés
    I –Créer son site internet
    Etape 1 : Objectifs, cibles, concurrence -&amp;gt; stratégie de communication
    Etape 2 : Arborescence, contenus -&amp;gt; structure générale
    Etape 3 : Conception ergonomique -&amp;gt; Accès à l’information
    Etape 4 : Spécifications fonctionnelles -&amp;gt; Comment ca marche ?
    Etape 5 : spécifications techniques -&amp;gt; Quelle plateforme ?
    Etape 5 : Conception graphique -&amp;gt; la première impression
    Etape 6 : Intégration et développement -&amp;gt; Ca prend forme
    Etape 7 : Recette -&amp;gt; debug et finalisation
    II – le mobile
    -Quelques chiffres
    Application vs site mobile
    Conception et réalisation
    III – Un site mais pas seulement
    -Stratégie de communication globale (on/off line)
    -Facebook
    -Twitter
    Newsletter
    Blog
    - Boite à outils
  • III – Un site mais pas seulement
    -Stratégie de communication globale (on/off line)
    -Facebook
    -Twitter
    Newsletter
    Blog
    - Boite à outils
  • A garder ??
  • Pertinence ici ?
  • Rarement la totale…
    En fonction des types de sites
  • Ajouter quelques outils en ligne ?
    Photoshop pour l’ergo ?
  • ATTENTION : lien mord
    Se fait en parrallele de l’ergonomie
  • Compléter cette partie -&amp;gt; Ne pas entrer en conflit avec les spécifications techniques et le choix de la solution
  • Compléter cette partie -&amp;gt; Ne pas entrer en conflit avec les spécifications techniques et le choix de la solution
  • Enlever joomla
    Ajouter magento
    Ezpublish ?
    Apuis sur le choix de la solution technique
    Ajout CMS vs Framework
    Fait partie de la technique
  • Pertinence ici ?
  • Pas forcément à l’utilisateur final !
    ??
  • Mettre à jout la partie CSS3
  • Partie sur l’intégration trop longue
  • Mettres des exemples de bonnes pratiques mais sous une autre forme
  • Pertinence ?
  • Pertinence ?
  • Agile méthode de dev ? Non gestion
    - Développer sur le développement collaboratif
  • Pertinence ici ?
  • Test de l’ensemble des fonctionnalités du site
    Résolution de tous les bugs
    ATTENTION : ce n’est pas au client de faire la recette -&amp;gt; différence entre recette (debug) et vérification du respect des specs
    Prévoir la marge nécessaire aux corrections éventuelles
    Des outils existent pour organiser le reporting des bugs
  • Ajouter redmine
  • Plus sous forme de liens vers des outils ?
  • - Augmentation de la base de données mail -&amp;gt; plus de cible à fidéliser
  • Plus sous forme de liens vers des outils ?
  • Plus sous forme de liens vers des outils ?
  • A revoir
  • Ajouter le site
  • Formation : Réaliser et promouvoir un site internet (V2)

    1. 1. #prezsynerg Hashtag twitter : La Junior-Entreprise du Web
    2. 2. Qui sommes-nous ? • Synerg’heTiC en chiffres 2004 : Création de la JE 2006 : Label meilleur espoir 120 : Études réalisées en 5 ans 100k€ : CA atteint en 2010 (+20%) Parmi les 30 meilleures JE en 2010 ! La Junior-Entreprise d’Hétic, Multimédia / Management / Informatique
    3. 3. Nos références Viral Film Festival www.viralfilmfestival.ch Groupe Chronos www.groupechronos.org Générali Formation Outil interne
    4. 4. Nos références Portail des Métiers de l’Internet www.metiers.internet.gouv.fr Film Danone Communication interne Beauty Executive www.beautyexecutive.com
    5. 5. 5 Réaliser et promouvoir un site internet 5 Robin Llopis Président Estelle Courdoisy Resp. Projets Hedi Smida Resp. Commercial
    6. 6. 6 Sommaire La création d’un site web, de A à Z Objectifs, cibles, concurrence : définir la stratégie de communication Arborescence, contenus : la structure générale Conception ergonomique : accès à l’information Spécifications fonctionnelles : comment ça marche ? Conception graphique : la première impression Intégration et développement : ça prend forme ! Recette : debug et finalisation 6 Spécifications techniques : quelle plateforme ? Communiquer sur Internet Quelques chiffres clés
    7. 7. 7 Sommaire Un site mais pas seulement Stratégie de communication globale Facebook : l’incontournable Twitter : l’instantané Blog : un outil à intégrer 7 Newsletter Quelques pistes à explorer Le mobile Quelques chiffres Déterminez votre stratégie Conception : outils et best-practices Développement Web Apps vs Applications Application vs site mobile
    8. 8. 8 8 Communiquer sur Internet
    9. 9. 9 Chiffres clés : 9 • Internet en France 20,4 millions d’abonnements au haut débit 37,4 millions d’internautes en juillet 32,5 millions € : chiffre d’affaires prévu sur la vente en ligne 92 % des français se connectent pour surfer tous les jours* Une population de plus en plus connectée *Chiffres pour l’année 2010 ARCEP, TNT/Sofres en France
    10. 10. 10 Créer son site web
    11. 11. 11 11 Expression des besoins
    12. 12. 12 Objectifs, cibles, concurrence : définir la stratégie de communication 12 • Pourquoi ? Générer / augmenter le chiffre d’affaires ? Constituer une base de données utilisateurs ? Déclencher un premier contact / une demande de devis ? ... Aider le client à formuler clairement ses attentes
    13. 13. 13 Objectifs, cibles, concurrence : définir la stratégie de communication 13 • Pour qui ? Particuliers ou professionnels ? Quelle tranche d’âge ? Sont-ils à l’aise sur internet ? Quelles sont leurs habitudes de consommation ? Création de «personas» (profils d’utilisateurs fictifs) Apprendre à connaître ses futurs utilisateurs
    14. 14. 14 Objectifs, cibles, concurrence : définir la stratégie de communication 14 • La concurrence Ai-je identifié mes concurrents, ou ceux de mon client ? Quels sont leurs points forts ? Quelles sont leurs faiblesses / leurs erreurs ? Comment faire mieux ? Se positionner face à ses concurrents
    15. 15. 15 Objectifs, cibles, concurrence : définir la stratégie de communication 15 • La stratégie Les actions à mettre en oeuvre pour atteindre les objectifs fixés Déterminer l’expérience souhaitée pour l’utilisateur Un site à dimension événementielle (période limitée dans le temps) ? Un site à fort contenu éditorial ? Ce choix pré-détermine en partie les choix techniques Pour un site internet utile, utilisable et utilisé
    16. 16. 16 16 Organisation des contenus
    17. 17. 17 Arborescence, contenus : la structure générale 17 • L’arborescence L’organisation des pages et de la navigation Regrouper les rubriques de façon pertinente et intuitive Hiérarchiser les contenus selon leur importance vis-à-vis des objectifs Organiser le site de la façon la plus intuitive pour l’utilisateur
    18. 18. 18 Arborescence, contenus : la structure générale 18 • Les contenus Quelles sont les natures de contenus qui serviront au mieux la stratégie ? Texte / Photos (HD) / Vidéos (HD) / Sons Comment les valoriser pour les moteurs de recherche ? Les contenus constituent le coeur du site !
    19. 19. 19 Arborescence, contenus, et référencement naturel 19
    20. 20. 20 Arborescence, contenus, et référencement naturel 20 • Le référencement naturel Le SEO (Search Engine Optimization) se pense dès la création de l'arborescence du site et se poursuit lors de la création des contenus Plus une page est la cible de liens en rapport avec son contenu, plus elle a de poids, plus elle remonte dans les résultats de recherche Définir des mots-clés ou expressions-clés (long tail) ordonnés par importance L’arborescence du site participe à l’efficacité du référencement Trouver l’équilibre entre le contenu orienté visiteur et le contenu orienté moteur de recherche
    21. 21. 21 Arborescence, contenus, et référencement naturel 21 • Les leviers Soigner la densité des mots-clés Soigner son arborescence et ses liens internes Créer une stratégie de back link efficace Soigner vos balises meta en début de page (title, description et keywords) Respecter la sémantique du code Privilégier la qualité à la quantité
    22. 22. 22 22 Conception ergonomique
    23. 23. 23 Conception ergonomique 23 WireframesWireframesZoningZoning Cinématiques (storyboard) Cinématiques (storyboard)
    24. 24. 24 Conception ergonomique 24 Zoning
    25. 25. 25 Conception ergonomique 25 Wireframe
    26. 26. 26 Conception ergonomique 26 Cinématiques
    27. 27. 27 Conception ergonomique 27 • Le «Grid System» Impossible de concevoir une interface sans grille de référence Structure la page Garantit la cohérence entre les différents gabarits de page Il guide la lecture et confère une sensation d’harmonie Conserver une mise en page cohérente
    28. 28. 28 Conception ergonomique 28 Interface de site utilisant un «Grid System» à 16 colonnes
    29. 29. 29 Conception ergonomique 29 Interface de site utilisant un «Grid System» à 16 colonnes
    30. 30. 30 Conception ergonomique 30 • Avant tout du bon sens L’ergonomie est synonyme de simplicité Les bonnes pratiques ergonomiques s’acquièrent facilement en observant les sites à très forte audience : Amazon, Yahoo, Google, Facebook... Ces géants du web ont tous mené des études et des tests utilisateurs coûteux, auxquels tous les professionnels se fient au quotidien Penser l’utilisation du site pour ses propres parents
    31. 31. 31 Conception ergonomique 31 • Quels outils ? Du papier et un crayon ! Powerpoint / Keynote (mac) Mockingbird (en ligne) Balsamiq Omnigraffle Axure ... Les outils les plus simples sont les meilleurs
    32. 32. 32 32 Spécifications fonctionnelles
    33. 33. 33 Spécifications fonctionnelle : comment ça marche ? 33 • Les spécifications fonctionnelles Détailler l’expression des besoins Recenser toutes les fonctionnalités du site internet Identifier et caractériser tous les contenus Des spécifications fonctionnelles complètes garantissent un développement et un suivi de production optimaux
    34. 34. 34 34 Spécifications techniques
    35. 35. 35 35 Du fonctionnel au technique Etude de faisabilité Mise en place technique de l’ensemble des fonctionnalités Choix de la plate-forme technique globale Concrétisation des besoins Spécifications techniques : quelle plateforme ?
    36. 36. 36 36 CMS ou Framework ? En utilisant un CMS, la phase de développement consiste principalement à installer et à configurer les différents modules En utilisant un Framework, le développement spécifique est facilité par l’emploi de librairies pré-existantes Le «from scratch» est à proscrire, même pour des projets simples (sécurité, maintenance, pérennité...) Différents chemins face au besoin Spécifications techniques : quelle plateforme ?
    37. 37. 37 Spécifications techniques : quelle plateforme ? 37 • Quels critères ? Le plus important : couverture fonctionnelle et pérennité de la solution Facilité de mise à jour ou de reprise par un autre prestataire Présence et efficacité de la communauté ou de l’entreprise Du benchmark en veux-tu ? En voilà !
    38. 38. 38 Spécifications techniques : quelle plateforme ? 38 Wordpress Drupal
    39. 39. 39 Spécifications techniques : quelle plateforme ? 39 • Outils de benchmark Le benchmark devient quasi inutile avec l’expérience Excel est votre ami Alpha.benchmarkr.com : générateur et facilitateur de benchmark Des outils et de la logique
    40. 40. 40 40 Conception graphique
    41. 41. 41 41 • À qui plaire ? C’est votre client / interlocuteur principal qu’il faut convaincre Soyez pragmatiques Votre client aura le dernier mot Conception graphique
    42. 42. 42 42 • L’esprit créatif Un webdesigner n’est pas un artiste ! La création sert des objectifs business Un site moche peut inspirer confiance (Craiglist, Amazon...) Un benchmark graphique du secteur est indispensable Le graphisme se juge sur des critères objectifs Conception graphique
    43. 43. 43 43 • Le choix des typos Maximum 3 typos différentes sur un même support Avec ou sans empattement ? Les typos dites «web safe» : Arial, Times, Georgia, Trebuchet, Verdana... Grâce au CSS3, il est possible d’utiliser quasiment n’importe quelle typo Un site internet n’a pas la lisibilité d’un magazine papier Conception graphique
    44. 44. 44 44 Intégration et développement
    45. 45. 45 45 • L’intégration Intégrer un site sans jouer à Tetris ! L'intégration comme outil de référencement Les balises html ont un sens et sont régies par des règles De la qualité de l’intéAndroid dépend l’efficacité du plan de référencement Intégration et développement
    46. 46. 46 46 Intégration et développement • HTML5/CSS3/JS Nouveaux standard, nouvelles règles Plus de balises -> plus de sémantique Plus de libertés L’intégration s’anime
    47. 47. 47 47 <!DOCTYPE html><html lang="fr"> <head></head> <body> <header> <nav></nav> </header> <section> </section> <aside> <article> </article> </aside> <footer></footer> </body> </html> Intégration et développement Organisation sémantique d’une page HTML5
    48. 48. 48 48 • L’optimisation Optimiser pour tous les navigateurs Internet Explorer 6, oui ou non ? La validation W3C, oui mais ... Intégration intelligente Tester, constater, corriger, tester, constater, corriger Intégration et développement
    49. 49. 49 49 Les méthodes de développement Développement collaboratif Utilisation de Subversion (système de gestion de versions) Extreme Programming (XP) La phase de développement n’est pas forcément linéaire Intégration et développement
    50. 50. 50 50 L’url rewriting Eviter les url du type "product_page.php?cat=34&id=25&color=3” Préférer les url du type produits-salles-de-bains/R2D2-bathroom-soap.html Respecter les règles habituelles : pas d'accents, d'espaces, de caractères exotiques Utile pour les moteurs de recherche et les visiteurs Intégration et développement
    51. 51. 51 51 Recette et debug
    52. 52. 52 52  La recette Un "soupçon" d'Armagnac pour le CDP Reprise de tous les éléments listés dans les spécifications Vérifications du respects des différents standards Report et résolution des différents bugs  Des outils existent pour organiser le reporting des bugs  Le client doit s’investir dans la phase de recette Prévoir la marge nécessaire aux corrections éventuelles Recette et debug
    53. 53. 53 53 Recette et debug Trac
    54. 54. 54 54 Le mobile
    55. 55. 55 Quelques chiffres 55 • Une révolution des usages Des technologies maîtrisées : smartphones, réseaux sociaux, 3G, Wifi Les forfaits Internet explosent : 19,4 millions d’actifs 3G en France en 2010 Plus de 3 milliards d’applications téléchargées sur l’App Store ... 300% de croissance prévus sur 2 ans sur le marché des applications !
    56. 56. 56 Déterminez votre stratégie 56 • Posez-vous les bonnes questions Quelle est l’histoire à raconter ? Quel message à faire passer ? Quelle expérience offrir ? Quels objectifs ? A qui s’adresse t’on ? Quelle est la finalité de la prise de parole ? Du mobile, mais pas n’importe comment !
    57. 57. 57 Applications VS Site mobile 57 • La guerre des stores Apple caracole en tête avec 60 % du marché (!) La forte progression d’Android place Google second à 14% Plus de 3 milliards d’applications téléchargées sur l’App Store Des tentatives de réactions de la part de Nokia et Samsung L’iPhone est ROI
    58. 58. 58 Applications VS Site mobile 58 • Les applications sont reines Des dispositifs riches en médias (son, vidéo, GPS, Sms …) Des opérations pérennes pour un usage quotidien (alertes…) Des accès sécurisés et/ou personnalisés De nombreuses contraintes à prendre en compte (compatibilité, temps de développement, validations des Stores…) Une expérience utilisateur incomparable
    59. 59. 59 Applications VS Site mobile 59 • Un accès instantané Idéal pour générer un contact rapide Une démocratisation des technologies (HTML 5 / Javascript) Un accès direct sans passer par un Store = plus grande liberté L’utilisation des fonctionnalités des terminaux se simplifie Une compatibilité du parc mobile bien plus importante L’information partout et pour le plus grand nombre
    60. 60. 60 Conception : outils et best-practices 60 • L’ergonomie utilisateur avant tout Lisibilité, simplicité d’accès et interfaces tactiles Règles de bonne conduite dictées par le W3C Guidelines Apple et Android disponibles en ligne Simulation en local pour vérifier la cohérence de l’ensemble Une version mobile n’est pas juste plus petite
    61. 61. 61 Développement Web Apps vs Applications 61 • Des technologies courantes Le web mobile est (relativement) simple à prendre en main HTML 5, CSS 3 et Javascript simplifient le développement Sencha Touch ou jQuery Mobile offrent de nombreuses possibilités (géolocalisation, ajax, interfaces, animations) Des modules permettent de générer des pages mobiles pour la plupart des CMS Faites tester vos applications par les utilisateurs finaux
    62. 62. 62 Développement Web Apps vs Applications 62 • Des langages propriétaires L’Objective-C, extension du C chez Apple Java C/C++ ou encore Go pour Android Des plateformes de développement telles que Titanium permettent le développement multi-plateformes (en JS) Apple a récemment permis l’export via Flash (AS3) Des langages compilés, complexes et demandant une expertise
    63. 63. 63 63 Promouvoir un site internet
    64. 64. 64 Stratégie de communication globale 64 • Une communication se pense à 360° Il est nécessaire d’intégrer les leviers classiques : média, RP, événementiel Les leviers web doivent rester à l’esprit dès la conception Organiser sa communication en intégrant : - le display et l’affiliation - le référencement naturel et les liens sponsorisés - le social media - le mobile Le bon message au bon moment pour la bonne personne
    65. 65. 65 Quelques chiffres 65 [Vidéo] Social Media Revolution 2 http://www.youtube.com/watch?v=lFZ0z5Fm-Ng
    66. 66. 66 66 Facebook
    67. 67. 67 Sur Facebook : créer et gérer une page fan 67 • Les avantages + de 500M d’utilisateurs dans le monde / 15M en France Les «fans» sont des prospects qualifiés puisqu’ils se sont inscrits spontanément Elle centralise les discussions autour d’une marque, que les critiques soient bonnes ou mauvaises Elle permet de communiquer facilement et à moindre coût avec ses clients ou prospects et désamorcer des crises éventuelles La question n’est pas de savoir si on va sur Facebook, mais plutôt de savoir comment
    68. 68. 68 Sur Facebook : créer et gérer une page fan 68 • Les bonnes pratiques pour sa page fan Créer une page fan plutôt qu’un groupe Personnaliser sa page (photo de profil, onglet personnalisé...) Ne pas bloquer les contributions des utilisateurs Animer la page régulièrement (mais pas plus de 2 messages par jour) Inviter les fans à participer Définir une URL facilement accessible (ex : facebook.com/synerghetic.je) Entretenir une relation à dimension humaine Sources : Agence Vanksen
    69. 69. 69 Sur Facebook : créer et gérer une page fan 69 • En cas de problème Ne pas s’énerver et devenir agressif Ne pas se cacher ou se taire Écouter, suivre le buzz online Admettre les faits, remettre en contexte, prendre les choses en main Être honnête, ouvert et clair sur le problème (causes et solutions) Garder un visage et un langage humain, pas de «blabla» juridique Mobiliser ses influents internes/externes Expliquer les mesures prises pour corriger et empêcher le problème dans le futur Ne surtout pas censurer ses «fans» Sources : Agence Vanksen
    70. 70. 70 Sur Facebook : créer et gérer une page fan 70 • Le cas Nestlé Demande de retrait de la vidéo sur Youtube Tentative de censure des réactions des «fans» Facebook Autoritarisme, mépris et absence
    71. 71. 71 71 Twitter
    72. 72. 72 Sur Twitter : comment se vendre sur Twitter ? 72 • Twitter, c’est quoi ? C’est comme un article de blog sauf que vous n’avez que 140 caractères C’est comme une mise à jour de statut Facebook sauf que c’est visible sur une infinité de supports C’est comme un grand tchat’ sauf que vous choisissez qui vous voulez suivre C’est comme un client de messagerie instantanée sauf que c’est public et archivé sur le web Un outil de communication temps réel, simple et puissant
    73. 73. 73 Sur Twitter : comment se vendre sur Twitter ? 73 Un feedback de ses clients en temps réel • Les avantages Une progression exponentielle (300 000 nouveaux utilisateurs par jour) Une analyse en temps réel des pensées et perceptions de prospects potentiels Un moteur de recherche en temps réel Le canal par lequel les informations sont diffusées le plus rapidement Améliorer son référencement naturel (tweets indexés quasi-instantanément dans les moteurs de recherche)
    74. 74. 74 Sur Twitter : comment se vendre sur Twitter ? 74 Ne pas utiliser Twitter que pour sa promotion personnelle • Les bonnes pratiques sur Twitter Personnaliser son compte (background et informations) en reprenant la charte graphique de la marque Définir une ligne éditoriale Suivre les personnes susceptibles de vous suivre Suivre les influents du domaine Suivre ceux qui parlent de vous Alterner contenus pros et discussions plus informelles Publier par vagues discontinues (5 tweets par jour maximum) Sources : Agence Vanksen
    75. 75. 75 75 Blog
    76. 76. 76 Blog : un outil à intégrer 76 • Du contenu de qualité, régulièrement Se positionner en tant qu’expert sur son domaine Apporter son point de vue/analyse sur des sujets d’actualité Création d’une communauté de lecteurs réguliers Diffusion des billet via RSS, Digg, Delicious, Twitter… Permet d’améliorer significativement son référencement naturel Un outil parfois plus rentable qu’une campagne Adwords
    77. 77. 77 77 Newsletter
    78. 78. 78 Mettre en place une newsletter 78 Du trafic qualifié à moindre coût • Les avantages Facilité d’inscription et d’utilisation : une adresse e-mail suffit Fidéliser ses utilisateurs Possibilité de personnaliser le contenu en fonction de l’utilisateur Des outils permettent d’obtenir des statistiques précises sur les liens qui ont intéressés les abonnés Un moyen supplémentaire d’augmenter le trafic vers son site internet
    79. 79. 79 79 Quelques pistes à explorer
    80. 80. 80 Quelques pistes à explorer 80 • Des outils supplémentaires Création de chaînes youtube, dailymotion, viméo... - Centraliser toutes ses vidéos - Proposer une forme alternative à l’écrit - Permettre aux utilisateurs de diffuser les vidéos sur leurs propres réseaux - Améliorer son référencement naturel Utilisation de la géolocalisation - Se référencer sur les différentes plateformes : Google Places, Dismoiou, Foursquare, FB Places - Maintenir les informations de contact disponibles et à jour - Demander des feedbacks aux utilisateurs et bénéficier des recommandations sociales - Utiliser la viralité et le côté hype de ces outils
    81. 81. 81 Développement Web Apps vs Applications 81 Développement mobile http://www.appcelerator.com/ http://jquerymobile.com/ http://developer.android.com/ http://developer.apple.com/ Plateforme de blogging : http://wordpress.org/ https://www.blogger.com/ http://www.feedburner.com/ Outils d’e-mailing : Campaign Monitor MailChimp Outils de monitoring : Twitter Search Tweetscan • Ressources
    82. 82. 82 Sur Facebook : créer et gérer une page fan 82 Facebook Inside Facebook.com Mashable (Facebook Guidebook) Tigerlily (Personnalisation page fan) Grid System http://960.gs http://www.thegridsystem.org Design http://www.kuler.com http://www.colourlovers.com Conception d’interface mobile Développement Alsa Créations (Tutos XHTML, CSS...) Fran6art (Tutos intégration Wordpress) • Ressources
    83. 83. 83 Quelques pistes à explorer 83 • Quelques lecturesLectures conseillées : Ergonomie Web Amélie Boucher http://www.ergolab.net The Smashing Book Smashing Magazine http://www.smashingmagazine.com Information Architecture Louis Rosenfeld & Peter Morville
    84. 84. 84 Sources 84 • On les remercie beaucoup : Vanksen pour le partage de toutes leurs présentations http://www.slideshare.net/culturebuzz/agence-vanksen-digitalviraladvertising-confrence-buzzthebrand-2009 http://www.slideshare.net/Vanksen/bien-grer-sa-rputation-en-ligne http://www.slideshare.net/gregfromparis/bien-gerer-son-ereputation http://www.slideshare.net/Vanksen/twitter-prsentation-complte-de-lessentiel-1903868 ReadWriteWeb pour leur excellent article http://fr.readwriteweb.com/2010/03/30/a-la-une/greenpeace-nestl-sur-facebook-lart-de-guerre/ HETIC
    85. 85. On reste en contact ? twitter.com/synerghetic facebook.com/synerghetic.je blog.synerghetic.net/ contact@synerghetic.net

    ×