Les articles du mois de février 2012

Lu chez James Hague, « Une compréhension complète n’est plus possible » :

Supposons que vous venez juste d’acheter un MacBook Air, et que votre objectif est de devenir maître de la machine, de comprendre comment elle fonctionne à tous les niveaux.

Le livre « Mac OS X Internals: A Systems Approach » d’Amit Singh est un bon début. Ça ne parle pas tant de programmation que de discours approfondis sur la façon dont toutes les parties du système d’exploitation fonctionnent entre elles : ce que fait le firmware, les séquences d’événements durant le démarrage, ce que les drivers font, et ainsi de suite. A 1680 pages, ce n’est pas une petite lecture.

Pour vraiment comprendre le matériel, Intel a gentiment mis à disposition une documentation gratuite en 7 volumes. Je vais rester simple en recommandant la lecture de Intel 64 and IA-32 Architectures Software Developer’s Manual Volume 1: Basic Architecture (550 pages) et les deux volumes décrivant les jeux d’instructions (respectivement 684 pages et 704 pages).

[…]

Le total de tout ça, c’est plus de 11 000 pages de lecture. J’ai omis d’inclure les pages man pour des centaines d’utilitaires système et la documentation d’Xcode. Et je n’ai même pas encore abordé les connaissances graphiques nécessaires pour faire quoi que ce soit d’intéressant avec OpenGL, ou comment écrire du bon C ou Objective-C ou quoi que ce soit concernant la conception orientée objet, et…

Son article touche un très bon point, et ça m’a rappelé cette vidéo de l’excellent Richard Feynman  (prix nobel de physique et joueur de bongo) qui remets un journaliste à sa place quand il lui demande comment fonctionnent des aimants. Si vous ne connaissez pas Richard Feynman, rendez-vous service et regardez cette vidéo.

Le journaliste : Quand vous tenez deux aimants, et que vous les poussez l’un contre l’autre, vous sentez cette pression entre les deux. Et quand vous les retournez, et ils se collent l’un avec l’autre. Qu’est-ce que c’est cette sensation entre deux aimants ?

Richard Feynman : Qu’entendez-vous par « qu’est-ce que c’est cette sensation ? »

Le journaliste : Et bien, il se passe quelque chose. Cette sensation, il y a quelque chose…  quand vous collez deux aimants l’un contre l’autre.

Richard Feynman : Ecoutez ma question : qu’entendez-vous par « quelle est cette sensation » ? Bien sûr qu’il y a quelque chose. Mais que voulez-vous savoir ?

Le journaliste : Ce que je veux savoir, c’est ce qui se passe, entre ces deux morceaux de métal.

Richard Feynman : Les aimants se repoussent l’un l’autre.

Le journaliste : Oui mais qu’est-ce que ça signifie ? Ou pourquoi est-ce qu’ils font ça ? Ou comment est-ce qu’ils font ça ? … J’estime que c’est une question parfaitement raisonnable.

Richard Feynman : Bien sûr ! C’est même une excellente question ! Mais le problème, c’est quand vous demandez « Pourquoi quelque chose se passe ». Comment quelqu’un réponds à une question comme ça ?

Par exemple, Tante Minny est à l’hôpital. Pourquoi ? Parce qu’elle a glissé sur la glace et qu’elle s’est cassée la hanche. Cette réponse satisfait les gens. Mais ça ne satisferait pas quelqu’un qui vient d’une autre planète et qui ne connaît rien de nous. Par exemple pourquoi quand on se casse la hanche on va à l’hôpital ? Comment vous rendez-vous à l’hôpital quand votre hanche est cassé ? Et bien son mari a vu qu’elle s’était cassé la hanche, il a appelé l’hôpital pour que quelqu’un vienne la chercher. Tout ceci est compris implicitement par les gens.

Quand vous expliquez « Pourquoi », vous devez être dans un cadre de travail qui permets à quelque chose d’être vrai. Sinon vous continuerez éternellement de demander pourquoi.

Pourquoi est-ce que le mari a appelé l’hôpital ? Parce que le mari est intéressé par le bien être de sa femme. Mais tous les maris ne sont pas toujours intéressés dans le bien être de leur femme, quand ils sont soûls et en colère. Et donc vous commencez à avoir une compréhension très intéressante du monde et toutes ses complications. Si vous essayez de poursuivre la moindre branche, vous irez de plus en plus loin dans différentes directions.

Je pense que c’est vrai également pour le métier d’intégrateur. Avec toutes les nouveautés techniques apparues rapidement ces dernières années (HTML5, CSS3, Canvas, WebGL, …), et la mise en avant massive des technologies côté client en dehors du web (applications mobile, Windows 8, …), il n’est plus possible pour un intégrateur de maîtriser l’ensemble des technologies mises à sa disposition. Le métier d’intégrateur et plus largement de développeur front-end va alors se diviser en de nouvelles branches, tout comme il y a 10 ans le métier d’intégrateur s’était détaché du métier de webdesigner.

On en arrive alors à ce que vous aimez faire. Qu’est-ce que vous préférez ? Est-ce l’organisation de contenus basés sur la sémantique HTML ? Ou la mise en page en CSS ? Ou le développement d’interactions en JavaScript ? Est-ce que vous souhaitez continuer à faire des sites web ? Ou est-ce que vous voulez vous spécialiser dans le développement d’applications web (pour mobiles ou pour les OS dédiés) ?

Peu importe la réponse, trouvez ce que vous aimez, et creusez le sujet à fond. Car peu importe votre spécialité, ça deviendra votre plus grand atout.

J’ai souvent eu à intégrer des pages statiques avec des longues listes de liens. La plupart du temps, les chefs de projets utilisent Excel (ou OpenOffice, LibreOffice ou Google Docs) pour rassembler et partager tous ces liens. Typiquement, on va y trouver une colonne avec l’intitulé du lien, et un autre avec l’URL du lien.

A partir de ces liens, je vais devoir générer le code HTML suivant :

<ul>
<li><a href="http://www.hteumeuleu.fr/chrome-sous-android-ne-supporte-pas-flash/">Chrome sous Android ne supporte pas Flash</a></li>
<li><a href="http://www.hteumeuleu.fr/cout-grandissant-developpement-interactif/">Le coût grandissant du développement interactif</a></li>
<li><a href="http://www.hteumeuleu.fr/produire-c-est-decourager-la-creativite/">« Produire, c’est décourager la créativité. »</a></li>
<li><a href="http://www.hteumeuleu.fr/statistiques-google-janvier-2012/">Les statistiques de Google+ en janvier 2012</a></li>
</ul>


Une façon basique d’arriver à ce résultat serait d’intégrer chaque lien un par un, en copiant l’intitulé du lien, en le collant dans son éditeur de code, puis en copiant l’URL du lien, et en la collant dans son éditeur de code. Mais clairement, c’est long, fastidieux et très pénible. Et ce n’est clairement pas adapté pour des documents de plusieurs centaines de liens.

Voici une façon beaucoup plus simple d’arriver au même résultat en utilisant de simples formules dans un tableur. Ces formules fonctionnent en principe dans n’importe quel tableur (Excel, OpenOffice, LibreOffice, Google Docs), mais selon la langue du logiciel il est possible que vous deviez traduire le nom des fonctions utilisées.

Dans un tableur, pour concaténer deux valeurs de cellules ou deux chaînes de caractères, on va utiliser l’opérateur & (ex : A1 & A2). Une chaîne de caractère doit être délimitée par deux double guillemets anglais (ex : A1 & « toto »). Pour échapper des double guillemets dans une chaîne de caractère, il faut écrire deux double guillemets. Voici alors la formule qu’on utiliserait dans une colonne C pour générer la balise d’un lien dont le contenu se trouve dans la colonne A, et l’URL dans la colonne B.

="<li><a href=""" & B1 & """>" & A1 &"</a></li>"

Si vous avez un document bien formaté, vous pouvez dores et déjà étendre cette formule à tout votre colonne, et vous n’aurez plus qu’à copier/coller le tout dans votre page HTML ! Mais souvent, les documents de ce genre sont remplis d’annotations, avec des lignes vides ou commentées pour structurer un peu le document. On va alors peaufiner un peu notre formule en ajoutant un traitement conditionnel avec la fonction IF (ou SI en français). Cette fonction prends 3 paramètres : IF(test; valeur si vrai; valeur si faux). Afin de s’assurer qu’on doit bien générer du HTML pour la ligne en cours, on va vérifier si la cellule de la colonne URL n’est pas vide. Si c’est le cas, on génère bien le HTML, sinon on n’affiche rien. On obtient alors la formule suivante :

=IF(B1<>""; "<li><a href=""" & B1 & """>" & A1 & "</a></li>" ;"")

Pour finaliser tout ça, je peux également insérer une nouvelle formule dans une cellule vide qui va concaténer toutes mes balises <li>, et les englober dans une balise <ul>. Pour concaténer rapidement toute une plage de cellule, on va utiliser la fonction CONCATENATE(). Ça donne quelque chose comme ça :

=CONCATENATE("<ul>"; C3:C56; "</ul>")

Et voilà ! Vous n’avez plus qu’à copier le contenu de cette cellule dans votre page HTML. J’ai créé sur Google Docs un document d’exemple pour que vous puissiez voir le résultat directement.

Il y a 2 ans, le 24 février 2010 à 15h52, je publiais mon premier tweet. A la base, j’ai créé un compte Twitter surtout pour moi. Chaque jour, je lis beaucoup d’articles, de tutoriels et d’actualités sur le développement web. Je conservais les articles qui m’intéressaient vraiment dans mes favoris, mais c’est très vite devenu ingérable. Je me suis dit qu’en les publiant sur Twitter, je pourrais facilement en garder une trace, et qu’au passage, ça intéresserait peut-être d’autres gens.

Il s’avère que ça ne s’est pas trop mal passé.

Il se trouve que j’aime beaucoup Twitter. J’essaie de garder le nombre de comptes que je suis à un nombre raisonnable, en suivant principalement des comptes orientés web. Mais en réalité, je me rends compte que ces 2 dernières années, Twitter a été ma première source d’informations, même bien au-delà de l’actualité du web.

Quelques mois plus tard, j’ai lancé ce blog. L’objectif de ce blog est d’être la continuité du compte Twitter, en partageant mon point de vue sur des sujets qui me tiennent à coeur. Certains appellent ça du troll, mais sincèrement, ce n’est que mon point de vue. Et ceci n’est qu’un blog personnel.

Je lis beaucoup d’articles sur beaucoup de blogs, et je suis toujours aussi surpris de la neutralité et de la consensualité que certains rédacteurs adoptent sur leurs blogs personnels. Je préfère largement lire un article passionné, avec un point de vue (quitte à ne pas être d’accord), plutôt qu’un article sans saveur digne d’un communiqué de presse.

Il y a une citation que j’aime bien (bizarrement attribuée à Mark Twain) qui dit « Danse comme si personne ne te regardait ». J’essaie d’adopter cette philosophie sur mon blog, en écrivant comme si personne ne me lisait. Et si ça peut rassurer mes détracteurs, c’est souvent le cas.

Voici quelques statistiques sur mon blog depuis son lancement en juillet 2010. J’ai eu 98 509 visites, 67 496 visiteurs uniques, et 213 808 pages vues. 58% de mes lecteurs sont sur Windows, 22% sur Mac OS, 9% sur Linux et 6,5% sur iOS (oh, et Android : 2,55%). 43% sont sur Firefox, 33% sur Chrome, 9% sur Safari et 4% sur Internet Explorer (et parmi ces 4%, 54% sont sur IE8, 25% sur IE9, 14% sur IE7, 5% sur IE6). La nuit je rêve d’avoir des statistiques de navigateurs similaires sur les sites de mes clients. 38% de mon trafic est direct, 20% vient de Twitter, 18% vient de Google, 8% vient de Facebook (et 0,5% vient de Google+).

Voici une petite liste des articles les plus vus sur mon blog :

5. Des maquettes difficilement intégrables… wait, what ? (octobre 2011)
4. Estimer un temps de développement, c’est difficile (février 2012)
3. Le Pixel Perfect (mai 2011)
2. Des démos WebGL (février 2011)
1. Les développeurs, graphistes et chefs de projets (juin 2011)

Laissez moi revenir en détails sur ce numéro 1. La réception de cet « article » a été phénoménale. Pourtant, j’ai vraiment fait cette image à l’arrache, un mardi soir devant la télé, quelques semaines après avoir vu une image du même genre sur Reddit. Le mercredi matin, je l’ai publiée, et puis je l’ai twittée. Et là, ça a été l’avalanche. Depuis sa publication, l’article a été vu plus de 33 000 fois sur mon blog, et le fichier JPG seul a été vu plus de 76 000 fois depuis mon serveur, générant plus de 7 Go de trafic. Mais l’image a aussi été reprise un nombre impressionnant de fois sur d’autres blogs. Elle a même été traduite en anglais quelques semaines plus tard, et retweetée par George Broussard himself. Grâce ou à cause de cet article, voilà à quoi ressemblent les statistiques du blog ces 2 dernières années.

Je pense que cet anniversaire est la bonne occasion pour remercier tous mes lecteurs et tous mes followers. Alors : merci.

 

Adobe a publié cette semaine sa feuille de route pour Flash ces prochaines années, et je ne pouvais pas être plus satisfait :

Avec la croissance de la compétition sur le marché des navigateurs, les fabricants de navigateurs ont de plus en plus innové et ont fourni des fonctionnalités qui ont permis de déployer des animations riches directement grâce aux technologies du navigateur, une rôle autrefois joué principalement par Flash Player. De plus en plus, les animations riches seront déployées directement dans le navigateur en utilisant HTML5, CSS3, JavaScript et les autres technologies modernes du web. Alors que le rôle premier de Flash en tant que moteur d’innovation sur le web reste le même, ce pour quoi il sera utiliser va changer.

Adobe croit que les moteurs d’exécution de Flash se prêtent particulièrement bien à deux utilisations principales : créer et déployer des jeux riches, expressifs avec des graphismes de la qualité d’une console, et déployer des vidéos premium.

Ce changement de cible pour Flash ne signifie pas que les contenus existants ne fonctionneront plus, ou que Flash ne pourra pas être utilisé pour des contenus autres que du jeu et de la vidéo. Par contre, ça signifie que lorsque nous devrons prioriser les développements futurs et les corrections de bugs, le jeu et la vidéo seront nos priorités.

Soyons clairs : aujourd’hui, si vous souhaitez diffuser de la vidéo et que vous êtes un minimum sérieux, vous êtes obligés de proposer une alternative à Flash. D’après NetMarketShare, les utilisateurs mobiles représentent 9% des internautes, et ce chiffre ne va faire qu’augmenter ces prochaines années. Aujourd’hui, plus de 60% du marché des navigateurs supporte nativement les vidéos en HTML5, et ce chiffre ne va faire qu’augmenter ces prochaines années. Les vidéos en HTML5 ont des lacunes, comme l’absence de gestion de contenus protégés (DRM). Mais Adobe le dit clairement : à part pour de la vidéo premium, utiliser Flash est une hérésie.

Et quand au jeu, j’ai un tout petit peu de mal à voir comment Adobe va s’en sortir. Depuis 3 ans, Adobe nous rabâche chaque année des nouvelles démos de jeux en 3D époustouflantes avec des gros éditeurs : Square Enix, Epic Games et l’Unreal Engine, … Mais ces 3 dernières années, tout ceci en est resté au stade de vidéo de présentation.
En comparaison, ces 3 derniers mois, on a vu arriver les portages en HTML5 de deux des jeux les plus vendus l’année dernière : Angry Birds et Cut the Rope. Il ne s’agit pas de vidéos de promesses de ce que pourraient potentiellement être des jeux en HTML5. Non, il s’agit du vrai truc.

Adobe en profite pour détailler sa feuille de route pour 2012 avec de nouvelles versions de Flash Player (noms de code « Cyril » et « Dolores »), et présente vaguement les prochaines fonctionnalités de Flash pour les années à venir (« Flash Player Next »).

Adobe présente également le support fourni pour Flash pour les différents systèmes et plate-formes, en rappelant la toute fraîche annonce de l’abandon de Flash Player pour Linux aux mains de Google. Voici un petit récapitulatif du support de Flash pour le web :

• Apple OS X : Flash Player est toujours supporté, mais n’est plus installé par défaut sur aucun Mac.
• Microsoft Windows : Flash Player est supporté (pour le moment).
• Windows 8 : Flash Player (comme tout autre plugin) ne fonctionnera pas dans la version Metro de Windows 8 (destinée aux écrans tactiles).
• Linux : Flash Player est supporté, désormais par Google, uniquement sous Chrome.
• Mobile : Flash Player n’est plus supporté.
• Télévision : Flash Player n’est plus supporté.

Je ne voudrais pas vendre la peau de l’ours avant de l’avoir tué, mais ça me fends le coeur de voir un ours agoniser ainsi.

Depuis le début de l’année, j’ai l’impression que chaque semaine voit son lot de nouveaux scandales autour de Google. En voici une petite liste non exhaustive :

• Google a monté une vaste escroquerie au Kenya pour se faire passer pour un annuaire local et inciter les entreprises à créer un site sur l’équivalent du très mauvais « Mon entreprise en ligne ». (source)
• Des employés de Google ont été surpris en train de vandaliser les données d’OpenStreetMap. (source)
• Google a pénalisé Chrome dans ses résultats de recherche, lui faisant perdre 0,17% de parts de marché en janvier, après avoir violé ses propres règles de SEO pour promouvoir Chrome. (source)
• Google a changé sa politique de respect de la vie privée, les autorisant à faire du croisement de données entre tous leurs services pour mieux vous profiler. Si vous n’êtes pas d’accord, vous n’avez aucune possibilité de refuser ce changement de politique. (source)
• Google favorise désormais les résultats de son propre réseau social, Google+, au détriment de la pertinence et de la neutralité de son moteur de recherche (source)
• Larry Page aurait dit à ses employés : « Comprenez Google+ ou partez »
• Google contourne les préférences de vie privée de Safari et d’IE pour continuer de vous traquer. (source)
• Google a supprimé les liens de ses logos pour revenir à l’accueil, le b.a.-ba de l’ergonomie depuis la nuit des temps. (source)

Et on est que le 53ème jour de 2012. Google devrait relire son propre code de conduite.