10 et 1 outils gratuit pour le web

Depuis quelques mois, j’ai élargi ma palette d’outils de travail grâce à de très bonnes recommandations, mais aussi des découvertes. Que ce soit pour écrire, faire de la recherche, trouver de l’inspiration, coder et créer, je suis plus qu’équipée. Certain de ces outils ayant grandement révolutionné mon quotidien, je voudrais les partager au plus grand nombre dans l’espoir que ça vous aide en retour!

Tous les logiciels et les sites présentés ci-dessous sont gratuits et majoritairement disponible en français.

Pour écrire


Google Docs L’outil de traitement de texte de Google est une très bonne alternative à Word. Il est accessible depuis votre navigateur, et encore plus facilement si vous utilisez Chrome. En plus d’être gratuit, il possède la majorité des fonctionnalité d’un éditeur de texte classique. Je ne sais pas lequel de ces avantages me plaît le plus, alors les voici en vrac : il s’utilise en ligne et hors-ligne; il sauvegarde en temps réel votre travail; il enregistre tout dans le drive et vos fichiers sont donc accessibles depuis n’importe quel appareil, y compris votre téléphone; un simple lien vous permet de partager vos écrits et *reprend sa respiration* vous pouvez travailler à plusieurs sur un même fichier en simultané ! Convaincu ?
Dans les outils Google, vous trouverez aussi Google Sheets, un tableur en ligne sur le même principe.

Crisco est un dictionnaire des synonymes mis en ligne par les universitaires linguistiques de Caen. Je l’ai connu grâce à mon ancien professeur de français et je n’ai jamais utilisé d’autre plateforme à ce jour : autant dire que je lui donne toute ma confiance. Elle très régulièrement mise à jour et contient un large champ lexical allant du soutenu, du familier et même de l’argot.

Pour faire du graphisme


Pinterest, Behance, Dribbble sont des sites relativement connus, mais il est toujours bon de rappeler qu’ils existent. C’est là que je trouve toute mon inspiration et que je perds beaucoup trop de temps. Gardez en tête que la plupart des créations que vous trouverez dessus sont celles de professionnels, des vitrines de ce qu’il se fait de meilleur sur le net. Ne vous découragez pas devant ce flot de talent. Il ne s’agit pas de les imiter, mais de s’en inspirer!

Unsplash est une banque d’image gratuite dans laquelle vous trouverez des photos, mais aussi un large choix de texture de très très bonne qualité. Ce n’est pas la seule banque qui existe, mais c’est selon moi la plus universelle, généreuse et fiable actuellement.

Figma est une plateforme-logiciel pour travailler le design d’interface. Ce n’est pas un logiciel de graphisme, bien qu’il possède quelque fonctionnalités de base pour travailler les images. Son utilité première c’est le sketch, la réalisation de maquette, de prototype, et d’autre brouillon... C’est un outil que je RECOMMANDE à tous ceux qui font des designs et de la mise en page. Son atout principal ? C’est un logiciel, mais c’est aussi une plateforme web ! Imaginez un peu, c’est comme si photoshop était accessible en navigateur. Et si ça, ça ne vous convainc pas, sachez qu’il est également collaboratif, à l’image de Google Docs. Je vous partage un article (en anglais) qui résume parfaitement l’étendue des capacités de Figma : Why Figma is a dangerous tool for designers.

Google Font est le nouveau Dafont de la typographie (s’il-vous-plaît n’utilisez plus Dafont). Son utilisation est pertinente lorsque vous avez besoin de nouvelle police à utiliser sur le net puisqu’elles sont déjà hébergées. Le site est très simple d’utilisation, permet de prévisualiser ses choix et surtout, il fournit directement les codes (html ou css) d’importation. Un simple copier/coller et le tour est joué !

Pour apprendre


OpenClassRooms est un site d’apprentissage très complet sur les domaines du Web. Je sais qu’il existe mille et un tutoriel un peu partout sur le net, mais je tenais à vous présenter ce site en particulier, car il s’agit d’une véritable école en ligne. S’il propose des formations payantes, il y a une centaine de cours gratuits complets (vidéo, illustration et exercices) sur une grande variété de thèmes… Web, bureautique, design, programmation, et j’en passe ! Prenez le temps de l’explorer et d’apprendre quelques bases qui vous seront grandement utiles.

Pour coder


SublimeText et Brackets sont des logiciels d’éditeurs de code. À la façon d’un éditeur de texte, ces logiciels vous aident à écrire plus vite, sans faute et de façon plus structurée vos codes (html, css, js, php…). SublimeText est le plus simple des deux et c’est celui que je recommande aux débutants pour comprendre le fonctionnement d’un éditeur de code. Brackets est le plus complet et une bonne alternative à Notepad++ (plus connu mais doucement dépassé). Il intègre une gestion de projet facile à prendre en main, un système de prévisualisation instantanée et un large choix de plugin proposé par la communauté pour ajouter de nouvelles fonctionnalité.
Si vous trouverez aisément des tutoriels d’utilisation en français, leurs interfaces sont néanmoins en anglais.

JSbin et JSfiddle sont des sites qui vous permettent de tester directement vos codes en ligne et de les partager avec un simple lien, sans même les héberger. Je les ai découvert que tout récemment et j’ai une préférence pour JSbin malgré son interface un peu austère, mais à défaut très directe. JSfiddle, lui, est plus moderne et propose des fonctionnalités d’éditeur de code (comme au-dessus), mais que je trouve un peu bancales. Les deux restent très utiles, à vous de vous faire votre propre idée!

Codepen.io est un site de codage semblable à ceux proposés au-dessus, mais plus que du test, il s’agit d’une véritable bibliothèque de code mis à disposition par tous… mais aussi n’importe qui, faites attention ! C’est un excellent moyen de chercher de l’inspiration, de découvrir comment fonctionnent certaines choses et pour trouver du libre-service. Comme la plupart des outils de codage, il n’est disponible qu’en anglais.

Les generators sont des sites qui génèrent facilement des codes. Je vous ai mis aucun lien car il en existe des centaine mais vous en trouverez pour à peu près tout ! Par exemple : générateur de couleur/dégradé, d’ombre, de grille, de filtre, de police, de courbes, d’animation… En tapant les bons mots clés suivi de generator vous trouverez aisément ce qu’il faut dans le moteur de recherche.


Belle liste, non ? Si je vous ne vous ai rien appris, je vous ai peut-être rappelé que certains outils existaient pour nous faciliter la vie. Je considère qu’ils sont tous très abordables, même aux plus débutants et même aux non-anglophones. En vous y intéressant un peu, je suis sûre que vous apprendrez plein de choses !

Bien sûr pour chaque site ou logiciel proposé il existe une alternative et d’autres plateformes qui proposent la même chose. Libre à vous de toutes les tester et faire votre choix ! Cela fait quelques mois que je travaille avec tous ceux-là et j’en suis très satisfaite.

Si vous avez d’autres propositions à nous faire découvrir, venez les partager sur notre Discord !

Kim
Présentation de l'auteur.e :
“ Responsable de la circulation ferroviaire et potentiellement de votre retard au travail ce matin, community manager de l’Instagram de son chien Loulou et testeuse chevronnée de lieux improbable où dormir. Kim a longtemps suivi XOOGGE dans l’ombre avec admiration avant de devenir rédactrice parce qu’elle s’est rendu compte qu’elle avait toujours quelque chose à dire sur les forums rpg. Quand elle ne créé pas un énième tableau Pinretest d’inspiration, il est certain qu’elle s’est perdue sur le dernier jeu de gestion qui va mener sa vie sociale à sa perte. ”

Nos derniers articles Voir tout

Approfondir votre personnage

Au fil de mes pérégrinations rpgiques, j’ai mis en place quelques astuces pour mieux découvrir mes personnages. Car non, la fiche de présentation n’est pas le seul moyen de bien le connaître, bien au contraire ! Certain·e·s rpgistes - et j...
Le 29/06/2020 à 20:08 • jojofeels
#rpg #article #écriture

Palettes aux merveilles - 10 sites de générateurs de couleurs.

"Je n'ai pas de citation pour cette fois..." - Oxymore. Depuis un certain temps déjà, je m’intéresse au graphisme et au codage surtout, je me suis demandé beaucoup choses. En fait, non, je me pose toujours des questions mêmes les plus inutile...
Le 15/06/2020 à 21:30 • Oxymore
#Aide #CSS #Article #Color

La position en CSS : relative, absolute ou fixed ?

On se dit que l’on connait le comportement du positionnement en CSS, mais il arrive bien souvent qu'on soit face à des comportements inattendus, qu'un bloc ne se situe pas là où on le souhaite et qui nous fassent perdre patience. J'aimerais donc...
Le 08/06/2020 à 21:30 • Nevyin
#CSS #Position #Relative #Absolute #Fixed

Commentaires

Aucun commentaire pour cet article. Soit le premier : Identifie-toi
Screenshots par Robothumb