Des outils utiles, sans prise de tête

Calculateurs, vérifications et ressources pratiques pour préparer plus facilement vos projets print, packaging et web.

Calculer la surface d’un sac papier

Renseignez les dimensions du sac en centimètres pour obtenir une estimation de la surface de papier utilisée.

Formule utilisée

((26 + 18) × 2) × (24 + 13,5 + 0)

Le fond est estimé à 75 % du soufflet. Le résultat correspond à la surface développée visible du sac, à laquelle est ajouté le revers. La patte de collage et les autres marges techniques ne sont pas comprises.

Surface estimative

3 300 cm²

soit 0,33 m²

Surface hors patte de collage et marges techniques de fabrication.

Largeur développée
88 cm
Fond estimé
13,5 cm
Revers
0 cm
Hauteur développée
37,5 cm

Les bons outils du web

Une sélection de services pratiques pour gagner du temps en développement, en création graphique et en optimisation web. Les liens s’ouvrent dans un nouvel onglet.

Données & conversion

Transformer, comparer ou visualiser des données sans sortir l’artillerie lourde.

CSVJSON csvjson.com Convertir rapidement des fichiers CSV, JSON et plusieurs autres formats de données. Gratuit Transform.tools transform.tools Convertir du JSON, du TypeScript, du HTML, du JSX, du YAML et bien plus. Gratuit JSON Crack jsoncrack.com Visualiser un JSON, un YAML, un XML ou un CSV sous forme de graphe interactif. Freemium TableConvert tableconvert.com Convertir des tableaux entre Excel, CSV, JSON, Markdown, HTML, SQL et LaTeX. Gratuit CyberChef gchq.github.io Encoder, décoder, compresser, hacher et transformer des données directement dans le navigateur. Sans inscription Diffchecker diffchecker.com Comparer deux textes, fichiers ou extraits de code et repérer immédiatement les différences. Freemium

Développement & tests

Tester une idée, contrôler la compatibilité ou éviter d’ajouter trois tonnes de JavaScript.

Can I Use caniuse.com Vérifier la compatibilité des fonctionnalités HTML, CSS et JavaScript avec les navigateurs. Gratuit Can I Email caniemail.com Contrôler la prise en charge du HTML et du CSS par les principaux clients de messagerie. Gratuit Bundlephobia bundlephobia.com Mesurer le poids et l’impact d’un package npm avant de l’ajouter à un projet. Gratuit regex101 regex101.com Écrire, tester et comprendre une expression régulière avec une explication détaillée. Gratuit CodePen codepen.io Tester et partager rapidement des extraits HTML, CSS et JavaScript dans le navigateur. Freemium StackBlitz stackblitz.com Créer et partager un environnement de développement complet directement en ligne. Freemium

Design & graphisme

Créer des formes, des fonds et des palettes sans ouvrir une usine Adobe.

Blobmaker blobmaker.app Générer des formes organiques aléatoires et les exporter en SVG. Gratuit Haikei haikei.app Créer des vagues, blobs, grilles et fonds SVG personnalisables. Sans inscription Coolors coolors.co Créer, explorer et ajuster rapidement des palettes de couleurs. Freemium Get Waves getwaves.io Créer une vague SVG personnalisable pour séparer ou habiller les sections d’une page. Gratuit BGJar bgjar.com Générer des arrière-plans SVG légers à partir de motifs et de formes paramétrables. Gratuit CSS Gradient cssgradient.io Composer visuellement des dégradés CSS linéaires ou radiaux et copier le code obtenu. Gratuit

Images & optimisation

Retoucher, convertir et alléger les images avant leur mise en ligne.

Squoosh squoosh.app Compresser, redimensionner et convertir des images en WebP ou AVIF. Sans inscription SVGOMG svgomg.net Nettoyer et réduire le poids d’un fichier SVG directement dans le navigateur. Sans inscription RealFaviconGenerator realfavicongenerator.net Créer les favicons et les balises nécessaires pour les navigateurs et appareils. Gratuit TinyPNG tinypng.com Compresser rapidement des images PNG, JPEG, WebP et AVIF par glisser-déposer. Freemium Photopea photopea.com Retoucher des images et ouvrir de nombreux formats, dont PSD, SVG, PDF et WebP. Freemium Cleanup.pictures cleanup.pictures Supprimer rapidement un objet, un défaut ou un élément gênant dans une image. Freemium

Polices & icônes

Trouver des ressources cohérentes et faciles à intégrer dans un site.

Google Fonts fonts.google.com Explorer et tester des polices conçues pour une utilisation web. Gratuit Lucide lucide.dev Bibliothèque d’icônes SVG légères, cohérentes et personnalisables. Gratuit Iconify iconify.design Rechercher des icônes dans de nombreuses collections depuis une seule interface. Gratuit Fontsource fontsource.org Installer et auto-héberger facilement des polices web, notamment avec npm. Gratuit Fontjoy fontjoy.com Générer des associations de polices pour les titres, sous-titres et textes courants. Gratuit Type Scale typescale.org Construire une échelle typographique cohérente et récupérer les tailles en CSS. Sans inscription

SEO & qualité web

Contrôler les performances, les métadonnées, les redirections et la structure technique d’un site.

PageSpeed Insights pagespeed.web.dev Analyser les performances d’une page sur mobile et ordinateur. Gratuit Rich Results Test search.google.com Vérifier les données structurées compatibles avec les résultats enrichis Google. Gratuit Schema Markup Validator validator.schema.org Valider les données structurées Schema.org présentes dans une page ou un extrait de code. Gratuit Meta Tags metatags.io Prévisualiser et générer les balises de partage social d’une page. Gratuit HTTPStatus.io httpstatus.io Contrôler les codes HTTP et suivre les chaînes de redirection de plusieurs URL. Freemium W3C Markup Validator validator.w3.org Repérer les erreurs de balisage et vérifier la validité d’une page HTML. Gratuit XML-Sitemaps xml-sitemaps.com Générer rapidement un sitemap XML pour un petit site public. Freemium

Accessibilité

Vérifier les contrastes et repérer les obstacles qui compliquent l’utilisation d’un site.

WebAIM Contrast Checker webaim.org Vérifier le contraste entre un texte et son arrière-plan selon les critères WCAG. Gratuit WAVE wave.webaim.org Analyser une page et visualiser les principaux problèmes d’accessibilité détectés. Gratuit Contrast Grid contrast-grid.eightshapes.com Comparer en une seule grille le contraste de plusieurs couleurs de texte et de fond. Gratuit WhoCanUse whocanuse.com Comprendre à quels utilisateurs une combinaison de couleurs peut poser problème. Gratuit

À savoir : ces services sont édités par des tiers. Leurs fonctionnalités, conditions et offres peuvent évoluer indépendamment de CPEP.

Un outil manque à la liste ? Proposez-le-nous .