Les dernières news, intégration XHTML/CSS, HTML5, développement web, Terragen 2…

News au format RSS
Suivez-moi sur Twitter (Nico3333fr)

Bug sur Internet Explorer sur les attributs width et height de img (le 24/05/2013)

Pas plus tard que ce matin, un client m'appelle pour me dire que des images ont disparu sur son site sous IE, alors qu'elles sont bien dans le code.

Tout de suite, premier réflexe : vérifier les problèmes générés par le HasLayout. Raté, ce n'est pas ça.

Second réflexe : penser que les images JPEG en question sont en CMYK (les vieux IE ont quelques soucis avec). Raté, pas ça non plus.

Pire, le problème apparait également sur IE10. Je cherche une solution CSS, rien. Au final, cela venait en fait du code HTML. Tout simplement, si vous mettez des attributs width et/ou height vide(s) sur la balise img, IE ne les affichera pas (d'après ce que j'ai pu voir, IE10 réduit la valeur de l'attribut à 1 dans ce cas).

Plutôt qu'un long discours, un court exemple : j'ai listé 7 exemples de ce bug d'attributs vides sur cette page. Regardez la page sous Firefox, et observez-la sous IE : 5 cas ne fonctionnent pas sous IE.

  • S'il n'y a aucun attribut, cela fonctionne.
  • Si ces attributs sont remplis correctement, évidemment, cela fonctionne.
  • Si un ou les attribut(s) est(sont) présent(s) mais vide(s), patatrac, l'affichage plante.

Autant être clair, je n'incrimine pas IE en particulier, c'est bien une erreur de code qui est juste bizarrement interprétée par ce navigateur.

En tout cas, nous sommes bien d'accord : cette situation ne devrait jamais arriver, la bonne pratique étant de spécifier ces attributs tout le temps. Toutefois… qui a dit que cette bizarrerie ne pourrait jamais arriver ? :)

Réinventer le chemin… pas la roue (le 20/05/2013)

En matière d'intégration, j'entends souvent chez les débutants (et même les moins débutants) la réflexion suivante :

Pourquoi réinventer la roue ? Y a qu'à utiliser tel framework/tutoriel/utilitaire/etc.

La réflexion n'est pas idiote, loin de là : déjà dans un contexte de production, il est possible d'être amené à faire des choix qui favorisent la rapidité. Aussi, il peut être utile de disposer d'outils qui font le sale boulot, de s'inspirer d'autres choses, de s'appuyer sur une base, etc.

Moi-même, je ne fais pas exception : mon « nano-framework » CSS RÖCSSTI s'inspire et reprend des éléments d'autres projets (comme KNACSS), c'est même écrit dessus.

Néanmoins, un point me chagrine dans cette approche : éviter de réinventer la roue est une chose intelligente, néanmoins cela va vous dispenser du chemin parcouru (par la roue si j'ose dire). Plus gênant, cela peut vous priver des chemins de traverse pendant que vous parcourez ce chemin.

Quand j'ai commencé à intégrer – mode vieux con –, disons-le net, il fallait tout inventer : la documentation était quasi-inexistante, l'intégration était le parent pauvre du Web, etc. Du coup, je reconnais que j'ai parfois un peu tendance à aller trop loin dans la réinvention de la roue. Mais dans mon esprit, je me dis que l'effort fourni pour connecter mes petits neurones m'aura fait apprendre plus que d'utiliser bêtement quelque chose. Et ça me donne beaucoup d'idées.

Maintenant, je constate chez les p'tits stagiaires que je vois passer une approche presque aussi dangereuse si elle est trop extrême : le « je n'(ré)invente rien ». Savoir utiliser quelque chose est bien, mais c'est quand même selon moi plus intéressant de comprendre comme cela marche. Et pour cela, quoi de mieux que de partir from scratch ? Quand je vois des personnes qui se présentent comme futurs intégrateurs et qui sont terrifiés à l'idée de partir de zéro ou du minimum, j'avoue que ça me laisse pantois.

C'est pour cela que je maintiens : si quelqu'un a envie de réinventer la roue, dans la mesure du possible, laissez-le faire. Il a besoin de parcourir un chemin, et qui sait où ce chemin pourrait l'emmener ?

Mars Render en HD disponible (le 20/05/2013)

J'avais recalculé certaines parties de l'animation « Mars Render » en HD pour l'émission Ushuaïa Nature, et au final, je l'avais recalculée intégralement pour mon plaisir.

Le Mont Olympe dans Mars Render HD

Si vous êtes curieux de ce que calculer une animation en HD implique, alors faites un tour sur l'annonce de « Mars Render » recalculée en HD, j'y dispense des chiffres intéressants.

L'animation est d'ailleurs toujours disponible sur Youtube : Mars Render HD sur Youtube.

Pourquoi vous reparlé-je de cette animation ?

En fait, j'ai toujours été un peu frustré de ne pouvoir faire comme pour toutes les animations de ce site, à savoir la mettre à disposition sur la page de mes animations avec Terragen.

En essayant de réduire un peu le poids, je suis arrivé à un fichier de 750 Mo, du coup… j'ai craqué, et tant pis pour ma bande-passante (que je vais activement surveiller quand même). La vidéo est disponible sur la page de mes animations avec Terragen.

Vous pourrez voir la qualité incroyable des paysages créés par Arnaud et Florent Creux, ainsi que ceux d'Yves Maquinay. Les images ont un piqué extraordinaire, c'est un peu comme si vous redécouvriez votre film préféré en Blue-ray alors que vous aviez l'habitude de le voir sur une VHS.

Et je peux bien l'annoncer, une autre animation qui a toujours été parmi mes préférées est en train de subir le même traitement, à savoir un recalcul complet en HD !

J'aime mon graphiste (le 18/05/2013)

Oui, il est possible de trucider cette légende urbaine comme quoi intégrateurs et graphistes ne sont pas fait pour s'entendre.

Comme le dirait Octave dans le film « 99 Francs » :

Il est à moi, c'est MON graphiste.

Mon graphiste a plein de qualités extraordinaires, déjà, il a le bon sens de discuter avec moi quand il fait ses maquettes, ce qui m'évite des échanges houleux comme par exemple – par exemple hein – je reçois une maquette impossible à faire tourner avec un CMS qui par principe permet d'ajouter des pages. D'ailleurs, il a compris que quand il est perdu pour pondre une maquette pour smartphone, il peut venir me voir pour que je puisse lui donner des pistes d'après mon code.

Ensuite, au lieu de croire comme la plupart des blaireaux sortis des écoles d'arts que la Terre entière va s'agenouiller devant sa créativité (bien sûr, tous sont le nouveau Picasso du Web), il écoute et essaie de comprendre la chaine de production à tous les étages. Il a le grand mérite de s'y intéresser.

Il a compris que si je lui demande des exports en sprites CSS, ce n'est pas juste pour le plaisir de lui casser les pieds, mais que cela sert la qualité du site. Pareil, quand je lui parle de contrastes, il a compris que le site n'est pas là pour favoriser son ego, mais bien pour des utilisateurs.

Il a également pigé que la créativité se loge à des endroits bien surprenants parfois.

D'ailleurs, le fait qu'il m'écoute me donne encore plus envie de respecter son travail, c'est quand même dingue ce qu'une bonne entente produit. En fait, on n'a pas besoin tant que cela de discuter des heures comme je pourrais le faire avec un bobet qui ne comprend rien à rien de mon boulot d'intégrateur. Des fois, je reçois des images en sprites sans même les avoir demandées. D'ailleurs, parfois, je n'imaginais pas utiliser cela dans certains cas, et il me pousse à le faire. D'ailleurs, mon framework CSS est aussi là pour permettre de mieux respecter ses maquettes.

On se consulte bien sûr, personne n'est parfait, ni lui, ni moi. Mais cette entente nous fait en fait discuter que sur des questions intéressantes, pas des engueulades stériles de crétins butés.

Vraiment, j'aime mon graphiste, c'est un vrai Web Designer

Pour gagner du temps à tester les Microdatas (le 16/05/2013)

La petite astuce du jour : si comme moi, vous vous intéressez aux Microdatas, vous connaissez peut-être le Google Structured Data Testing Tool.

Si vous avez la Webdevelopper Toolbar sous Firefox :

  • allez faire un petit tour dans « Outils>Régler outils »,
  • là vous pouvez cliquer sur « Ajouter… »,
  • il vous suffit de préciser le nom de l'outil, pour ma part, je l'ai baptisé « Rich Snippet Tool »,
  • de cocher URL pour « Type d'outils »,
  • et d'indiquer http://www.google.com/webmasters/tools/richsnippets?url= dans le champ URL.

Et hop, voilà un raccourci bien pratique créé vers ce service !

Le même genre d'astuce est possible :

Le plaisir d'être fainéant n'a pas de prix !

Note de lecture : WebGrids, structure et typographie de la page web (le 13/05/2013)

Oui, vous pourrez me dire que je lis bien beaucoup ces temps-ci !

Toutefois, je ne pouvais ignorer les recommandations d'Emmanuel Clément qui m'avait chaudement recommandé ce livre : « WebGrids, Structure et typographie de la page web », écrit par Anne-Sophie Fradier.

WebGrids, Structure et typographie de la page web

Ce livre aborde un sujet sur lequel je suis bien… ignare (pour tout dire), à savoir la typographie.

L'ouvrage commence par une rapide histoire de la typographie, enchaine avec les spécificités du support, parle longuement des grilles et de l'agencement des blocs dans ces dernières, et termine par la composition du texte courant.

Je ne peux que constater que la recommandation d'Emmanuel était bonne : très agréable à lire, accessible sans être bateau, j'ai eu un certain plaisir et même un plaisir certain à le lire. Bon, disons-le net, je l'ai dévoré en moins de deux jours.

L'auteure prend le parti de ne pas assommer d'informations le lecteur et de le laisser découvrir cet univers de manière assez progressive, ce parti pris fonctionne parfaitement : étant assez débutant dans ce domaine, ma curiosité a été bien entretenue tout au long du livre, et je me rends compte à la fin de cet ouvrage que le sujet était en fait très dense. Le livre fait mouche sur beaucoup de points, assurément !

Je ne peux que vous recommander à mon tour de vous y intéresser, c'est un moment de lecture très intéressant et très agréable.

Le maillon le plus souple (le 11/05/2013)

Une pensée du week-end en passant…

De ma petite expérience du monde du travail (10 ans), j'ai pu remarquer que bon nombre de personnes n'ont aucune souplesse dans leur métier, avec peu ou prou le même raisonnement : partant de l'idée que « je suis le maillon fort donc le monde doit s'adapter à moi, la preuve, je suis indispensable », ces personnes ne plient jamais leur manière de travailler et c'est au monde autour de s'y conformer.

Si je n'ai rien contre un peu de rigueur dans son travail et de le défendre, le côté psycho-rigide de cette façon de penser m'exècre au possible, et encore plus dans les métiers du Web.

Il n'y a rien qui ne me rende plus dingue qu'un graphiste pas foutu d'écouter les contraintes de l'intégrateur, qu'un intégrateur infoutu de comprendre les problèmes du développeur back-end, qu'un développeur back-end qui massacre le travail de l'intégrateur avec l'argument vomitif du genre « mais l'inté, il sait pas coder », etc.

À toi, débutant et nouveau maillon dans la chaine de la création du site Web, je te le dis très simplement : comprends cet écosystème et comprends que ce n'est pas au monde de plier, c'est à toi de le faire.
Quand tu auras suffisamment compris cet écosystème, tu le feras infléchir sans même t'en rendre compte, mais cela n'aura plus d'importance.

Pour ma part, étant au front en matière de sites Web, je pense que la souplesse est une qualité pas seulement souhaitable, mais réellement indispensable. Je suis même encore plus exigeant avec les intégrateurs : leur travail étant un point de liaison entre le graphiste et le développeur, il se doit de comprendre leurs besoins et d'offrir toute la souplesse de son savoir pour permettre à toute la machine de bien fonctionner.

Dans le même genre, j'aime beaucoup l'approche que Luc Poupard explique dans un article intitulé « Les petits ruisseaux font les grandes rivières ». Je ne peux que vous encourager à lire cet article : je ne sais pas s'il a Free, mais il a tout compris.

Note de lecture : CSS3, le design web moderne (le 09/05/2013)

Avec énormément de retard, voici enfin une note de lecture sur « CSS3, le design web moderne ». Ce livre a été écrit par Vincent De Oliveira et Cédric Esnault, il est préfacé par David Rousset.

CSS3, le design web moderne

Le livre présente rapidement « l'état de l'art » de CSS, embraye sur les éléments du langage (principes, sélecteurs, unités, etc.), traite de tous les effets graphiques de CSS3 (ombres, dégradés, etc.), enchaine avec une solide partie sur la typographie, passe par le positionnement, le Web mobile, et termine par les transitions, les animations et les transformations. En guise de dessert, une partie finale sur les outils et ressources CSS vient compléter ce repas très complet  !

Très complet, j'y ai retrouvé l'immense savoir de leurs auteurs. J'ai eu le plaisir de rencontrer plusieurs fois Vincent De Oliveira lors d'événements comme la Kiwi Party, et le moins qu'on puisse dire, c'est qu'il connait diablement bien son sujet !

Assurément, c'est un très bon livre si vous tenez à vous mettre à la page en matière de CSS3 ou à perfectionner vos connaissances. Ajoutons à cela que le Web évoluant très vite, on peut vite avoir besoin d'utiliser toutes ces merveilleuses nouveautés. Le lire m'a d'ailleurs donné quelques idées !

De nombreux exemples très sympathiques sont en plus dispensés sur le site du livre « CSS3, le design web moderne », je ne peux que vous encourager à aller le visiter.

Du très bon boulot tout cela !

Tout ça n'a plus d'importance (le 04/05/2013)

Plusieurs remarques trouvent un écho dans ma petite tête où se mélangent plein de choses en cette fin de semaine.

On parle d'accessibilité dont on se fout, de justifier l'accessibilité, Sophie lâche un pragmatique « Et si on essayait d'être efficaces ». Tristan parle du bonheur, facteur de réussite.

Tout cela m'amène à citer un article de Rémi : Et si on créait de meilleurs sites pour rien.

En fait, c'est ça la clé. Tout ça n'a plus d'importance.

Si vous cherchez avant tout quelque chose en retour, vous courrez après un fantôme. Les apparences, les petits jeux ? Vous avez du temps pour ça ? Des excuses, ou vous attendez quelque chose ? Assumez, et n'attendez pas.

J'y vois même un écho particulier quand j'entends « je ne suis pas le mieux placé pour ». Ah ! Si Adam avait eu le même raisonnement, il aurait répondu à Ève « je ne suis pas le mieux placé pour te faire le voyou » (ou manger le fruit défendu, quelque chose comme ça), et on aurait été bien emmerdés…

Je redeviens sérieux.

Je ne me pose même plus ces questions. Je passe beaucoup de temps pour OpenWeb ? M'en fous, ça me fait plaisir. Pourtant, je peux vous citer 100 arguments tout à fait valables qui pourraient être utilisables pour dire que contribuer à OpenWeb est quelque chose de bien. Mais en fait, je sais que c'est bien et j'en ai l'intime conviction, et ça me suffit. Quelle motivation je trouve à donner du temps pour aider d'autres projets ? Je sais que c'est bien, et j'ai pas besoin d'autre justification.

J'ai pris beaucoup de temps pour écrire un article ? M'en fous, ce temps est mieux utilisé qu'à regarder une stupidité à la télévision. Le Web bien fait, comme l'expression l'indique, ça ne se lit pas, ça se fait.

Tout ça n'a plus d'importance.

Par contre, cela ne dispense pas que toutes ces (bonnes) choses prennent du temps, que je puisse avoir besoin de déconnecter pour faire autre chose, que je ne peux pas faire parfait de suite, que je ne peux m'abstraire d'être en bonne santé, de manger, que ça n'est pas toujours facile, etc.

Mais le reste, les justifications à deux balles… tout ça n'a plus d'importance.

L'interface d'admin pourrie et l'essentiel (le 29/04/2013)

Quand j'ai refondu ce site il y a maintenant 9 ans (et quelques jours), en bon fainéant que je suis, je me suis programmé une interface d'administration. Certes elle est très spartiate, mais elle me permet d'éviter d'aller systématiquement dans le code dès que je veux ajouter un lien, écrire un billet ou encore mettre à jour mon CV.

En voici une capture :

Interface d'admin spartiate

Vous voyez que je n'ai vraiment pas exagéré quand j'ai dit qu'elle était spartiate. Je n'ai d'ailleurs jamais pris le temps de l'embellir.

Quand je me suis amusé à la refaire avec jQuery Mobile afin de la rendre un peu plus jolie, je me suis dit que l'ancienne allait être plus ou moins mise au placard : pas prévue pour autre chose que les navigateurs desktop, franchement pas terrible point de vue design, un peu limite question ergonomie, etc.

Curieusement, je me suis bien trompé.

En fait, cette vieille interface d'admin, même si elle est loin d'être exempte de défauts, a pour elle d'être hyper efficace pour mon besoin. En fait, il y a tellement peu de fioritures que l'essentiel est là : super légère et donc rapide à charger, elle ne buggue jamais (là où la nouvelle me fait quelques bizarreries avec le cache manifest sur mobile), les jolies transitions de jQuery Mobile sont certes sympas, mais dispensables, etc.

D'ailleurs, ce n'est pas la première fois qu'on me fait la remarque : mes premières interfaces d'administration étaient elles aussi plutôt spartiates, toutefois, parfois mes clients ont dû :

  • mettre à jour en urgence leur site,
  • se retrouver en situation de handicap forcé (les piles de la souris qui lâchent par exemple),
  • l'utiliser avec une connectivité réseau très mauvaise.

En fait, ceux qui ont eu ce(s) problème(s), parfois plusieurs en même temps, m'ont fait part de leur satisfaction : le système étant basique mais extrêmement simple, il fonctionne bien dans ces cas de figure. D'ailleurs, même si ces systèmes ont été conçus à une époque où le Web Mobile était embryonnaire et les tablettes n'existaient tout bonnement pas, ils encaissent plutôt bien ces périphériques, grâce à leur extrême simplicité (HTML, CSS, et du JavaScript non obstructif du plus basique qui soit).

Qu'en retenir ?

Loin de moi l'idée de tenir un discours du genre « c'était mieux aaaavaaaant », toutefois, ces expériences m'ont fait cogiter. Je retrouve l'idée que j'avais abordée quand je parlais du syndrome du site OGM. Vous pouvez mettre tous les embellissements, tous les raffinements, tous les petits gadgets possibles et imaginables, si votre système ne répond pas au cœur de la demande correctement et efficacement ou si le cœur en lui-même n'est pas stable, ça ne fonctionnera pas.

Note de lecture : Accessibilité Web, d'Armony Altinier (le 27/04/2013)

J'ai fait l'acquisition d'« Accessibilité web, normes et bonnes pratiques pour des sites plus accessibles » lors du dernier Paris-Web, où le précieux sésame était en vente en avance (sur la sortie). Curiosité de l'agenda, j'ai rencontré Armony Altinier il y a quelques jours à la Conférence Romande sur l'Accessibilité du Web à Lausanne, et je finis son livre quasiment au même moment ! (tu vois Armony, je n'avais pas menti quand je te disais que je l'avais presque fini)

Accessibilité Web, d'Armony Altinier

En guise de mise en bouche, le livre explique très simplement ce qu'est l'accessibilité du Web, le cadre juridique, pour qui c'est destiné, les technologies d'assistance, etc.

Ensuite, le livre parcourt le référentiel Accessiweb où sont disposés de nombreux exemples de ce qu'il faut et ne faut pas faire, toutes les thématiques sont abordées (formulaires, liens, images, multimédia, etc.). Une partie en fin de livre est consacrée à ARIA et HTML5.

Une dernière partie parle de l'accessibilité au-delà des normes, notamment des méthodes pour commencer une démarche vers l'accessibilité, la conduite du changement, etc.

Que dire de ce livre en un mot ? Enfin.

Déjà, enfin (enfin !) un livre sur l'accessibilité. Enfin quelqu'un a eu le courage de se lancer dans un livre et d'aller au bout. C'est complet et cela permet d'avoir des bases solides et claires sur le sujet de l'accessibilité des sites Web. La grande force de ce livre outre sa richesse, est d'expliquer les choses avec bon nombres d'exemples, et c'est très agréable, ça sonne concret. Assurément, c'est une réussite qui doit faire partie de votre bibliothèque de toute urgence.

Pour conclure, deux choses : déjà bravo Armony. Faire un recueil aussi complet et accessible (!) sur le sujet n'a pas dû être une mince affaire. En tout cas, j'ai pris un certain temps pour le lire, car je ne voulais survoler aucune partie, ce qui n'aurait pas rendu justice au travail de l'auteure.

Et en second, je me permets de reprendre les dernières phrases de ce livre, que je trouve absolument superbes.

Si vous considériez votre travail comme un simple empilement de lignes de codes, vous ne liriez sans doute pas ce livre. En tant que développeur, concepteur de site, graphiste Web, rédacteur, commercial, décideur : vous avez le pouvoir de donner plus de liberté à des millions d'internautes.

La seule question à vous poser est la suivante : Êtes-vous prêt(e) à changer le Web ?

Un grand pouvoir implique de grandes responsabilités.

L'accessibilité, on s'en fout de plus en plus ? Moi, non. (le 26/04/2013)

Alors, suite à une remarque lancée par QuentinC sur Alsacréations : L'accessibilité, on s'en fout ?, plusieurs réactions.

Déjà posons le contexte de mes réactions, je n'avais pas compris sur Twitter que l'intéressé était directement concerné par le sujet, étant selon ses paroles quasiment non-voyant. Donc, effectivement, ma parole était maladroite et a pu être mal comprise, et ça je m'en excuse. Sans aucune condescendance car je la maintiens, toutefois je vais l'expliquer ici bas.

Sophie Drouvoy a commenté cette remarque sur son blog, à lire de suite.

Stéphane Deschamps y est allé de son commentaire, fort intéressant également : Défaitisme et accessibilité.

Voici pêle-mêle les réflexions que cela me pose.

On s'en fout de l'accessibilité

« On » ? C'est qui « on » ? Moi, non.

Non, en dehors de tout affect, je pense qu'il ne faut pas s'en foutre. Objectivement. Ne serait-ce que pour des raisons de bon sens, se couper sciemment d'un public est un non-sens en matière de Web, qui est et doit être avant tout une solution universelle, même et surtout si elle est imparfaite. Comme je l'écrivais dans mon article sur les contrastes de texte sur OpenWeb :

Les problèmes de vue s’accentuant avec l’âge et le secret de l’éternelle jeunesse n’ayant pas encore été découvert, il est aisé de comprendre qu’un jour ou l’autre, inévitablement, la question de la lisibilité des textes va se poser à une grande majorité de personnes.

Évidemment, la phrase ne concerne que les contrastes, mais elle peut bien se généraliser à l'accessibilité. Sans être sourd, en roulant, je remarque que j'écoute la radio plus fort qu'il y a 10 ans, et je n'ai pas une voiture plus bruyante pour le justifier. D'ailleurs, j'ai des lunettes depuis quelque temps.

Mythes autour de l'accessibilité

Comme le dit très justement Stéphane, il y a un mythe autour de l'accessibilité : certes cela coûte moins cher de l'inclure dès le début, mais cela n'est pas gratuit pour autant.

Cela prend du temps en formation, en code, etc. rien n'est gratuit en ce bas monde.

Ajoutons à cela que le Web évolue très vite, et l'accessibilité suit ce rythme effréné, ce qui m'a été confirmé à la Conférence Romande sur l'Accessibilité du Web. Les nouveautés de HTML5, ARIA, le support de tout cela dans les aides techiques comme Jaws, etc. tout cela évolue à une vitesse très impressionnante. De l'aveu même d'un des plus grands experts accessibilité (Jean-Pierre Villain pour ne pas le nommer), on est sur une situation pas stable.

À mon sens, l'accessibilité ne gagnera qu'en rentrant petit à petit dans les mœurs, de la base vers les sommets. C'est mon approche en tout cas. Je constate qu'objectivement, ça rentre petit à petit, même si effectivement c'est loin d'être la panacée.

Une perte d'énergie

J'ai dit que le défaitisme est une perte d'énergie, énergie qui pourrait être mieux utilisée. Et je maintiens. Car selon moi, le temps qu'on passe à expliquer pourquoi on ne peut pas quelque chose peut être consacré à chercher comment le faire, ou même à le faire.

Comprenez ma façon de penser dans sa globalité : elle peut être extrêmement brutale, car cela implique que potentiellement rien n'est impossible, donc que cela ME force à me bouger le train. Et je peux vous assurer que c'est pas génial pour ma zone de confort ni pour ma fatigue, et parfois pour la zone de confort des gens autour de moi (collègues entre autres). Typiquement, quand je vois qu'un collègue ne veut pas faire un effort minime pour l'accessibilité, alors que je lui ai expliqué comment faire, ça me fout en rage.

Ajoutez à cette façon de penser que je préfère voir le verre à moitié plein.

Par contre, qu'on ait un passage à vide, un ras-le-bol, ça je peux le comprendre, qu'on ait un handicap ou non d'ailleurs, c'est humain, et je ne fais pas du tout exception. En soi, j'attaque le défaitisme, pas les personnes (je ne suis pas un monstre non plus :) ).

Une formidable leçon d'espoir

Comme le dit encore très justement Stéphane, « vous allez me dire que je fais dans l'affect ». En ce qui me concerne, je ne vais pas le nier, il y a une part d'affect dans la volonté d'améliorer l'accessibilité de mes sites. Effectivement, j'ai un problème quand je me dis qu'une personne que je connais, que j'ai rencontrée, que j'apprécie est bloquée par ma faute sur un site alors que j'ai une solution.

Tout comme Stéphane, quand je fais de l'accessibilité, je pense surtout à quelqu'un, je l'avais déjà écrit il y a presque un an dans un commentaire sur l'Accessiblog.

C'est pour cela que j'invite les gens ayant des handicaps à en parler, à nous montrer, à faire du mobbying, à nous expliquer, beaucoup plus (et sur ce sujet, ça m'a donné des idées). Les événements comme la Conférence Romande sur l'Accessibilité du Web sont formateurs, car enfin je peux comprendre et m'améliorer. Et surtout je peux voir. On peut bien me dire 100 fois qu'il faut mettre un label pour lier un énoncé à un champ de formulaire, mais quand on me montre le réel bénéfice, je comprends.

Sans aucun angélisme (vraiment aucun), je trouve par exemple cela extraordinaire qu'un aveugle puisse surfer sur un site internet. C'est fantastique. C'est même pour moi une leçon d'espoir de voir cela rendu possible. Quand je m'aperçois qu'un commentaire sur mon site a été posté par une personne aveugle, je me dis que c'est génial, grâce à cela, je vais pouvoir discuter avec vraiment n'importe qui.

En soi, ça c'est pour l'affect. Pour mon côté pragmatique et pas du tout affect, je trouve cela sain dans le sens où cela supprime la discrimination, tant positive que négative. À mon avis, quand on se débarrasse de la discrimination, on vire aussi quelques cancrelats comme le misérabilisme, le politiquement correct, et ce n'est pas un mal de toucher ainsi du doigt le mot égalité.

C'est aussi pour cela que j'adore blaguer avec une certaine Sophie en lui demandant si elle fait la sourde oreille. Respectueusement, je chambre n'importe qui, et je vois pas pour une personne avec un handicap devrait y échapper. C'est une personne avant tout, et pas de discrimination, hop, blague pourrie pour tout le monde !

Le mariage pour tous (le 21/04/2013)

Félicitations aux anti-mariage pour tous, ils ont réussi à me faire écrire un billet sur le sujet.

Pour être très honnête, au début, ce sujet m'en touchait une sans bouger l'autre, je n'en avais rien à cirer. Non pas que je sois opposé à cette loi, mais j'estime que les affaires de sexualité, qu'on soit hétéro, homo, bi, solo, etc. en fait je m'en fous : ça ne regarde que ceux qui vivent leur sexualité. Perso, je m'occupe de la mienne, et je laisse aux autres le plaisir de s'occuper de la leur.

Je voyais cette loi passer après un ou deux débats enflammés, en soi, un peu de bruit pour la forme de quelques « réac's », et merci au revoir.

Mais comme dit la publicité, ça, c'était avant.

La pauvreté des arguments contre le mariage pour tous me dépasse, à croire qu'il faut avoir uniquement deux parents de sexe différent pour pouvoir être aimé, bien élevé, etc.
Je crois que si l'amour qu'on peut porter à un enfant devait se limiter de quelque manière que ce soit, il est grand temps de se poser des questions. Je n'imagine même pas une seconde que ma sexualité puisse limiter l'amour que je peux porter à un gosse.

J'ai lu de nombreux témoignages, en simple curieux. Je reconnais que certaines histoires dépassent mon entendement.

Et j'ai été frappé de voir comme ce débat a dérivé, et surtout l'animosité des antis. Encore, si la loi disait que les couples homos ont subitement plus de droits que les couples hétéros, je pourrais comprendre, mais franchement, je me pose la question : est-ce qu'une simple loi qui autorise le mariage pour tous méritait un tel bordel ?

Je regarde les photos des manifestations d'aujourd'hui, et je suis choqué que des symboles comme le drapeau français soient affichés à côté de slogans violents à l'encontre de citoyens français. Merde, un pays, ça doit être au-dessus de telles considérations, uni dans la diversité serais-je tenté d'ajouter.

Chapeau bas, les slogans anti-mariage pour tous me sont tellement détestables qu'ils me font avoir une encore plus grande sympathie pour la cause des pros. Qu'on se mêle à ce point de quelque chose qui ne regarde que les intéressés me débecte.

Je ne vois même pas en quoi cela pose problème. Qu'est-ce qu'on se fout de savoir qu'une femme aime une autre femme ou qu'un homme aime un autre homme, et que ces derniers soient reconnus comme unis ? À choisir, autant aimer !

Je ne pense pas que le monde puisse souffrir d'un peu plus d'amour, par contre, d'autant de haine… non, cela n'est vraiment pas nécessaire.

Intégrateur de l'extrême : les tablettes bas de gamme (le 12/04/2013)

Curiosité des vacances, j'ai eu l'occasion de tester plusieurs sites (dont certains des miens) sur une tablette plutôt bas de gamme. Évidemment, je ne résiste pas à l'envie de partager cette expérience.

Une mise au point : ce billet n'est pas une charge contre ce genre d'équipement, je m'intéresse plutôt au rendu de sites dessus. Vous excuserez d'avance la piètre qualité des photos, j'ai fait du mieux que j'ai pu.

Préambule

Quand on pense au test sur la vieille croûte, on pense généralement à un vieil ordinateur dépassé ou alors un vieux portable pas mis à jour. Quand on pense tablettes, on pense généralement à l'iPad ou à une autre tablette de bonne facture. Toutefois, le test sur cette tablette relativement récente montre que cette vision du test dans de mauvaises conditions… ne se limite absolument pas aux vieux tromblons de l'informatique.

Présentation très rapide de la bête

Voici la bête, c'est une tablette Go-Nomad :

Écran d'accueil de la tablette Go-NomadLa tablette Go-Nomad et son clavier

La résolution est de 800 par 480 pixels en paysage, le tout est propulsé par un système Android 4.0. L'écran de 7 pouces est de très mauvaise facture, les habitués de l'iPad et de sa réactivité en seront pour leur grade, c'est une vraie horreur, il faut appuyer lourdement pour activer un lien. Le rendu des couleurs est catastrophique, je reviendrai sur ce point quand on consulte des sites.

L'impression générale est : cheap. Tout est tiré vers le bas pour un prix très agressif.

Le rendu de certains sites

C'est là que cela devient rigolo : j'ai pu voir des curiosités de rendu non-sensiques. Mon propre site personnel construit en mobile-first s'affiche globalement bien là où des sites plus simples ont des problèmes de rendu que j'ai pu déjà pu voir sur de vieux navigateurs (genre sur un vieux Safari pour n'en citer qu'un). Ceci dit, je n'ai pas utilisé de propriété extraordinairement moderne, si j'oublie les media-queries bien sûr.

Mon site personnel sur la tablette Go-NomadCSM sur la tablette Go-Nomad

Mettons au point un détail de vocabulaire : quand je parle de bien s'afficher, c'est que le site est consultable sans souci, on arrive à accéder au contenu. L'affichage n'en est pas optimal ou même beau pour autant, loin de là ! Les dégradés CSS3 sont rendus, mais la faible palette crée des dégradés pas très doux à l'oeil, c'est le moins qu'on puisse dire. Et encore, les photos limitent la mocheté du rendu (!).

Un rendu de dégradé CSS3, catastrophique sur la tablette Go-Nomad

Le rendu des webfonts est très très lent. Souvent, la page est chargée mais le texte n'apparait pas avant de looooongues secondes. J'ajouterai bien que le bonheur des webfonts qui embellissent beaucoup les sites est mis à mal, le rendu de certaines étant parfois très laid, sans que je puisse y trouver une logique. De bons contrastes et des tailles de polices pas trop petites limitent la casse cependant.

Toujours au rayon lenteur, si vous faites pivoter la tablette, attendez au moins une bonne dizaine de secondes pour faire la magie responsive s'opérer. Et encore, j'ai essayé sur des sites plutôt légers.

Le défilement est insupportablement – abomifreusement – pénible à effectuer sur ce type d'écran, j'ai réellement adoré les sites avec des liens d'évitement les plus simples possibles. Ne parlons pas de l'exécution de JavaScript, très lente aussi sur les sites « chargés ».

Les liens d'évitement, le bonheur avec la tablette Go-Nomad

Quelques sites un peu avancés en matière de positionnement CSS sont cassés, mais rien de très surprenant. Quelques curiosités comiques viennent égayer le tout : bordures non rendues (‽), arrondis bouffés arbitrairement (‽‽), détails rendus invisibles.

Conclusion

Si votre objectif est d'être affiché parfaitement partout, vous allez vite déchanter, les détails des designs ne seront pas bien rendus, et ce genre de périphérique ne s'y prête globalement pas. Par contre, l'objectif d'être consultable à peu près partout reste tout à fait atteignable. On parlera de dégradation gracieuse. :)

Le travail sur les performances Web va montrer ici tout son intérêt, le rendu étant lent, il faut vraiment diminuer le poids des pages et limiter le nombre de requêtes. Une bonne mise en cache fait beaucoup de bien. L'idée n'est pas d'offrir un site parfait (ce qui est impossible dans ce cas de figure), mais bien de limiter la casse. Curieusement, les images en Data-URI remplacent avantageusement les dégradés CSS3.

Idem pour l'accessibilité, les efforts dans ce domaine vont montrer leurs fruits dans ce genre de situation. Un site pleinement responsive devrait s'en tirer correctement, s'il n'est pas trop compliqué.

Attention à ne pas aller trop loin dans l'utilisation d'effets : par exemple, les dégradés étant très mal rendus, la lisibilité peut grandement en pâtir. Pareil pour les liens rikikis, si cela peut poser des problèmes sur iPad si on a de gros doigts, imaginez sur ce genre de périphérique ! Le seul moyen que j'ai trouvé pour ne pas devenir fou était une sorte de stylet qui permettait de naviguer un peu mieux.

Le concept de jeu d'équilibriste que connait tout bon intégrateur trouve ici tout son sens. La bonne leçon à retenir : n'oubliez jamais que vos beaux designs peuvent être consultés dans des conditions bien inconfortables.

En tout cas, comme je l'indiquais dans un tweet, tester un site sur ce genre de périphérique, c'est une grande leçon d'humilité pour les intégrateurs et autres web designers.

Bonus

Voici quelques sites connus consultés avec cette tablette. Ils s'en sortent très bien. Curieusement, les photos échouent à rendre le pouvoir enlaidissant de l'affichage de cette tablette, il faut le voir pour le croire !

Alsacréations sur une tablette Go-NomadLe Train de 13H37 sur une tablette Go-NomadOpenWeb sur une tablette Go-Nomad

C'est offert par la maison. ;)

Ces articles ont été écrits par Nicolas Hoffmann.

Lister toutes les autres news
(long à charger si connexion lente)
Ce site est la propriété de Nicolas Hoffmann. Tous droits réservés.