Agence creation de site internet
Le bandeau du site Ergonomie Web retour sur la page d'accueil du site ergonomie-web.studiovitamine.com aller sur le site www.studiovitamine.com
Thèmes associés : Outils web gratuits. Outils pour sites web; ergonomie des sites web. Outils pour le web. Outil développement web ou outils. Outil web mais outil web gratuit; outil site web ou ergonomie site web ou outil page web et outil du web pour outils webmaster, outils gratuits pour site web ! Outil pour site web. Outils de développement web donc outils developpement web. Outil de developpement web. Ergonomie web. Outil de développement web. Outils site web, utilitaires web. Outils web ou outils du web car outils pour site web. Liens associés : outils web et outils web
Accueil > Boîte à outils web

E-Commerce

Boîte à outils web

Image de Boîte à outils web

Des outils web utiles pour les webmasters.

De nombreux outils web gratuits existent sur Internet pour tester les polices de caractère, accorder, mesurer et mémoriser les couleurs. Des aides bien utiles pour les développers web pour concevoir des sites compatibles avec les différents navigateurs et qui répondent aux critères d'ergonomie web.
 
  1. Tester les polices de caractère : Typetester
  2. Mesurer le contraste des couleurs entre les polices de caractère et l'arrière-plan : Snook et Colour Sheck
  3. Accorder les couleurs : Color Sheme Designer
  4. Mémoriser le code d'une couleur affichée à l'écran : ColorZilla, l'extension de Firefox
  5. Tester l'affichage d'un site sous différentes versions d'Internet Explorer : IETester

1. Tester les polices de caractère : Typetester.

Typetester est une application gratuite à mettre dans la trousse à outils de tout développeur web. Il s'agit d'un outil de développement web qui permet de tester le rendu des polices de caractères.
 
Vous pouvez utiliser les polices proposées par Typetester mais aussi celles présentes sur votre poste. Cela fonctionne sur Windows et Mac Os.
 
Plusieurs réglages permettent d'affiner le résultat (couleurs, taille, espacement des caractères...), celui-ci est affiché sur 3 colonnes ce qui est pratique pour comparer plusieurs configurations. Lorsque le résultat vous convient, vous pouvez télécharger le style CSS correspondant à votre choix.
Image de Boîte à outils web
Tester TypeTester sur www.typetester.org

2. Mesurer le contraste des couleurs entre les polices de caractère et l'arrière-plan : Snook et Colour Sheck.

 
Pour mesurer le contraste entre la couleur d'arrière-plan et la couleur de la police, Snoock une application gratuite permet de trouver les bonnes associations de couleur. Son utilisation est très simple et le résultat immédiat.
Image de Boîte à outils web
Image de Boîte à outils web
Tester Colour Check sur : www.etre.com/tools/colourcheck/

3. Accorder les couleurs : Color Sheme Designer.

 
Toutes les couleurs ne s'accordent pas. Une application très pratique est proposée sur le net.
 
Color Sheme Designer permet de sélectionner les couleurs dans la roue des couleurs, de les ajuster, de travailler en une, deux, trois ou quatre couleurs. Toutes les variantes de gammes sont possibles, de la gamme de gris jusqu'aux couleurs saturées.
 
ColorSheme Designer 3 propose ensuite un exemple de pages pour visualiser l'harmonie des couleurs sous forme de page web avec du texte et des images.
Vous pouvez aussi récuper les codes couleurs en texte, XHTML + CSS, XML, les palette de couleurs Photoshop et les palette de couleurs GIMP.
 
Un outil web gratuit vraiment intéressant et très facile à utiliser.
Image de Boîte à outils web
Tester Color Sheme Designer sur : http://colorschemedesigner.com

4. Mémoriser le code d'une couleur affichée à l'écran : ColorZilla, l'extension de Firefox.

 
Pour obtenir les codes d'une couleur sur une page web, l'extension ColorZilla du navigateur Firefox est très efficace.
 
Prélever des couleurs contenues dans une page web, pour les intégrer dans le code de la page en cours de développement devient alors un jeu d'enfant.
 
Une fois ColorZilla installé, un petit rectangle contenant une pipette apparaît en bas à gauche du navigateur. Il suffit alors de cliquer sur la pipette - la souris se transforme en croix - et d'aller pointer la couleur de n'importe quel pixel dans une page web qui nous intéresse. Le code couleur (RGB, Hexadécimal...) s'affiche alors en bas à gauche du navigateur à côté de la pipette. Cela permet également de sauvegarder les couleurs et de créer des palettes.
 
Voici un exemple avec le site Internet de l'agence web STUDIO VITAMINE
Image de Boîte à outils web
Télécharger ColorZilla, l'extension du navigateur Firefox sur : https://addons.mozilla.org/fr/firefox/addon/271

5. Tester l'affichage d'un site sous différentes versions d'Internet Explorer : IETester.

S'il est possible d'installer une ancienne version de Firefox ou Opera, il est très difficile d'installer les différentes versions d'Internet Explorer. Heureusement IETester est là.
 
Cet utilitaire gratuit , propose de tester un site avec toutes les versions d'IE - 5.5, 6.0, 7.0 et 8.0 - sur windows XP et vista dans des onglets affichables en plein écran ou en mosaïque.
Un outil de développement web indispensable pour tout webmaster qui souhaite garantir la compatibilité de son site avec les "standards" du navigateur de Microsoft.
Image de Boîte à outils web
Télécharger IETester sur www.01net.com

Création de sites Internet
& référencement naturel

Découvrez les références de l'agence web
STUDIO VITAMINE. Des spécialistes et passionnés
à votre service ! Devis gratuit.
mascotte de l'agence web STUDIO VITAMINE
l'agence web STUDIO VITAMINE