Dur Comme Faire

Depuis quelques mois, on voit fleurir une multitude de clones de Lightbox. Personnellement, mon choix s'est porté sur FancyBox qui fonctionne bien et possède un code nettement plus propre que la moyenne.

J'ai cependant rencontré un souci en l'utilisant en conjonction avec le CSS Reset d'Eric Meyer : les légendes étaient trop hautes.

Le problème vient de l'alignement vertical appliqué sur la balise "td" par le CSS Reset. Pour annuler son effet, il suffit d'ajouter les lignes suivantes dans le fichier fancy.css :

#fancy_title td {
	vertical-align: middle;
}

Il arrive parfois d'avoir besoin de copier une base de données vers un autre serveur. Il est possible de faire facilement cette opération en utilisant l'outil mysqldump en ligne de commande :

mysqldump table_source | mysql --host=hote -C table_cible

Il est également possible de créer la copie sur le même serveur en omettant l'option --host :

mysqldump table_source | mysql -C table_cible

J'ai découvert cette astuce aujourd'hui en lisant la documentation de l'outil mysqldump. Voilà encore une preuve que RTFM est probablement le meilleur adage pour un développeur.

Les interfaces d'administration des applications web sont souvent tristes à pleurer. Dans le cadre de mon projet-top-secret-du-moment (TM), je cherche à éviter ce syndrome. J'ai déjà quelques idées de ce à quoi ressemblera l'interface mais si vous avez des exemples d'interfaces particulièrement bien ficelées je suis preneur.

Ma société, accueille en ce moment 2 stagiaires. L'un deux a de grosses lacunes en programmation. C'est un autre aspect de son profil qui m'intéressait quand je l'ai choisi mais l'accomplissement de sa tâche nécessite une bonne dose de programmation. Ce garçon, fort sympathique au demeurant, manque énormément d'autonomie et de méthode de travail. Je passe mon temps à lui dire de lire la documentation.

Il n'est malheureusement pas le premier que je vois préférer des tutoriaux plus ou moins mal ficelés mais rédigés dans la langue de Molière Lorie à la documentation officielle pourtant forcément plus complète et plus à jour mais en anglais. L'un de mes professeurs disait qu'un informaticien ne parlant pas anglais est handicapé. Je partage totalement ce point de vue. Quand on voit la différence tant en quantité qu'en qualité des informations disponibles en français et en anglais, cela est une évidence.

À force, mon stagiaire a tout de même fini par prendre l'habitude de regarder la documentation pour éviter de se prendre un RTFM bien senti suite à une question saugrenue. Cette après-midi, il devait réaliser une requête SQL un peu tordue. Je précise que nous utilisons exclusivement MySQL comme SGBD. Ne réussissant pas trouver de réponse à son problème dans la documentation, il sollicite mon aide. Surpris par ce qu'il me dit y avoir lu, je vérifie la page qu'il consulte. Il regardait la documentation de PostgreSQL ! Voyant ma surprise, il me balbutie que ce n'est pas exactement la bonne documentation mais que ça doit fonctionner pareil ... en gros.

Pour stocker des valeurs monétaires dans une base de données, on a généralement le réflexe d'utiliser un champ de type FLOAT. Ce n'est cependant pas une bonne idée, en tout cas avec MySQL.

En effet, la documentation indique que MySQL arrondit les valeurs lors du stockage ce qui veux dire que la valeur récupérée n'est pas forcément exactement celle stockée ce qui est très gênant dans le cas de valeurs monétaires.

MySQL performs rounding when storing values, so if you insert 999.00009 into a FLOAT(7,4) column, the approximate result is 999.0001.

Il est préférable d'utiliser un champ de type DECIMAL comme préconisé dans la documentation de MySQL :

The DECIMAL and NUMERIC data types are used to store exact numeric data values. In MySQL, NUMERIC is implemented as DECIMAL. These types are used to store values for which it is important to preserve exact precision, for example with monetary data.

En faisant du rangement chez moi, j'ai récemment retrouvé ce vestige de ma découverte du web.

Il s'agit de la seconde édition de l'ouvrage de référence, à l'époque, sur l'HTML. Paru en 1996, il traite notamment des nouveautés de la version 3 d'HTML.

La prochaine rencontre Blog en nord - Meet the bloggers Lille se déroulera le vendredi 9 février 2007 à Lille en deux temps :

• Une table-ronde concernera l'écriture multimédia, pour le web et dans les blogs de 14 h à 17 h.
• Une soirée «apéro» Blog en Nord - Meet the bloggers Lille pour des rencontres conviviales dès 19 h 30.

Pour en savoir plus, rendez-vous sur l'annonce de la rencontre.

Afin de concilier aspect visuel et accessibilité, il est souvent nécessaire de remplacer un texte par une image. Il existe pour cela des quantités de méthodes avec chacune leurs avantages et leurs inconvénients.

Celle que je privilégie généralement est la méthode Phark Revisited car elle ne nécessite ni balisage inutile ni hack CSS. Le principe est tout simple : on donne au texte une hauteur et une largeur correspondant à la taille de l'image de remplacement puis on indente le texte à gauche avec une valeur énorme de manière à le faire sortir de l'écran.

<h1>Mon blog</h1>

h1 {
    background: url(mon_blog.jpg);
    height: 100px;
    text-indent: -9999em;
    width: 350px;
}

Voir l'exemple.

Il est même possible de rendre l'élément cliquable comme si c'était une image en procédant ainsi :

[html]
<h1><a href="#" title="Retourner à l'accueil">Mon blog</a></h1>

[css]
h1 {
    background: url(mon_blog.jpg);
    height: 100px;
    width: 350px;
}

h1 a {
    display: block;
    height: 100px;
    text-indent: -9999em;
    width: 350px;
}

Voir l'exemple.

Le seul problème est que lorsqu'on clique le lien, les pointillés apparaissent autour de l'élément sont bien plus étendus sur la gauche qu'on pourrait s'y attendre comme le montre la capture d'écran suivante.

Heureusement il existe une parade simple à cela. Il suffit de donner la valeur "hidden" à la propriété overflow. L'exemple complet devient donc :

[html]
<h1><a href="#" title="Retourner à l'accueil">Mon blog</a></h1>

[css]
h1 {
    background: url(mon_blog.jpg);
    height: 100px;
    width: 350px;
}

h1 a {
    display: block;
    height: 100px;
    overflow: hidden;
    text-indent: -9999em;
    width: 350px;
}

Voir l'exemple.

Et voici le résultat :

Après quelques mois d'attente pour l'un et plus de 5 ans pour l'autre, voici que les nouvelles versions majeures des deux principaux navigateurs web sont disponibles. A noter que l'annonce officielle de la sortie de Firefox 2.0 devrait se faire dans la journée mais la version finale est disponible au téléchargement depuis hier soir.

J'ai donc décidé ce matin d'installer Internet Explorer 7. Je télécharge l'installateur de 15,8 Mo ce qui semble beaucoup quand on compare aux 5,4 Mo de Firefox soit dit en passant. Je lance l'installation.

Je patiente un peu puis me dis que je vais en profiter pour mettre également à jour Firefox. Je recherche le lien de téléchargement, ce qui me prend un minute environ. Je télécharge l'installateur, le lance, parcours les différents écrans. L'installation proprement dite se fait. Je lance la version de Firefox fraichement installée. Je fais un rapide tour, tout semble fonctionner.

Je reviens vers Internet Explorer 7 qui s'installe toujours ! Il faudra encore plusieurs minutes avant qu'il n'est terminé. Cerise sur le gâteau, je serais obligé de redémarrer mon ordinateur avant de pouvoir l'utiliser.

Faisons un rapide comparatif de la mise à jour de ces deux navigateurs :

Internet Explorer

• Nombre de langues disponibles : 1 (les autres seront disponible à la fin du mois en théorie)
• Nombre de plateformes supportées : 1 (et partiellement seulement)
• Taille : 15,8 Mo
• Temps nécessaire à l'installation : environ 8 minutes (redémarrage compris car il est obligatoire)
• Nécessite un rédemarrage : oui

Firefox

• Nombre de langues disponibles : 37
• Nombre de plateformes supportées : 3
• Taille : 5,4 Mo
• Temps nécessaire à l'installation : environ 1 minute 30
• Nécessite un rédemarrage : non

Au final, ma seconde impression d'Internet Explorer 7 n'est pas meilleure que la première. Espérons que ça changera par la suite.

Si vous suivez un peu l'actualité des langages de programmation en liaison avec internet, vous ne pouvez pas avoir manqué Ruby et son framework emblématique Ruby on Rails.

Beaucoup de développeurs PHP se laissent tenter par la simplicité de prise en main. On vante sa conception intelligente, les possibilités qu'il offre. Aux yeux de certains il est vu comme le remplacant de PHP à plus ou moins long terme.

Pourtant il semble que les créateurs du site officiel de RoR n'aient pas choisi d'utiliser ce framework ni même Ruby mais bien PHP comme le prouve cet easter egg. Celui-ci ne fonctionne que si la page appellée est en PHP. Avoir le module PHP installé sur le serveur n'est pas suffisant.

Note : Ceci n'est pas un troll contre RoR ou Ruby car je ne les connais pas assez pour avoir un avis. Simplement je trouve la situation amusante.

Alors que Microsoft annonce l'arrivée d'Internet Explorer 7 pour ce mois-ci, j'ai eu envie de tester son rendu avec un site que je suis en train de réaliser.

Le site a été conçu à l'aide de Firefox. Une fois la mise en page effectuée et le code HTML et CSS validé, j'ai vérifié qu'il passait bien sur les principaux navigateurs. Les navigateurs modernes n'ont posé aucun problème. Internet Explorer 6 et 5.5 ont demandé quelques menues adaptations notamment pour contourner le Doubled Float-Margin Bug.

Internet Explorer 7 en revanche affiche un rendu catastrophique. Que ce soit avec ou sans les adaptations pour Internet Explorer 6 et 5.5. Cela veux donc dire que non seulement il ne rend pas correctement ma mise en page valide et qui passe sur les navigateurs dignes de ce nom mais en plus il a des bugs différents, et en l'occurence pires, que les versions précédentes. Franchement, ce n'est pas rassurant.

Voici le rendu sous Internet Explorer 6. Il correspond à ce qui est attendu :

Et voici le rendu sous Internet Explorer 7 :

Note : Je n'ai pas utilisé de hacks mais des commentaires conditionnels pour les adaptions pour Internet Explorer 6 et 5.5. Le problème d'affichage avec la version 7 ne peut donc pas venir de là.

Jeudi et vendredi, j'ai assisté à Paris Web 2006, un ensemble de conférences sur les standards et l'accessibilité dans le domaine du web.

Pour aller droit au but, je suis ravi d'avoir été à cet evênement. L'organisation était sans faille, ce qui est d'autant plus remarquable que c'était première édition. Les orateurs étaient de qualité et les sujets traités étaient très pertinents.

Voici un rapide compte-rendu de mes impressions concernant les conférences :

Jeudi

• État des lieux par Tristan Nitot : Une prestation classique mais pleine d'humour et de décontraction. Du pur Tristan.
• L'accessibilité selon le W3C par Laurent Denis : Contenu très intéressant mais une élocution lente voire trop lente qui m'a un peu rendu pénible cette conférence.
• Passer aux standards dans une grande entreprise par Jean-Louis Carvès : Quelques points intéressants mais des longueurs.
• Vendre les standards par Laurent Gloagen : Laurent n'était visiblement pas à l'aise mais au delà de la forme, le fond était très décevant. J'ai l'impression que le sujet n'a pas été traité. (Attention, il n'y a aucune attaque personnelle dans mes propos. Laurent avait l'air sympathique tout au long de ces 2 jours. je ne parle là que de sa conférence.)
• Gérer la qualité Web par Elie Sloïm : Pour moi et apparement pour pas mal de gens, la meilleure conférence de ces 2 jours, et de loin. Excellent orateur, excellent contenu, que demander de plus ?
• 1, 2, 3, CSS ! par Pascale Lambert-Charreteur : Bonne prestation même si j'aurais préféré que plus de temps soit consacré à CSS 3 et moins à CSS 1 et 2. Cette conférence était probablement trop technique pour cette journée décideur.

Vendredi

• Conception ergonomique universelle et usage du web par Denis Chêne : Contenu dense et pointu, pas forcément simple d'abord pour un néophyte mais prestation très intéressante.
• Comment lier une sauce à partir d'éléments a priori incompatibles ? par Rémy Birambeau : Conférence agréable mais sans trop de profondeur.
• Les standards HTML et CSS, des origines à mercredi dernier par Daniel Glazman : Très bonne prestation, contenu fouillé et forte légitimité. Explication de technologies, de jeux politiques et d'evênements qu'on ignore mais qui impactent fortement notre quotidien de développeur.
• Cas concret : Capgemini par François Nonnenmacher : Très bon retour d'expérience avec un récit fouillé, précis et avec des anecdotes qui rendent la prestation plus vivante. En revanche j'aurais plutôt vu cette conférence lors de la journée destinée au décideurs.
• Une conception à l'épreuve du futur par Denis Boudreau : Cette conférence m'a laissé perplexe. D'un côté je ne peux pas en dire du mal mais en même temps je n'ai pas été passionné non plus.
• Enrichissons nos relations par Karl Dubost : Un peu abstrait mais quelques pistes pour aborder un sujet complexe et nébuleux pour le néophyte que je suis.

En plus des conférences, Paris Web 2006 m'a permis de revoir ou de rencontrer un certain nombre de personnes et c'est aussi ça l'esprit de ce genre de manifestation. L'apéritif ouvert à tous était également une excellente idée. J'avais rarement vu une telle concentration de geeks au mètre carré.

Pour conclure, Paris Web 2006 a été un véritable succès de mon point de vue et j'ai hâte de m'inscrire pour l'édition 2007 !

Dans le cadre des rencontres Blog en nord - Meet the blogger Lille, une conférence gratuite consacrée au référencement aura lieu à Lille le 29 septembre 2006 de 14 h à 17 h.

Les intervenants seront Olivier Andrieu du site Abondance et Sébastien Billard, auteur du blog Référencement, Design et Cie.

Il est parfois utile de pouvoir passer un nombre variable d'arguments à une fonction. Par exemple lorsqu'on veux transmettre une liste sans passer par un tableau.

Avec PHP cela se fait très simplement à l'aide de la fonction func_get_args() :

<?php
function test()
{
	$arguments = func_get_args();
	for ($i = 0, $taille = count($arguments); $i < $taille; $i++) {
		echo $arguments[$i];			
	}
}

test('arg1', 'arg2', 'arg3');
?>

Aujourd'hui, j'ai eu besoin de le faire en Javascript. Après quelques recherches, j'ai trouvé que cela se fait ainsi :

<script>
function test() {
	for(var i = 0; i < arguments.length; i++) {
		alert(arguments[i]);
	}
}
test('arg1', 'arg2', 'arg3');
</script>

Non contents d'éditer une série de logiciels en mode hébergé à succès et d'être à la base du plus que fameux framework Ruby on Rails, les gens de 37signals ont publié un livre : Getting Real. Disponible uniquement au format PDF pour 19 $, celui-ci explique comment concevoir une application Web.

Il ne s'agit pas de donner des conseils concernant le balisage HTML ou la programmation PHP mais de livrer un certain nombre de réflexions sur la conception et le développement d'une application Web.

Les auteurs nous livrent leur vision de ce que devrait être une application Web, principes qu'ils ont appliqués à leurs propres produits avec le succès que l'on sait. L'essence du livre pourrait être résumé ainsi : moins c'est mieux. L'ensemble du processus de réalisation est passé en revu sous cet éclairage a priori étonnant mais finalement plein de bon sens.

J'ai dévoré les 171 pages en 2 soirées. Je ne peux donc que vous conseiller de lire les chapîtres gratuits pour découvrir ce livre.

Le programme de Paris Web 2006 commence à se profiler. Cette manifestation en français se tiendra les 21 et 22 septembre prochain à Paris. Ce cycle de conférences a pour thème l'accessibilité, la qualité et le design pour le Web.

La liste des conférenciers est assez impressionante et devrait encore s'aggrandir :

• Denis Boudreau
• Jean-Louis Carvès
• Karl Dubost
• Daniel Glazman
• Pascale Lambert-Charreteur
• Tristan Nitot
• François Nonnenmacher
• Élie Sloïm

Pour ma part j'y serai.

Au fil des années, j'ai eu le loisir de tester un certain nombre d'hébergeurs dont OVH, 1and1, Ikoula, Nexen Services. Pour le moment, je n'ai jamais été totalement satisfait. Récemment, j'ai découvert TextDrive qui semblait être la perle que je cherchais désespérément. Malheureusement, si cet hébergeur propose beaucoup de services appréciables, il y a certains aspects qui me dérangent vraiment (gestion des sous-domaines, pas de gestion personnalisée des DNS).

Voici ce que j'attend d'un hébergeur :

• Une version récente de PHP avec les extensions courantes (la dernière voire l'avant dernière pas plus vieux)
• Une version récente de MySQL (version 4.1 minimum donc)
• Accès distant à MySQL (via un frontend par exemple)
• Accès SSH
• Accès au fichiers .htaccess
• mod_rewrite
• Possibilité de gérer plusieurs sites indépendant avec leurs domaines notamment
• Possibilité d'avoir plusieurs domaines pointant vers un même hébergement
• Possibilité d'éditer les DNS pour créer des sous-domaines extérieurs par exemple
• Mailing-lists
• Un support capable de comprendre une demande et de répondre en français (oui ça parait incroyable mais OVH et 1and1 ont les pires difficultés à ce niveau)

Et voici les plus que j'apprécie :

• Un espace disque conséquent (plus d'1Go)
• Subversion
• IMAP
• Cron
• WebDAV

Je fais donc appel à toi fidèle lecteur pour me faire découvrir l'hébergeur qui a su te convaincre de rester chez lui.

Ce matin nous avons été confronté à un problème surprenant au travail. Une requête SQL qui passe très bien sur 2 serveurs mais qui indique qu'un champ est inconnu dans une jointure sur un troisième.

Après observation, la seule chose qui parraissait un peu étrange dans la requête SQL était le fait que l'une des jointures ne se faisait pas dans l'ordre logique. Voici un exemple simplifié de la requête illustrant le problème :

SELECT *
FROM `clients` AS c
INNER JOIN `groupes` AS g ON g.id = s.id_groupe
INNER JOIN `societes` AS s ON s.id = c.id_societe

En toute logique, il aurait fallu faire la jointure sur la table groupes après celle sur la table sociétés. Cependant cette requête passe parfaitement sur deux serveurs. Le second point étonnant est que ces fameux serveurs sont en version 4.1.12 tandis que celui qui pose problème est en 5.0.18. Rétablir l'ordre logique des jointures règle le problème.

Après quelques recherches, il s'avère que ce n'est pas un bug mais une nouvelle fonctionnalité. Afin de mieux coller au standard SQL:2003, MySQL a modifier sa gestion des jointures sur de nombreux points dont celui-ci. En attendant de modifier vos requêtes, vous pouvez rétablir le comportement de MySQL 4.0 en modifiant le mode SQL.

Oracle vient d'annoncer le rachat de Innobase Oy, la société Finlandaise qui développe le moteur de table InnoDB dans MySQL.

La société américaine annonce poursuivre sa volonté de s'impliquer plus dans le mouvement Open Source.

Espérons que ce beau discours ne cache pas un moyen de maîtriser voire supprimer le meilleur atout d'un concurrent, certes encore modeste mais au potentiel indéniable.

En effet, si pour la branche 3.x de MySQL, le moteur préconisé était MyISAM, les nouvelles fonctionnalités de MySQL (transactions, clés étrangères etc.) sont basées sur le moteur InnoDB.