building a website
© verte – Fotolia.com

La porte du restaurant s’ouvre. Il s’assoit en face de vous, pose un épais ipad sur la table et commence à énumérer la liste de ce qu’il souhaite. C’est un visionnaire qui a d’excellentes idées et qui cherche un développeur pour réaliser sa solution Web.

Chaque phrase est ponctuée de termes comme « e-marketing », « ctr », « ppt », « revenue », « buzinaisseu », « vc », « pitch »… En quelques minutes, vous êtes conquis et vous vous y voyez. Lui, son boulot sera de répondre au « Why… ». Et vous, votre travail sera désormais de répondre à la question « How… ».

Bref vous allez travailler pour un entrepreneur Web. Lui, c’est les Idées et le développement du projet. Vous, c’est la Réalisation.

Votre univers ressemblera à un iceberg. Lui, c’est le haut de l’iceberg. Il a pleins d’idées, beaucoup de contacts mais cependant une vision très limitée de ce que vous devez faire. Vous, vous êtes les fondations de l’immeuble, le chassis de la voiture, l’armature du soutien-gorge, la coloration sur la permanente ou la sucrette : rien ne peut se faire sans vous. Mais si vous travaillez ensemble, votre travail sera alors un beau succès.

Le premier souci : il faut être compétitif. En terme de prix, en s’adressant à un freelance plutôt qu’à une agence, il faut reconnaître que le risque est plus important. Cependant cela correspond à une autre approche du projet. Si j’étais Entrepreneur Web, je miserai sur la personne. Si j’étais investisseurs, je valoriserai autant l’équipe que le projet. A  quoi bon avoir une idée de génie si c’est pour la faire coder par un stagiaire ? Voire pire, en Inde ou en Chine ? Nan mais allo quoi… Un débutant coûte plus cher qu’un développeur sénior. Il va faire plus d’essais/erreurs, il a une expérience limitée, il n’a pas ou peu de réseau et donc il ne pourra pas vous aider pour recruter. Il connaîtra une ou deux technologies sans avoir vraiment d’expériences sur de réels projets. Enfin il développera moins vite, sans suivre les normes de qualité ou de programmation qui permettent de faire entrer deux ou trois développeurs rapidement dans une équipe. Un développeur junior ou un stagiaire coûte plus cher à votre projet.  Si vous n’avez pas assez d’argent pour développer votre projet, et bien gardez cet argent pour aller au restaurant plutôt que de le lancer par la fenêtre.

Bref revenons dans le restaurant. Votre interlocuteur lance un projet de plateforme Web et souhaite vous confier la réalisation technique du projet. Vous devez cadrer la solution et le prix, et l’aider à construire un projet en quelques mois. Aujourd’hui, les investisseurs étudient plutôt des projets déjà lancés, donc souvent déjà codés et en ligne.

Votre entrepreneur souhaite tout un ensemble de fonctionnalités standards :

« Je souhaite que mes visiteurs s’authentifient avec Facebook ou leur compte Google. En fait je n’ai pas envie d’avoir encore un système où il faut mettre son pseudo et son mot de passe…. Bon ok on le mettra mais en seconde option… Tenez passez moi le sucre… J’aimerais aussi pouvoir suivre l’audience du site…. Mais alors là je veux voir si le visiteur est droitier ou gaucher… la total quoi… Je veux aussi envoyer chaque semaine une lettre d’information… Avec des photos oui… Et si j’oublie mon mot de passe (car je n’ai ni Google, ni Facebook),  j’aimerais pouvoir envoyer un nouveau mot de passe…. mais sans que l’email arrive dans le petit dossier « Courrier indésirable » vous voyez ? Ajoutez à cela le besoin de pouvoir éditer du contenu Web facilement, de pouvoir aussi intégrer un système de discussion en direct pour partager avec mes futurs clients…Ah et si vous pouviez me mettre une prise allume-cigare aussi ça serait bien… non pardon je voulais voir si vous suiviez… »

Par quoi commencer ?

Il existe de plus en plus de services Webs, qui vous permettent de couvrir un bon nombre de problèmes récurrents. L’heure est de plus en plus à l’intégration de service, et l’interface technique est bien souvent constituée d’un peu d’échanges HTTP, avec parfois du Javascript côté client.

Le développement Web est vraiment passionnant car c’est un univers qui évolue rapidement. Etre développeur Web, c’est d’abord être capable de coder des pages Webs (HTML, CSS, JS). A cela, j’ajouterai une bonne connaissance du protocole HTTP, des mécanismes de caches, de sécurité et de load-balancer, avec quelques notions sous Linux. Enfin j’ajouterai aujourd’hui une connaissance des différentes API Webs telles que celles de Facebook, Mailchimp, Mailjet, Google, LinkedIn ou autre.

Je vous propose de partager ce que j’ai fait depuis 2009, en mettant en oeuvre différentes solutions pour des clients Webs. J’ai partagé l’article en 2 parties, vous retrouverez donc ici une première liste de solutions.

© iMAGINE - Fotolia.com
© iMAGINE – Fotolia.com

Quelques solutions :

  • Envoyer un email transactionnel
  • Envoyer une lettre d’information
  • S’authentifier avec son compte Google, Yahoo, LinkedIn ou Github (OpenID)
  • S’authentifier avec Facebook et accéder à l’API Social de Facebook
  • Analyser la fréquentation d’un site
  • Discuter en direct sur le site

Partie 2

  • Analyser le parcours client et détecter les circuits des visiteurs
  • Géolocaliser l’adresse IP de vos visiteurs
  • Intégrer les commentaires des visiteurs
  • Prendre en compte les idées de vos visiteurs
  • Accepter des paiements par Carte bancaire

Envoyer un email transactionnel

Cas d’usage : un nouveau visiteur s’inscrit sur le site. Vous devez lui envoyer un email pour confirmer son adresse. L’envoi doit s’effectuer en quelques minutes sans que le courrier arrive dans le dossier « spam » de votre visiteur.

Solution utilisée : Mailjet. Gratuit jusqu’à 6000 mails/mois, avec 200 emails par jour maximum.

Exemples de site : express-board, cmesdonnees.com, zaptravel.com

Les plus de cette solution : Mailjet gère correctement l’envoi afin que vos visiteurs ne récupèrent pas les emails dans le dossier « Spam ». Pour cela, Mailjet gère entre autre les entrées DNS DKIM (Domain Keys Identified Mail). L’interface d’administration permet de suivre et de s’assurer que les courriers partent bien. Le prix est très compétitif et le support est en Français. Enfin c’est du made-in France.

Envoyer une lettre d’information

Cas d’usage : envoyer chaque semaine à une catégorie de vos visiteurs un email de rappel. Préparer et diffuser une lettre d’information type Devoxx. Prendre en compte les personnes qui ne souhaitent plus recevoir ces emails.

Solution utilisée : Mailchimp.

Prix : gratuit jusqu’à 2000 membres et moins de 12k emails par mois.

Exemple de site : cmesdonnees.com, devoxx.fr et Zaptravel.com

Les plus : API facile à programmer. Vous pouvez tenir à jour facilement une liste des personnes. Possibilité de segmenter les envois. Outils de suivis dans le dashboard très pratiques et complets. C’est la solution utilisée pour Devoxx.fr. Concernant l’express-board, j’ajoute ou je retire automatiquement les emails de mes annonceurs pour pouvoir envoyer facilement mes différents emails marketing. ZapTravel utilise aussi Mailchimp, pour envoyer plusieurs milliers d’emails par semaine.

S’authentifier avec son compte Google, Yahoo, LinkedIn ou GitHub

Cas d’usage : vous codez un site où vos visiteurs doivent s’authentifier. Vous souhaitez leur permettre de s’authentifier en utilisant l’un de leurs comptes existants (Google, Yahoo, LinkedIn ou autre). Ceci afin d’éviter au visiteur de devoir à nouveau déclarer une identité et gérer un mot de passe.

Solution utilisée : OpenID codé directement à la main.

Prix : gratuit

Exemple de site : express-board.fr, leszindeps.fr et cmesdonnees.com

Les plus : facile à mettre en oeuvre du côté développeur.

A noter le service OAuth.IO.  Il s’agit d’une nouvelle solution tierce qui vous évite de devoir coder quelque chose du côté serveur. Je n’ai pas testé.

S’authentifier avec Facebook et accéder à l’API Social

Cas d’usage : en tant que visiteur, vous pouvez utiliser votre identité Facebook pour accéder au site. Le site peut aussi publier sur votre timeline Facebook des messages ou découvrir d’autres amis dans votre réseau Facebook. En tant que développeur web, vous souhaitez que les visiteurs soient « authentifiés » sans passer par un mécanisme d’envoi d’email.

Solution utilisée : API Facebook Login pour l’authentification. Graph API Facebook pour les fonctionnalités sociales. L’API demande un peu plus d’efforts de programmation, mais c’est assez facile. Sur Zaptravel nous récupérons (avec votre consentement) votre ville, afin de configurer automatiquement la ville d’origine du site.

Analyser la fréquentation du site

Cas d’usage : après avoir lancé votre site, vous souhaitez suivre le nombre de visiteurs, le parcours type et les pages de sortie de votre site.

Solution utilisée : Google Analytics

Prix : gratuit

Exemple de sites : Zaptravel.com sur lequel nous avons configuré des entonnoirs de conversion. Ceci permet de suivre le chiffre d’affaire du site chaque jour. Ensuite j’installe systématiquement Google Analytics, outil indispensable pour suivre l’audience de son site.

Les plus : possibilité de suivre en temps réel les visiteurs. Intégration avec Google Webmaster tools pour surveiller la bonne indexation de son site et les problèmes techniques. Fonction d’e-marketing assez puissante, mais vision cependant parfois un peu trop technique pour les non-techniciens. Il existe d’autres alternatives beaucoup plus marketing.

Discuter en direct sur le site

Cas d’usage : vous surfez sur le site Zaptravel.com pour chercher un voyage romantique pour deux en Italie. Après quelques minutes, vous souhaitez un renseignement complémentaire que vous ne trouvez pas sur le site. Grâce à une fenêtre de discussion intégrée sur le site, vous pouvez alors contacter un agent Zaptravel et discuter avec lui.

Solution utilisée : Olark système de discussion en direct

Prix : à partir de 44 USD par mois

Exemple de sites: Zaptravel et CMesdonnees.

Les plus : après avoir créé son compte sur Olark, il suffit d’ajouter quelques lignes de Javascript dans vos pages, de configurer un client de chat type iChat sur votre poste, et c’est tout. Lorsqu’un visiteur vous contacte, Olark vous indique les URLs des pages qu’il a visionné, sa localisation géographique et la langue de son navigateur. Très pratique, Olark vous permet de gérer un call center avec des agents.

Fin de la partie 1

Retrouvez dans la prochaine partie d’autres idées et solutions pour les points suivants :

  • Analyser le parcours client et détecter les circuits des visiteurs
  • Géolocaliser l’adresse IP de vos visiteurs
  • Intégrer les commentaires des visiteurs
  • Prendre en compte les idées/suggestions de vos visiteurs
  • Accepter des paiements par Carte bancaire

Une pensée sur « Les secrets des Architectes Webs »

  1. Articles très utiles pour les dév en startup.
    Je me permets de compléter en ajoutant quelque autres outils et alternatives que nous utilisons sur Hopwork :

    – Mail : mailgun (même model que mailjet)
    – Chat en direct : Zendesk ! Une super solution toute en un qui offre en plus une gestion du support client (téléphone) et les idées / suggestions.
    – Social : Spring Social ! Là pour le coup, sur une stack Spring, le développeur n’a pour ainsi dire « rien à faire ».
    – Paiement : ça dépend de ce qu’on veut faire mais Leetchi est très bien, j’ai d’ailleurs développé (en partie) l’API pour la JVM : https://github.com/LateralThoughts/leetchi-api-java-sdk Sinon il y a Payline.
    – Moteur de recherche : ElasticSearch !
    – Pour l’analyse de données, il existe des solutions intéressantes, mais rien ne fonctionne et / ou rien ne remplace une bonne gestion de ses données (non aux updates, oui aux architectures CQRS, Lambda, Event-Sourcing)
    – l’hébergement / Déploiement. le top c’est le « git push » sur heroku ! Sachant que Clever Cloud, Cloudfoundry et d’autres ont les mêmes facilités.

Les commentaires sont fermés.