Cette liste de ressources devrait rendre de grands services à l’intégrateur HTML & CSS ainsi qu’au développeur web. en effet, vous y trouverez : un générateur de miniatures pour la page d’accueil de votre blog WordPress ; des outils pour valider l’ensemble de votre site ; un fichier PHP pour gérer votre base de données et des plugins jQuery tous plus intéressants les uns que les autres, etc. Il s’agit du meilleur des bons plans que je propose sur mon compte Twitter integrateur_css. Stay tuned and mind the gap!
WordPress : redimensionnez et affichez une miniature à partir des images de vos articles
Je vous ai parlé dernièrement (dans les bons liens WordPress) du script get_post_images() associé à la fonction first_thumbnail() pour afficher une miniature en homepage, par exemple, en prenant la première image d’un article. Mehdi Kabab vient d’apporter une amélioration substantielle à la fonction first_thumbnail() pour prendre en compte le script timthumb qui permet de générer une miniature aux dimensions que vous voulez (via la bibliothèque graphique GD) plutôt qu’un redimensionnement HTML lourd de conséquence sur le poids de votre page d’accueil.
Vous pouvez voir cette petite merveille en action sur la page d’accueil de ce blog : les miniatures sont redimensionnées et affichées grâce à cet ensemble de fonctions. Pour les souhaits et surtout les remerciements c’est par ici que ça se passe ;)
Pages web et bases de données
Validateur — Validez votre site Web en entier grâce à l’outil de validation multipages (via truffo). Ce service est développé et maintenu par le Réseau Proze et s’appuie sur le service de validation du W3C qui détient les droits d’auteur de son service.
Adminer — est un outil tenant en un seul fichier PHP qui permet de gérer une base de données MySQL à la manière d’un phpMyAdmin light. Existe également sous forme de plugin pour WordPress.
Firebug Lite — Ce simple fichier Javascript — disponible sous forme de bookmarklet — va superposer l’essentiel des commandes de Firebug à la page en cours.
Javascript et plugins jQuery
jQuery Magnifier Loupe — propose un zoom pour vos images. Utilise intelligemmentla propriétélongdescpour zoomer à partir d’une miniature (thumbnail). Il reste possible de « fabriquer » la miniature avec les propriétés HTMLwidthetheight. (via Amicalement Web).
Attention tout de même au caractère peu accessible de cette solution basée sur l’attribut HTML longdesc qui permet de fournir une description de l’image pour les malvoyants comme me le rappelle Sébastien Delorme sur Twitter ici, ici et ici ;)
Cela dit, le script ne nécessite pas obligatoirement l’attribut longdesc pour fonctionner ; il est possible de déclencher la loupe en utilisant la classe jLoupe sur l’élément img concerné !
qtip jQuery Plugin — Sans doute la solution ultime pour gérer les info-bulles (tooltips) : cross browser, dégradation gracieuse, coins arrondis personnalisables, positionnement facile, effets personnalisables, AJAX, etc. (via arnaud-k)
Vanadium — Validation et vérification des champs d’un formulaire à l’aide de l’attribut
class. Par exemple :pour un champs requis oupour un champs qui doit recevoir la chaine de caractère vanadium. Possibilité de valider via AJAX avec « par exemple.
Quelques trucs pour vos CSS
21 polices de caractères à intégrer avec
@font-face— Cette propriété CSS2 permet d’incorporer les informations vectorielles relatives à une fonte dans votre page web sous la forme@font-face { font-family: GraublauWeb; src: url("path-to-the-font-file/GraublauWeb.otf") format("opentype"); }à utiliser ensuite comme suit :h1 { font-family: GraublauWeb, Helvetica, Verdana, Sans-Serif; }Ultimate IE6 Cheatsheet 25+ hacks et contournements pour faire sa fête à IE6 — Avec des parts de marché estimées à 18% ou 25% selon les sources, l’intégrateur web doit encore se coltiner avec le dernier de la classes des navigateurs.
Miscellanées
- A l’occasion du Last Call pour l’écriture des spécifications pour HTML5, Florent V. répond à nos questions sur les différents
DOCTYPEet autres typesMIMEqui peuplent la jungle du développement web. Des réponses synthétiques seront publiées dans le courant de la semaine prochaine.
Articles sur le même sujet
PS : Le respect de la vie privée sur internet est important : j'ai décidé d'échanger mon bouton Like de Facebook par un bouton Faire un don de Paypal car Il n'y pas d'amour, il n'y a que des preuves d'amour
(Jean Cocteau) ;) Merci d'avance.
Afin de satisfaire le plus grand nombre, j'ai ajouté
un bouton Flattr parce que vous le valez bien ;)
[...] This post was mentioned on Twitter by Erick and bruno b. css4design. bruno b. css4design said: [billet] 10 liens pour faire plaisir à votre intégrateur web http://bit.ly/qLpQ3 [...]
Très bon Timthumb, j’ai enfin réussi à le faire fonctionner et à le mettre en cache ( http://code.google.com/p/timthumb/source/browse/trunk/.htaccess ) couplé au script de piouPiouM c’est du bonheur. Merci. :)
Sympa l’article, j’ai surtout bien aimé le ‘Ultimate IE6 Cheatsheet’.
Et, by the way, merci pour le lien vers mon blog ;)
Parce qu’on en a marre de IE6, arrêtons d’utiliser des hack pour IE6, sinon pourquoi changer de navigateur si ça fonctionne sous IE6.. ?!
Pour IE6 j ai pris le parti de rediriger tous mes internautes vers une page leur expliquant qu ils utilisent un navigateur obsolète et les risques liés a l utilisation de celui ci ;)
Hey Bruno, merci beaucoup pour le lien vers SpyreStudios, je suis en bonne compagnie. C’est très apprécié :)
Salut Bruno Merci pour ces liens. J’aime beaucoup la loupe. Je compte l’utiliser prochainement
[...] 10 liens pour faire plaisir à votre intégrateur web [...]
Merci pour le plugin wordpress Adminer, très utile !
[...] This post was Twitted by JustWebDesignFr [...]
Merci pour tous ces bons liens !
IE6 Ultimate cheatsheet : génial. validateur multi-pages : très efficace.
Merci pour cette liste de ressources, pour le javascript, il existe le framework Mootools qui est très simple à utiliser : http://mootools.net
Bouh je vien d’apprendre que je fais partie des 19% de boulets qui ont encore IE6 :(
Mais j’ai aussi Firefox, j’ai bon la ! :)
Sinon merci pour ces petites astuces.
Excellent l’affichage des miniatures ! Merci beaucoup pour le lien.
mer ci pour tout ces liens bien utiles.
Cette liste est bien utile, je ne les connaissais pas tous, merci du partage ;)
Merci pour ce bel article, moi j ai gardé en favoris le validateur et les méthodes de contournement pour IE6
Je ne connaissais pas tout. Y a de vrais bonnes choses là dedans comme l’affichage de miniatures, alors merci !
Merci pour ces ressources sur ce outils qui s’avèrent effectivement très pratiques.
C’est très bien ces miniatures mais je suis en train de chercher un système (cms) pour faire migrer mon site dédiés aux pps. Il mefaudrait du coup un système de vignette dont le lien envoie directement sur le pps :)
[...] 10 liens pour faire plaisir à votre intégrateur web — Générateur de miniatures pour WordPress, valider votre site, gérer votre base de données, des plugins jQuery. [...]
C’est vrai que ce sera moins lourd que un simple redimensionnement en html ^^ Par contre depuis l’apparition du jQuery, ca sauve pas mal de monde :) C’est bien plus SEO friendly qye le javascript et bien moins lourd que du flash. Génial pour des galeries de miniatures ou des effets de loupe sur une image ;) Merci encore pour ces ressources !
Excellent article, merci pour les informations qui sont très utiles.
Cool, et tu l’a placé où le fichier .htaccess ?