Blog du MMIToolboxOutilsOutils webdev

Outils webdev

Liste d'outils pour le développement web

Voici une collection d'outils incontournables et gratuits pour les développeurs web. On retrouve des guidelines, des documentations, des éditeurs de code ou encore des outils d'analyse en ligne !

Teste l'accessibilité de ton site avec AChecker.
Une documentation pour comprendre facilement comment rendre le HTML5 plus vivant.
Blend est une petite application web gratuite créée par Colin Keany qui permet de générer un dégradé en drag&drop et d'obtenir son code CSS.
Un plugin Chrome pour mettre en évidence la grille responsive de Bootstrap.
Un éditeur de code open source créé par Adobe.
Browse Happy te permet de vérifier si la version de ton navigateur est à jour.
Un générateur de boutons en CSS.
Une documentation pour savoir quels éléments utiliser en fonction de la version de n'importe quel navigateur web.
Coda, l'éditeur de code par Panic.
Code School est une plate-forme gratuite pour apprendre à coder.
Codecademy est un site gratuit et en français qui t'aide à apprendre de A à Z différents langages de programmation. Maxime en a fait un article.
Une documentation en anglais avec toutes les propriétés CSS et comment les utiliser.
Des cours et des tutoriels pour utiliser le CSS comme un chef ;)
Compare les différents affichage de tes fonts sur les différents navigateurs web.
Un générateur de dégradé CSS gratuit par CSS Portal.
Un générateur de dégradé CSS gratuit par CSS Factory.
Un extension Chrome qui permet d'afficher des informations détaillées sur le dégradé lorsque tu inspectes l'élément.
CyberDuck te donne un accès FTP tout comme FileZilla. Disponible sur Mac et Windows, gratuitement.
Fais l'audit global de ton site (ergonomie, SEO, standard W3C) grâce à DareBoost.
Une documentation en anglais de nombreux langages de programmation.
Egghead est un site en anglais pour apprendre gratuitement et en vidéo des technologies web telles qu'Angular JS, React, D3, etc ...
Un outil pour tester des animations en jQuery.
fasterImage est un outil gratuit à installer sur ton site pour optimiser la vitesse de chargement de tes images.
FileZilla est le plus célèbre logiciel de transfert de fichier. Gratuit, simple et efficace.
Flow.gs est un générateur de grille CSS responsive.
Framer, un outil pour réaliser des prototypes d'applications à base de code.
Get HTML est une documentation en anglais sur toutes les balises existantes en HTML expliquant leur usage.
Le réseau social des développeur par excellence pour partager ton code avec les autres.
Gitter, c'est un peu comme Slack, mais spécialement dédié aux développeurs, avec quelques fonctionnalités spécifiques à leur besoin.
Converti gratuitement une photo en dégradé.
JSHint est un outil pour détecter les erreurs dans ton code Javascript.
Constructeur de boutons, de formulaire, de rubans et d'icônes par UI Parade.
Accède à ton FTP sans installer de logiciel sur ton ordinateur, tout se fait depuis le navigateur.
NetDrive permet d'intégrer ton ou tes FTP tels un système de cloud sur ton Windows.
Des centaines de cours dans le domaine de l'informatique (développement, design, marketing, entreprise) gratuits.
Teste et analyse la vitesse de ton site avec le PageSpeed Insight de Google.
Teste la vitesse de ton site avec le testeur de vitesse par Pingdom.
Générateur de placeholder pour image.
Une infographie interactive en français qui explique de manière ludique les avantages du CMS WordPress.
Générateur de favicon pour n'importe quel support (mobile, desktop) et navigateur (Chrome, Firefox, IE, Safari, etc ..).
Teste l'affichage responsive de ton site en explorant l'url à tester avec cet outil.
Test le responsive de ton site en explorant ce dernier avec cet outil.
Sandstorm est un OS open source à installer pour gérer transformer son serveur en cloud.
Screenfly fait partie de la série des QuirckTools. Il te permet de tester le responsive de ton site internet en fonction des dimensions que tu souhaites.
Une galerie de sites web pour ton inspiration web.
Stack Overflow est un site gratuit de questions/réponses et d'entraide pour les développeurs.
Générateur de sprites CSS pour mettre toutes les icônes et petites images d'un site sur un seul fichier JPG.
Sublime Text est un éditeur de code gratuit pour Mac, Linux ou Windows.
Une extension Chrome très simple pour laisser des commentaires sur des interfaces.
Générateur de dégradés CSS pour de belles interfaces utilisateur.
Valide ton code pour connaître le nombre d'erreur avec le validateur du standard W3C.
W3Schools est une site anglais pour apprendre de A à Z les différents langages web.
Une extension Chrome très complète pour faire un audit spécifique de la page affichée dans le navigateur web.
Génère tes propres webfonts avec le générateur de webfonts de Font Squirrel.
Une extension Chrome très pratique pour redimensionner rapidement la fenêtre du navigateur selon la taille de n'importe quel terminal/écran.

Ces outils pour le développement web t’ont rendu service ? Tu as fais des découvertes fabuleuses ? Alors tweete cette page  

Tu connais d’autres outils super pratiques pour le développement web ? N’hésite pas à le recommander en commentaire !