Internet c'est de la merde

#makeinternetgreatagain

Les buzzwords du dev web

  • Accessibilité
  • Sécurité
  • Performance
  • Eco-conception
  • Données personnelles

Est-ce-que tout le monde peut utiliser ton site/app?

Est-ce-que les vilains hackers peuvent te pourrir?

Est-ce-que ton site va vite?

Est-ce-que le fond d'écran est vert?

Est-ce-que j'ai le droit de lui demander son 06?

Mais en vrai?

Accessibilité

Définition wikipedia : Accessibility is the design of products, devices, services, or environments for people with disabilities.

Sauf que c'est plus large que ça.

Accessibilité

Les autres bénéfices

HTML Sémantique =

  • Meilleur référencement naturel
  • Mieux pour du CSS lisible

Accessible pour les personnes en situation de handicap temporaire (inclusive design)

En englobant les handicaps permanents mais aussi temporaires et situationnels, on peut toucher des millions d'utilisateurs.

 

26K

13M

8M

Accessibilité

Pourquoi?

Parce que c'est dans la loi française.

Et réglementé au niveau de l'Europe.

 

[Source]

Sécurité

[Palo Alto Networks] Cybersecurity refers to the preventative techniques used to protect the integrity of networks, programs and data from attack, damage, or unauthorized access.

Sécurité

Les bénéfices

Protéger les données personnelles.

Améliorer la sécurité revient souvent à améliorer la qualité du code.

Quelques chiffres pour mieux comprendre

D'ici 2021, les cyber crimes coûteront 6 trillion de $ par an.

D'ici 2021, les dépenses dans le domaine de la cyber sécurité excéderont le trillion de $.

[source]

Sécurité

Pourquoi?

Parce que c'est votre responsabilité.

Et au coeur de la certif DWWM.

 

Performance

[Wikipedia] Web performance refers to the speed in which web pages are downloaded and displayed on the user's web browser.

Performance

Plus performant ET moins intrusif!

Performance

Les bénéfices

Simplifier les projets (=> qualité).

Alléger les projets (=> éco-conception)

40% des utilisateurs quittent un site s'il met plus de 3 secondes à charger.

[source]

 

Pourquoi?

Eco-conception

[Consomag] éco-conception = conception qui limite l’impact sur l’environnement du produit

Eco-conception

Les bénéfices

Le projet deviendra souvent plus léger (=> performance).

Une fois qu'il ne reste que l'essentiel, il est plus simple de sécuriser le tout.

Internet pollue autant que l'aviation civile

[source]

[bilan]

Pourquoi?

Pourquoi?

Rapport du CNRS sur le grand gâchis énergétique du numérique = l’ensemble des technologies numériques représente près de 10 % de la consommation mondiale d’énergie.

Si l’on considère la totalité de son cycle de vie, le simple envoi d’un mail d’1 mégaoctet (1 Mo)=l’utilisation d’une ampoule de 60 watts pendant 25 minutes, soit l’équivalent de 20 grammes de CO2 émis

Empreinte moyenne par internaute et par an : 350 kWh d’énergie;200 kg de gaz à effet de serre ;3 000 litres d’eau. [source]

Sur le web, la pub représente 39% du trafic. [source]

Données personnelles

[Wikipedia] Le règlement n° 2016/679, dit règlement général sur la protection des données (RGPD, ou encore GDPR, de l'anglais General Data Protection Regulation), est un règlement de l'Union européenne qui constitue le texte de référence en matière de protection des données à caractère personnel.

Les données sur vos utilisateurs : celles que vous récoltez et ce que vous en faites.

Voir aussi RGPD.

Données personnelles

Les bénéfices

Là aussi, ne récoltez que le nécessaire et ce sera d'autant plus simple à protéger.

Moins de données récoltées = mieux pour l'utilisateur.

[source]

Données personnelles

Données personnelles

Facebook

On a donc plusieurs notions qui ne sont pas forcément faciles à définir.

Pour les mettre en oeuvre, c'est pas simple non plus.

Et en plus, elles sont toutes liées!

Référencement

En résumé

Pour être référencé sur Google : HTTPS obligatoire

  • Plus de sécurité!
  • Moins d'accessibilité!

PWA

En résumé

Tirer parti du navigateur pour ajouter des fonctionnalités d'app mobile à un site web

  • Meilleurs perfs
  • Accessible hors-ligne
  • Installable
  • Notifications
  • Responsive

IoT

Stats

Les objets connectés se multiplient mais...

  • Séurité (shodan)
  • Eco-conception (30.000.000.000)
  • Utilité?

Conclusion

Ne vous demandez pas si ce que vous voulez mettre en place va casser le reste.

Demandez-vous quelles bonnes pratiques vont être vertueuses pour le reste.

On va essayer d'en identifier ensemble.

Bonus

Les bonnes pratiques, c'est comme les bugs : plus ça intervient tard dans le projet, plus ça coûte cher.

Bonnes pratiques

Usage quotidien

Mails : destinataires, PJ, antispam (cleanfox)

Navigateur internet : favoris, barre d’adresse, recherches précises

Attention au cloud!

Mots de passe.

Savoir ce qu'on accepte.

Ajouter une fonctionnalité, c'est facile. Mais en avez-vous vraiment besoin?

Ne risquez-vous pas d'alourdir l'expérience utilisateur?

Ne développons que ce dont nos utilisateurs ont besoin.

Choix de conception

Il n'est pas difficile de stocker des tonnes de données et de fichiers ou de tout savoir sur nos utilisateurs.

Ne collectons que les données dont nous avons vraiment l'utilité.

Dans le développement web, on tombe vite dans la surenchère : la stack technique la plus impressionnante, le CMS qui permet de tout faire.

Dimensionnons nos choix techniques en fonction de nos VRAIS besoins.

Ce n'est pas parce qu'un outil (librairie, package, CMS, etc) est largement utilisé qu'il répond aux critères de sécurité, éco-conception, performance, données personnelles.

Faisons preuve de discernement dans nos choix.

Avec AWS, Heroku, Firebase, Surge et d'autres, il est très facile d'héberger un site.

Ne laissons en ligne que ce qui est indispensable.

Continuons à partager nos bonnes pratiques et outils.

Un site web, ça coûte un pognon de dingue.

~ anonyme.

Exigeons la qualité

Le client est le mieux placé pour imposer ses exigences de qualité selon tous les critères vus précédemment.

Pour tous ceux qui contribuent à la création de sites web et d'applis, il est de notre devoir de produire des outils de qualité.

Outils d'audit

Bonus : ces outils donnent des pistes pour s'améliorer.

Quelques solutions

Opquast : couvre performance, accessibilité, seo mais aussi éco-conception et plus généralement qualité web.

https://checklists.opquast.com/fr/

=> une certification est disponible.

=> les bonnes pratiques de sécurité arrivent

Accede-web : couvre seulement l'accessibilité mais de façon très poussée

https://www.accede-web.com/notices/

 

A voir aussi, une formation en ligne gratuite (mais en anglais) :

https://classroom.udacity.com/courses/ud891

Le Collectif Conception responsable de services numériques propose plein d'outils, checklists et autres.

https://collectif.greenit.fr/outils.html

 

Et même une certification sur l'éco-conception :

https://collectif.greenit.fr/certification.html

 

Sécurité : OWASP (mais en anglais)

RGPD  : [MOOC de la CNIL]

=> manque de ressources en français

 

On notera toutefois qu'Opquast fournit déjà pas mal d'éléments qui tendent vers la conformité RGPD :

https://www.opquast.com/qualite-web-opquast/?check-bonne=1&check-recom=1&tag00-donne=1

Conclusion

Tout le monde peut agir à son niveau :

  • développeur : créer des produits de meilleure qualité
  • client : être exigeant sur ce que l'on fait développer
  • tous : adopter des bonnes pratiques (nettoyer ses mails, mieux gérer ses mots de passe et plus généralement être exigeant)

Soyons responsables et exigeants

Prochaine étape?

[Source  : consoglobe.com]

#teasing

MakeInternetGreatAgain

By LauDev

MakeInternetGreatAgain

  • 1,409