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.
- Tester les polices de caractère : Typetester
- Mesurer le contraste des couleurs entre les polices de caractère et l'arrière-plan : Snook et Colour Sheck
- Accorder les couleurs : Color Sheme Designer
- Mémoriser le code d'une couleur affichée à l'écran : ColorZilla, l'extension de Firefox
- 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.
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.
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.
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
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.
