«Test Drive» (IE9 preview) sur Vista

Petite note rapide pour signaler le lancement de Test Drive par Microsoft. Une fois l’archive .msi installée sur votre disque dur (le moteur de rendu d’IE9 s’installe à côté de votre exemplaire d’Internet Explorer), Internet Explorer Platform Preview vous permettra de tester le moteur de rendu de IE9 censé respecter les standards (CSS3, HTML5) au plus près des spécifications du W3C.

Accélérer votre blog en optimisant l’affichage des Adsense avec jQuery

Optimiser le chargement des AdSense — J’ai eu la chance d’avoir l’explication IRL mais j’attendais avec impatience le billet de Mehdi pour vous en parler. Le principe consiste à réserver les emplacements des publicités là où vous voulez les afficher, de placer les scripts fournis par Google Adsense à la fin de votre page et d’ajouter une pincée de CSS et un soupçon de jQuery pour remettre chaque publicité à sa place quand la page est chargée. J’ai mis cette technique en place sur ce blog et sur css 4 design et ça marche niguel ghrome 😀

Une Feuille de style et des « hacks CSS » pour cibler IE6, IE7 ou IE8

Les hacks CSS sont une utilisation peu conventionnelle des sélecteurs CSS pour s’adresser à un ou plusieurs navigateurs quand on doit servir une propriété ou une valeur CSS spécifique à un ou plusieurs navigateurs. Si IE6 fait la fine bouche devant sa soupe de balises, il peut être intéressant de lui servir le même plat mais dans une assiette différente (la comparaison est bancale). Ces hacks s’utilisent souvent pour cibler des versions spécifiques d’Internet Explorer (généralement IE6 et IE7). Toutefois, il en existe pour Firefox, Opéra, Safari, iPhone, etc. Par ailleurs, je n’utilise pas ces hacks CSS dans ma feuille de style principale, mais uniquement dans une CSS réservée à IE via les commentaires conditionnels.

TipTip — Infobulles « funky » pour afficher l’attribut HTML « title »

TipTip est un plugin dans la lignée de Tipsy qui permet d’afficher l’attribut title d’un élément précisé par une classes dédiée ou générique dans une bulle d’information bien plus belle que celle qui apparait par défaut. Le fonctionnement de TipTip est le suivant : le script copie puis supprime le title d’origine pour que le navigateur ne soit pas tenté de l’afficher et l’injecte ensuite dans le balisage HTML suivant :

Clickoutside Event — Détectez les clics en dehors d’un élément

Clickoutside event — Ce plugin jQuery permet de déclencher une action lorsque l’utilisateur clique en dehors de l’élément spécifié. La gestion des événements de jQuery, déjà très complète, s’enrichit avec clickoutside. Pour 0.7 ko ce serait dommage de s’en priver. Ce plugin sera très utile pour fermer vos fenêtres modales (lightbox) lorsque l’utilisateur clique à l’extérieur. Voici un exemple d’utilisation :

jQuery, HTML5 et CSS3 sont le Biactol™ du Web ^_^v

Comment, jQuery va tuer Flash ? La question peut paraitre surprenante, mais force est de constater que Javascript a fait du chemin depuis  window.open() ! Les bibliothèques comme jQuery ou Prototype ont par ailleurs permis l’émergence de plugins, de scripts qui se sont attachés à améliorer l’expérience utilisateurs jusqu’à concurrencer Flash sur son terrain de prédilection : la création d’animation pour créer des interfaces immersives afin de capter l’attention du visiteur.

Framework CSS — Sémantique, maquette dynamique et autres notes

Les frameworks CSS ont fait couler beaucoup de pixels : d’un côté, ils proposent une méthode à l’épreuve des balles pour placer les blocs sur sur la page en tenant compte des contraintes cross-browser ; de l’autre, ils ajoutent des classes CSS superflues dans le code HTML pour la présentation des contenus, ce qui n’est pas jugé «sémantique» par les farouches défenseurs d’une séparation entre le fond et la forme. Voilà en gros l’avantage principal et l’inconvénient majeur qu’on peut dégager si on met de côté le faux problème du poids de ces frameworks. Après avoir donné mon point de vue sur cette question de «sémantique» j’expliquerais comment l’ajout de classes liées à la présentation dans le HTML peut s’avérer très pratique à l’heure du web «sur-mesure».