Mathieu Profile picture
Développeur web depuis une éternité. #webdev #frontend #webperf #RGPD #QualitéWeb Champion du monde @Opquast (1000/1000) Μastоdоn: @MathieuOnline@piaille.fr

Oct 19, 2021, 12 tweets

🧵 Liste d’outils en ligne #webdev

Ce sont principalement des outils techniques, orientés #frontend, qui n’ont pas (ou peu) d’équivalent offline.
Je les utilise Ă  chaque projet. đź’•

1. regex101

N’ayez plus peur des expressions régulières et apprenez à les maîtriser.regex101.com

2. Mail-tester

On envoie un mail à une adresse, l’outil nous indique quels sont les problèmes potentiels de déliverabilité (DKIM mal configurés, serveur blacklisté…) mail-tester.com

5. Dareboost

Audit mêlant #webperf, sécurité, accessibilité et qualité.
Je trouve que c’est un très bon complément à , gtmetrix, …
L’analyse n’est pas un copié-collé de Lighthouse, ça permet de mettre en lumière d’autres problèmes. dareboost.com
web.dev

6. RealFaviconGenerator

On télévise une image, on configure, et récupère un packgage de favicons dans les règles de l’art.
Indispensable ! realfavicongenerator.net

7. google-webfonts-helper

Permet de récupérer une version auto-hébergeable d’une font Web Google.
**HEBERGEZ VOS WEBFONTS FFS** google-webfonts-helper.herokuapp.com/fonts

8.

Génère un spritesheet SVG à partir d’icônes SVG. L’objectif étant d’agréger des éléments SVG que vous utilisez abondamment sur un site au sein d’un même fichier. SVGsprit.es
svgsprit.es

9. FontDrop!

Pour avoir des infos précises sur une police de caractères. fontdrop.info

10. FontSquirrel - Webfont Generator

Pour moi le plus précis et fiable générateur de webfont. On téléverse une police dans un format quelconque et on récupère une webfont correctement optimisée. fontsquirrel.com/tools/webfont-…

11. Check Position

Outil ultra simple et efficace pour surveiller l'évolution du positionnement de vos sites sur les mot-clés que vous aurez choisis. Parfait pour comprendre l'impact de vos modifications sur les SERP. check-position.com

12. Box-shadow generator

Il existe une multitude d'outils de ce genre, celui de MDN est le seul qui propose les bonnes options (ombres multiples, couleurs, inset). Mériterait d'être remis au goût du jour. developer.mozilla.org/en-US/docs/Web…

13. JSON Hero

Visualiser le contenu d'un fichier/flux JSON.jsonhero.io

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling