dis-moi / websites Goto Github PK

At this moment we have a page "[Évolution]https://www.dismoi.io/evolutions/)" without link.

The objective here is :

• First : create a link in the footer, to give an access to the current content.
• Second : Add a link to the changelog on GitHub
• Third : Validate the idea of creating a blog (category : "improvement") to host an share well writen post about the new features.

see : https://trello.com/c/R5inVzry/569-mise-%C3%A0-jour-de-la-page-%C3%A9volutions

The idea here is to improve the conversion on the chrome store by updating the texts ans images.

In french : "D'où viennent les infos que je reçois ?"

Add this question in FAQ page in the list "Fonctionnement de l’extension".

• Write the content @MaartenLMEM.
• Integrate the content @antoinewolff

In french : "Reactiver DisMoi sous Chrome"

Add this question in FAQ page in the list "Problèmes rencontrés avec l’extension".

• Write the content @MaartenLMEM.
  Context :
  • Part of our users have their DisMoi addon installed but desactivated, then inactive.
  • Some of them don't know how to find their extension in their browser.
• Integrate the content @antoinewolff

The idea here is to provide a way for the users to report a bug.
If we had a form on the website, it must be targeted by the "Help" ("Aide") section on the extension.

see : https://trello.com/c/Hf4D2MpS/555-vous-avez-d%C3%A9couvert-un-bug-signalez-le-nous-sur-github

Home Page / Exemple 2
Ajouter le "S" à consommateurs.

https://www.dismoi.io/a-propos/

Dans paragraphe 1

Coquille à corriger : cré manque un é
C’est pour cette raison que DisMoi a été cré

Texte à modifier /
Remplacer contributeurs par "éclaireurs"
Par exemple, vous consultez un produit sur Amazon, des contributeurs sur DisMoi vous signalent des alternatives moins chères, de meilleure qualité ou plus locales.

Remplacer contributeurs par "Ces éclaireurs du web" qui vous informent...
Ces contributeurs qui vous informent sur les pages web que vous visitez, ce sont des particuliers, des média, des porteurs d’alternatives, des experts, etc.

Paragraphe 2 :

Remplacer selon les sources d'informations choisies" par Selon ses éclaireurs du web choisis"
L’ambition de DisMoi est de devenir une plateforme d’information contextuelle, permettant à chacun d’être informé suivant son contexte (page web visitée, géo-localisation du mobile, scan d’un produit…), selon les sources d’information choisies, et toujours sans publicité et sans collecte de données.

Remplacer "Et bien d'autres sources listées ici par " Et bien d'autres éclaireurs du web listés ici."
Depuis, plus de 1000 contributions visibles sur des milliers de pages web ont permis d’alimenter et lancer officiellement plusieurs sources :
– Amazon Antidote qui vous aide à vous passer d’Amazon,
– Arnaque Blocker, qui vous alerte contre les arnaques et les déconvenus d’achats
– Info ou Intox, qui vous signale des fakenews,
– Selon Que Choisir, permettant de bénéficier de ses conseils directement sur les produits que vous consultez
– et bien d’autres sources listées ici.

Paragraphe 4

Remplacer "Devenez contributeur" PAR "Devenez éclaireurs"

On the dismoi.io website, update the Hreflang and Canonical tags whenever required.

All necessary info on this supporting file: https://docs.google.com/spreadsheets/d/1IAkAy3JfJqFFa0ZvSwfC_abGEd3o181iAf7oL3mMr_A/edit#gid=2058169503

In french : "Je ne comprends pas comment ça marche, quand est-ce que je reçois des messages ?"

Add this question in FAQ page in the list "Problèmes rencontrés avec l’extension".

• Write the content @MaartenLMEM.
• Integrate the content @antoinewolff

Recommended slugs for the EN pages.

For international SEO consistency, the FR site should eventually follow the same structure. The FR URLS you see are the recommended new french URL (with /fr and /aide subfolders whenever applies). The EN URLs are the recommended EN URLs and follow the recommended international site structure.

Best way to handle this would be to do the structure changes on the FR site first, might save manual work later. All existing URLS should 301 into the new URL.

The idea here is to create an animation to explain in 5 sec the general operation of the extension.

see : https://trello.com/c/0DM3u6pK/372-site-web-partie-essayer-sans-installer

Home PAGE

Vos sources d'informations = Vos éclaireurs

Exemple 1 / Texte à remplacer par :
L'éclaireur Le Même en Mieux vous propose des alternatives à Black Market

Exemple 2 : Texte à remplacer par:
L'éclaireur "Selon 60 Millions de Consommateurs" vous informe qu'il y a un risque d’arnaque sur le site que vous visitez

Exemple 3 : Texte à remplacer par :
L'éclaireur "Amazon Antidote" vous propose une alternative moins chère que sur Amazon

• Changer la capture d'écran de l'exemple 3 qui ne contient pas la nouvelle icône d'Amazon Antidote : la bonne capture est dispo ici : https://drive.google.com/drive/u/1/folders/1Ck1ZKxq-HH5BWsTakNE824e0XNgOLziY

Exemple 4 : Texte à remplacer par : L'éclaireur "Le Même en local" vous signale le même livre disponible en librairie locale, au même prix.

Exemple 5 :
Texte à remplacer par :
L'éclaireur "Info ou Intox ?" corrige une fausse information oubliée sur un site d’actualités

Exemple 6 :
Texte à remplacer par : Un particulier, éclaireur sur DisMoi, vous signale une solution gratuite

Section COMMENT CA MARCHE ?

1. vous choisissez vos sources d'informations = REMPLACER PAR : Vous choisissez vos éclaireurs du web
2. Une fois Dismoi téléchargé, abonnez-vous aux contributeurs(trices) que vous souhaitez = REMPLACER PAR : une fois DisMoi téléchargé, abonnez-vous aux éclaireurs de votre choix.

** Section Vous aussi postez des informations sur le web"***
Remplacez texte par : "Vous aussi devenez éclaireurs du web sur DisMoi en postant des informations"

Translation work only

##Wording
sous titre :
Il me semble que Conseils et éclairages serait plus efficace dans l'enchainement que Conseils et entraide
Car "entraide" ne fait pas écho à alternative ou info éclaitante. Il introduit un 3ème terme. Qui est plus juste mais qui complexifie la compréhension.

##Mobile
Sur mobile le rendu n'est pas aussi bon qu'il y a parait dans le BO Divy.
Voici un rendu réel sur mobile d'Antoine :

• le titre est sur 3 lignes au lieu de deux
• le sous titre est coupé au dernier mot

Et voici celui sur mon mobile samsung :

Titre :
Essayer de mettre sur 2 lignes en diminuant la police

Remarque : en diminuant la taille avec Divy tu vas rencontre le problème de l'interligne qui ne dépend pas de la taille de police et qui donc trop grand (on le perçoit dans ma capture)

Sous titre

• Petit retour à la ligne comme suit pour l'équilibre visuel et faciliter la lecture :

Conseils et entraide directement 
sur les pages web que vous visitez 

• si on diminue la taille de police du titre, diminuer la taille de police du sous-titre aussi

##desktop

Sur ordinateur, le rendu actuel

Suggestions, idées :

1. Aller à la ligne comme suit :

S’il existe une meilleure alternative, 
une info éclairante, vous le saurez !

2. Faire un bouton plus large ? De la même largeur que la mention en dessous 'gratuit , sans pub, etc.'

The idea here is to integrate on the pages of "main" contributor profiles (major contributors / brand ambassadors) small video clips of 15 to 20 seconds quickly answering the following questions:

• In what context (problematic situation) can this contributor help me and / or inform me?
• What type of content does it make available to me?
• What benefit(s) does this service bring me in my user experience?

Add a link "Conditions générales d'utilisation" targeting https://www.dismoi.io/cgu/ on footer.

Update robots.txt file to include new directives. New content:

User-agent: *
Disallow: /*?aff=*
Disallow: /*&aff=*
# Disallow: /cdn-*
Disallow: /*?utm_source=*
Disallow: /*&utm_source=*
Disallow: /*?bid=*
Disallow: /*&bid=*
Disallow: /*?btag=*
Disallow: /*&btag=*
Disallow: /*?etag=*
Disallow: /*&etag=*
Disallow: /*?mid=*
Disallow: /*&mid=*
Disallow: /*?sid=*
Disallow: /*&sid=*
Disallow: /*?aid=*
Disallow: /*&aid=*
Disallow: /*?pid=*
Disallow: /*&pid=*
Disallow: /*?feed=*
Disallow: /*&feed=*
Disallow: /*author=*
Disallow: /*?m=*
Disallow: /*&m=*
Disallow: /*?p=*
Disallow: /*&p=*
Disallow: /*?cat=*
Disallow: /*&cat=*
Disallow: /*?customize_changeset=*
Disallow: /*&customize_changeset=*
Disallow: /wp-admin/
Allow: /wp-admin/admin-ajax.php
Disallow: /wp-includes/
Allow: /wp-content/uploads/
Disallow: /*/wp-content/*
Disallow: /*/?amp*
Sitemap: https://www.dismoi.io/page-sitemap.xml

• Write a first version of the content (@antoinewolff)
• Validate the content (@MaartenLMEM)
• Publicate the page (@antoinewolff)

New FR Version

Title : Mentions légales

Rendues obligatoires par la loi pour la confiance dans l’économie numérique, les mentions légales nous permettent à tous de savoir qui "se cache" derrière un site ou une application. Un des objectifs de DisMoi étant d'apporter plus de transparence au Web, nous nous plions avec plaisir à cet excercice.

Le site DisMoi.io et l'extension navigateur DisMoi, ont pour objet :

• de diffuser des conseils et éclairages directement sur les pages web que vous visitez, et ainsi réinstaurer la liberté d’information partout sur le web,
• de fournir une information sur l'ensemble des activités de l'entreprise,

Ils sont édités par la SAS DisMoi, dont le siège social est situé 118 Rue du Palais Gallien 33000 Bordeaux (France), dont le numéro de Siren est 895 146 272, représenté par John Samson, Président.

L’éditeur peut être contacté par courrier électronique à l’adresse : [email protected]

Le site est hébergé par OVH.

EN version

The website https://www.dismoi.io and its services are edited by :

SAS DisMoi, a company incorporated under French law, whose registered office is located at 118 Rue du Palais Gallien 33000 Bordeaux (France). SIREN n° 895 146 2723.

E-mail address : [email protected]
Authorized executive: John Samson
Responsible person for website content: John Samson

The content of the page "Confidentialité" must be improved.

see : https://www.mediapart.fr/confidentialite

The actual 404 page is : https://www.dismoi.io/lalala

• Create an simple illustration.
• Integrate the new 404 page.

example with Le Meme en Mieux

Currently : https://www.dismoi.io/eclaireurs/16/Le-Meme-en-Mieux

Edit : https://www.dismoi.io/**contributeurs**/16/Le-Meme-en-Mieux

Problem
When users sign up for DisMoi, they don't get to actually see a contribution. We only show them sources. This produces feelings of confusion.

Solution
If we give them an easy way to experience contributions in context right away, they will understand DisMoi faster.

Intended outcome
To increase activation and retention.

Detailed walkthrough

On dismoi.io/sources, the user should see 1 "featured contribution" up top, above the "Sources / Abonnements" selector.

The title text and styles of the contribution should be the same as seen on https://www.dismoi.io/sources/16/Le-Meme-en-Mieux (for example) under "Ses dernieres contributions"

The title text should read "Contribution phare du jour"

When the user clicks on a featured contribution, they should be...

1. automatically subscribed to the contributor and
2. directed to the URL where the contribution is pinned.

This issue is focused on getting one contribution up on the sources page. Future issues could focus on, for example, writing a script that automatically rotates the "contribution du jour" between several specified contributions each day.

see : https://extpose.com/
see : https://trello.com/c/2gfdDfKc/470-analytics-pour-le-chromestore

Les pages contributeurs (sources) présentent un problème de référencement (SEO) car :

• La page est générée dynamiquement en JS sans prerendering ;
• Google limite son budget crawl et n’exécute pas le JS sur chaque page (à vérifier) ;
• Ceci même si il y a un rendu server-side partiel (cf. Cloudflare) (avec des metas orientées SEO et partage = pas suffisant pour les moteurs de recherches) ;
• On peut notamment voir que même si les pages contributeurs sont indexées, Google ne semble rien avoir gardé en cache (exemple avec le cache de la page d'Amazon Antidote).

Solutions envisageables :

• Ajouter du prerendering quand le user agent détecté est googlebot sur les pages contributeurs.
• Migrer de stack pour avoir le SSR (server side rendering)

Objectives :

• Make the contributor pages content indexable
• Check the SERP (Search Engine Result Page) to be sure.

Right now, DisMoi has lots of examples of two things:

1. People talking about us positively on Twitter
2. Positive press/blog articles mentioning us

Putting these prominently on our homepage would be a great way to improve conversion! Social proof has huge positive impact for conversion.

I'll collect the examples, @antoinewolff what do you think is the easiest way to add this to the current website?

The website (v1) use currently Wordpress + Divi.

This stack is problematic for differents reasons :

• Difficulty in updating the content (it is often an integrator who has to take care of it).
• Poor performance (loading time).
• SEO issues related to the sources page (#124)
• Rather long integration and development time for new parts.

The needs are:

• Let the integrators take care of the content from the start. These do not need a CMS.
• Maximize performance and eliminate all unnecessary frameworks.
• Find a solution allowing indexing of the sources page (#124)
• Quickly integrate version 2 by going directly through the code.
• Keep the current content of the pages.

The first ideas are:

• Directly code the front of version 2 in pure HTML/CSS/JS.
• Use a Headless CMS.

• Define the message to deliver.
• Create a scenario.
• Record the video.
• Integrate the video. (@antoinewolff)

The goal here is to create structural wireframe to quickly get an idea of the direction we have to take :

• Home page
• Sources
• FAQ
• Content page (ex : "Contribuer")

Yes, I'm seeing a discrete Github logo in the footer but this is not enough. Are we really proud to be open libre ?

• Show Github logo on header
• Yes it's possible to contribute to the code, show it on Contribute page https://www.dismoi.io/informer/
  • Link to repo (or directly to CONTRIBUTING.md
  • Link to https://github.com/dis-moi/extension/issues/new/choose or create a form which help customize the issue

@antoinewolff I know you like that kind of stuff, have a look at this URL, you can customize GET params:
https://github.com/dis-moi/extension/issues/new?assignees=&labels=&template=bug_report.md&title=

When installing the extension, offer groups of subscriptions for particular "anti-waste", "green", "best deals" "anti-scam" profiles. This would allow users who do not want to spend too much time configuring at the start, have a good set of features and an experience that is rather close to their desires.

see : https://trello.com/c/tczVtFpu/598-lors-de-linstallation-de-lextension-proposer-des-groupes-dabonnements-pour-profil-particuliers-anti-gaspi-%C3%A9colo-meilleures-deals

It can also be connected with : #137

• Update theme css to fix the footer on bottom when the page height is lower than the window height.
  

In french : "Que se passe-t-il une fois que DisMoi est installé sur mon navigateur ?"
Context : Some hours or days after installing DisMoi, users told us they don't understand why they have no notices, no experience with Dismoi.

Add this question in FAQ page in the list "Fonctionnement de l’extension".

• Write the content @MaartenLMEM.
• Integrate the content @antoinewolff

Translation work only

Everything is in the title.

WPML or another option...

Necessary functionality:

• Ability to input translated versions of UI
• Ability to switch the language

Not sure whether it's best/easiest to translate text in-context or just create separate page in English - thoughts?

• Update FAQ > "Vie privée" page.
• Define the other actions to be done @MaartenLMEM

See Trello card : https://trello.com/c/tRq4C7DI

In french : "J'ai l'impression que mon extension est bloquée"

Add this question in FAQ page in the list "Problèmes rencontrés avec l’extension".

• Write the content @MaartenLMEM.
• Integrate the content @antoinewolff

The idea here is to permit for a contributor to add a button "voir mon profil DisMoi" on his own website.
It's a bit like the way to integrate the "I like" facebook button. But without all the spying issues.

see : https://trello.com/c/GS6GHDRT/476-lmemnet-am%C3%A9liorer-accroche-et-cta-vers-lassistant-lmem-et-autres-outils

1. Update URLS on the site to reflect:

• /fr/ subdirectory for FR site
• /en/ subdirectory for EN site
• hosting the FR help pages under /fr/aide
• hosting the EN help pages under /en/help

2. 301 redirect:

• all existing FR URLs to the new FR URLs
• wherever required, all existing EN URLs to the new EN URLs

Supporting file here: https://docs.google.com/spreadsheets/d/1IAkAy3JfJqFFa0ZvSwfC_abGEd3o181iAf7oL3mMr_A/edit#gid=2058169503

Heatmap

We need to have a heatmap on our website since Matomo doesn't provide this service for free...

Heatmap.js could be a neat alternative
https://github.com/pa7/heatmap.js

• Add <?= "copyright &copy; ".date('Y'); ?> in the footer. (@antoinewolff)

Home Page / Comment ça marche ?

1/ Remplacer sources d'informations par contributeurs

2/ Remplacer Visuel contributeurs dans le paragraphe Comment ça marche : ancienne interface et anciens descriptifs et anciens logos

• Find a way to re-display the cookies consent notice (@newick, @antoinewolff)
• Add a "En savoir plus" button targeting the "confidentialite" or "vie privée" page (@MaartenLMEM, @antoinewolff)
• Update the font size to make it smaller. (@antoinewolff)

Update TITLE and META DESCRIPTION TAGS on EN and FR pages.
Metas copy available here: https://docs.google.com/spreadsheets/d/1IAkAy3JfJqFFa0ZvSwfC_abGEd3o181iAf7oL3mMr_A/edit#gid=2058169503

If I use the smartphone and I go to https://www.dismoi.io the webpage can scroll to the right so the content is not centered anymore