Quelques outils

21.09.2006

Encore un article inévitable.

Je travaille beaucoup en local, pour ne pas être dérangé par un temps de réponse variable ou par une déconnexion automatique, et je n'utilise donc pas à fond tous les outils que propose OverBlog. En échange, je commets tranquillement sur mon micro toutes les erreurs possibles et ne remonte sur OverBlog que des choses à peu près propres. Si ça vous intéresse, je détaillerai mon organisation (extrêmement banale) dans un autre article.

Précision : je travaille sous Windows, les logiciels que je mentionne sont donc faits pour cet environnement. Mais je ne prétends pas que c'est le meilleur possible.

Dernière précision : je suis fauché et/ou radin, je n'indiquerai donc que des logiciels GRATUITS.

Navigateur

Avant tout, un navigateur convenable : Firefox, Opera, Konqueror… tout ce que vous voudrez, mais un navigateur dont les concepteurs ne s'assiéent pas sur les standards. Votre site peut s'afficher sur un PC, un Mac ou un téléphone portable, tournant sous Windows, MacOS, Linux, Unix… Alors autant le concevoir D'ABORD dans les règles et le tester avec un navigateur qui les respecte et ENSUITE seulement donner les éventuels coups de lime que requiert un navigateur particulier , plutôt que l'inverse. À l'usage, vous verrez que c'est plus simple.

Secret de Polichinelle : j'aime bien Firefox. On ne va pas lancer ici l'inusable débat sur les navigateurs ! Mais, quand je veux comprendre ce qui se passe dans une page, j'apprécie beaucoup l' Inspecteur DOM de Firefox, qui présente toute l'arborescence de la page (les <a> dans les <span> dans les <p> dans les <div> dans les…) avec, pour chaque élément, toutes ses caractéristiques et toutes les règles CSS qui s'y appliquent. C'est de l'artillerie assez lourde mais rend bien service pour venir à bout des phénomènes mystérieux que vous mettrez au jour. On retrouve d'ailleurs l'inspecteur DOM dans la barre d'outils WebDeveloper, excellent plugin pour Firefox.

Éditeur de texte

Je dis bien éditeur et pas traitement de texte. Un éditeur est fait pour montrer tout ce qu'il y a dans un fichier, rien de plus et rien de moins, alors qu'un traitement de texte permet beaucoup plus de choses : choix de polices, mise en page, etc. Il se sert pour cela d'un balisage qui lui est propre, qui vous demeure caché et c'est très bien ainsi, mais qui sème la grouille quand on regarde le fichier avec autre chose – l' autre chose étant, par exemple, un navigateur. Vous saisissez ? J'en dis un peu plus dans cet article.

Modifier un CSS avec Word est, à mon avis, aussi idiot que rédiger son CV avec un éditeur de texte – et c'est plus dangereux pour le CSS que pour le CV.

Ceci précisé, quel genre d'éditeur choisir ? WYSIWYG ou pas ? Même pour rédiger un article, je préfère encore un éditeur de texte et gérer moi-même voire – utopie ! – comprendre le balisage HTML, plutôt que de laisser un outil se livrer à une cuisine obscure. Mais ce n'est qu'une préférence personnelle, je ne me battrai pas pour ça.

Très bon éditeur gratuit : Notepad++ (en français). Permet l'édition simultanée de plusieurs fichiers, met en évidence les mots-clés du langage utilisé (coloration syntaxique), peut compléter automatiquement les paires de balises (très pratique pour le HTML), peut compléter automatiquement les mots-clés (très pratique pour le CSS).

Traitement d'images

Ne pas snober Microsoft Paint et Microsoft Photo Editor qui permettent des retouches simples.

Un utilitaire assez plutôt franchement très bon : Irfanview conçu par un étudiant bosniaque installé près de Vienne. Ce petit (c'est une vertu) programme sait lire et écrire à peu près n'importe quel format d'image, et son auteur enrichit continuellement la liste. IrfanView propose les fonctions classiques d'édition d'image : changement de taille, rotation, recadrage, correction globale de luminosité, contraste et gamma, accentuation des détails… Le peu qu'il fait, il le fait très bien et vite : appréciable sur un micro étriqué comme le mien. Le même auteur propose aussi IrfanView Thumbnails, outil de gestion d'images, doté de très utiles capacités de traitement par lot (pour redimensionner 10 images d'un seul coup, par exemple).

Évidemment, ça reste insuffisant pour du travail plus substantiel. Pas question d'acheter Ph*t*sh*p, j'ai donc dégotté, un peu par hasard, un de ses clones : PhotoPlus Starter Edition. C'est une version bridée du logiciel commercial. Même bridée cette version permet beaucoup de choses : par exemple, c'est avec elle que j'ai retravaillé une photo de ma bibliothèque pour en faire le motif périodique qui sert de fond à ce blog. Donc : redressement des perspectives, gestion de calques, fondu subtil sur les raccords et tout et tout. Prévoir tout de même quelques longues heures de prise en main et, pour peu que l'image soit un peu grande, le moins possible d'applications tournant en même temps. Il y a d'autres outils du même genre, gratuits et au moins aussi bons (PhotoFiltre, the Gimp) : je ne suis pas sectaire, c'est juste que je me suis habitué à celui-là. Petit tuyau : si vous indiquez votre adresse email, vous recevrez assez rapidement un courrier vous proposant le produit complet à prix réduit.

Dernier petit accessoire efficace et discret : dans le tutoriel du site de Zéro, vous trouverez La Boîte à Couleurs . Commode pour choisir une couleur, ce logiciel propose surtout une très pratique pipette pour repiquer la couleur de n'importe pixel de l'écran.

Effets spéciaux (!)

Un assez épatant logiciel de morphing Winmorph, freeware (seulement pour Windows, l'auteur prévoit un portage sous Linux) plein de possibilités – revers de la médaille, il faut apprendre à s'en servir.

Pour cuisiner du son Audacity est très bien aussi.

Outils sur Internet

Pour finir, quelques services utiles trouvés sur le forum OB ou ailleurs :

SelectOracle: si vous débutez en CSS, ce site peut vous aider : il traduit en langage naturel n'importe quel sélecteur. Il peut aussi vérifier la bonne construction d'une règle, voire de tout un fichier CSS.
GraphiToo: divers services, dont un analyseur de poids de page, avec estimation du temps de chargement selon la liaison utilisée.
BrowserShots: donne l'aspect de votre site vu par divers navigateurs. Très instructif !

Des sites plus spécialement consacrés aux questions de couleur :

Colordb: Très utile pour choisir une palette de couleurs cohérente et lisible.
ColorSelector: Les 216 couleurs web safe , restituées sans trahison par tous les navigateurs et tous les écrans.
Analyseur de contraste chez Juicy Studio: Histoire d'éviter d'écrire en gris clair sur gris foncé…

Si vous en connaissez d'autres, n'hésitez surtout pas à laisser un commentaire !