Gargouilles | Oxford | Panoramiques | Instagram
[alpine-phototile-for-instagram id=780 user= »zemoko » src= »user_tag » tag= »smashingconf » imgl= »instagram » style= »gallery » row= »7″ grwidth= »800″ grheight= »600″ size= »Th » num= »26″ highlight= »1″ align= »center » max= »100″]
Le mystery speaker de cette année, c’était Chris Heilmann et sa conférence s’intitulait Welcome to planet Fintlewoodlewis
Une conférence pleine de bon sens.
The web as we know is in danger #smashingconf pic.twitter.com/7wGZgQZRvo
— Arnaud MΛL⭕П (@zemoko) March 18, 2015
Petite sélection de citations :
Le message est, peu ou prou, le même que l’an dernier mais, comme Zoé m’avait convaincu l’an dernier, c’était à la fois rassurant et amusant d’assister à cette conférence. Le pourcentage de navigateurs supportants Flexbox a encore augmenté mais le principe reste le même : Flexbox as a progressive enhancement. Si vous n’avez pas encore passé le cap Flexbox, foncez !
Je dois avouer que c’était une conférence un poil trop technique pour moi et que j’en ai profité pour aller acheté des cookies au marché couvert !
Obsédé par la performance ? Cette conférence était faire pour vous. Une bonne conférence pour mieux comprendre, et pour étende, la notion de performance web. Très concrète, pleine d’exemples… chouette !
Pour être honnête, je ne sais trop que penser de cette conférence… C’est un peu comme quand Google nous dit Don’t be evil, on a envie de le croire… mais on y croit pas. Les exemples montrés par Polle de Maggt sont sans doute de très beaux projets marketing de KLM mais ça me laisse un sentiment de malaise… C’est sympa cette idée de cadeau surprise qui vous arrive de nul part à l’aéroport et ces jolies hôtesses qui viennent vous l’ouvrir avec ce grand sourire… mais, quand on y réfléchit, c’est autant une traque des clients qu’une recherche de cadeau parfait. Bof, bof. Une conférence passionnante sur tous les types de tests utilisateurs qu’on peut faire pour faire toujours mieux, plus adapté à nos utilisateurs. L’idée est de rentrer dans un cercle vertueux pour tester, prototyper, interviewer, évaluer… et recommencer. Ce qui se résume magnifiquement par Fail early. Fail often.. Une conférence qui regroupe les 2 thèmes privilégiés de l’année : Progresive enhancement et Services Workers. Nous avons fait, au pas de course parce qu’il était déjà un poil tard et que la lumière déclinait vite, une petit tour dans Oxford en suivant Cat Clark, puis nous sommes tous allé dans un pub pas bien droit pour boire des bières et manger des burgers. Je repars d’Oxford reboosté, avec l’envie d’essayer plein de trucs et des idées plein la tête… Je retrouve aussi foi dans le web : revenir aux basiques, à du sémantique, du responsive par nature, des échanges enrichissants, des discussions stimulantes, ne pas re-inventer la roue, revenir à du simple, penser à tous, être accessible… (mais un peu paumé aussi quant les mozillians historiques sont recrutés par Microsoft et qu’on ne sais plus que penser de Google…) Peut-être encore plus que l’an dernier, c’était un événement vraiment cosmopolite et ça fait un bien fou. J’ai discuté avec des anglais, pris des photos avec une néerlandaise, refais le monde avec des californiens et un tchèque, disserté bières avec un belge et un luxembourgeois, bu des cafés avec une norvégienne, mangé des hamburgers avec une allemande, un portugais vivant aux Pays-Bas, un grec et une espagnoles vivants en allemagne, fait un atelier avec un lithuanien… C’était vraiment incroyable.
J’ai beaucoup plus apprécié la partie concernant la gestion de l’équipe User research for designers & ingeneers par Rachel Ilan Simpson
Mention spéciale à cette fabuleuse vidéo youtube The Scrollwheel dans laquelle touter personne ayant, au moins une fois, participé ou assisté à des tests utilisateurs se reconnaitra.
Ah et, euh, pourquoi diable a t’on tous téléchargé Pop ? C’était juste pour faire une (mauvaise) blague aux gens qui essaient tant bien que mal de maintenir le Wi-Fi ?
The UX of offline-first par Jake Archibald
Elle n’est pas nouvelle mais j’aime toujours autant cette image d’un escalator pour expliquer le concept de Progresive enhancement. Quant aux Services Workers, je dois avouer que je ne sais pas encore bien quoi en faire mais que les conférences de cette année m’ont sérieusement chatouillé et qju’il va vraiment falloir que je creuse le sujet. Surtout que j’adore cette idée/citation : Is ServiceWorker ready? It will be — if you start using it.
La Photo walk
(un billet suivra très vite avec mes photos !)Bilan
Je reviendrais ! Rendez-vous l’année prochaine ?
Et voilà, nous sommes déjà au matin de la seconde journée de conférences de la SmashingConf Oxford 2015 ! Avant de la commencer, petit retour sur la journée d’hier :
Oxford me plait toujours autant. Moins de chance cette année avec le temps mais ça reste toujours aussi magique de s’y promener. Juste petit comme il faut pour pouvoir tout faire à pieds ou à vélo, juste grand comme il faut pour être super animé. Une énergie incroyable de dégage de ce lieu, c’est vraiment incroyable.
1st day of #smashingconf finished! Was a great day pic.twitter.com/s77nwkOsZz
— Arnaud MΛL⭕П (@zemoko) March 17, 2015
Les échanges sont toujours aussi enrichissants ici avec des gens qui viennent de tous les horizons : j’ai croisé quelques autres français, un luxembourgeois, un belge (mais je soupçonne qu’il y en a d’autres), une norvégienne, une petite tribu de californiens, une néerlandaise… et pas mal d’anglais ! Une bonne partie sont développeurs mais ça reste vivable 😉
La journée a commencée, comme il se doit, avec un show de lasers de Seb Lee-Delisle, et des ballons
Une bien chouette conférence pour commencer, juste ce qu’il faut d’abstraction et de généralités, quelques lectures conseillés, quelques règles de vie et/ou de travail à tester. Une conférence vraiment inspirante.
Une conférence rafraichissante avec des chats dedans. Le design et l’empathie, #toussa.
Une chouette conférence sur la refonte du site de Chelsea & Kelsington. J’en ai tiré, en vrac, la confirmation que l’HTML c’est mieux que des PDFs mais que des PDFs balisés c’est mieux que rien, qu’on n’est pas condamné à avoir un seul gabarit de site, que plusieurs moteurs de recherches, et plusieurs champs de recherches, c’est une idée à creuser, quelques considérations aussi sur la navigation et le fil d’ariane. Tout cela va bien me servir, je le sens.
Une bon état des lieux… qui me laisse toujours un peu avec le même sentiment : tout cela est tellement compliqué ! Pour bien faire, il faut encore coder tellement, et produire tellement de versions que j’ai du mal à voir comment on peut intégrer cela dans un contexte un tant soit peu industriel. Bonne conférence, hein, je ne dis pas… mais il faut que je songe à ce que je vais en faire… On a des sites à faire vivre et des projets de refonte dans les tuyaux 😉
Je ne savais trop quoi penser cette conférence… mais finalement elle était assez intéressant et m’a donné envie de découvrir le magazine de Peter (ce qui était sans doute le but et faisait de cette conférence une sorte de publimercial assez étonnante ici).
Cette conférence aurait pu être très intéressant, et elle faisait parti de celles que j’attendais avec impatience mais c’était en fait une suite de petits exemples, pas toujours très explicites, et personne ne semble avoir vraiment compris où elle voulait en venir… Dommage !
Il FAUT que je trouve une idée d’appli à développer avec nw.js que nous a présenté Tom, ça a l’air vraiment trop cool 🙂 <-- Quand on sort d'une conférence avec ça en tête, c'est que c'est gagné, non ?
Une conf’ incroyablement inspirante et un conférencier tout aussi incroyable. ça a commencé par un historique qui donnait un petit peu le vertige sur les années Netscape 4/IE6/Netscape 6 (en tout cas à un dinosaure du web, ça donnait le vertige) pour finir à un état des lieu assez objective sur la situation actuelle des développeurs de navigateurs, et sur cette conclusion logique « The only people who could make a browser monopoly are us, developers. ». L’esprit de cette conférence était clairement #ShareTheLove, ça m’a fait penser à Paris Web !
Ce sont des réactions à chaud, mais je prendrais le temps en revenant de faire un retour plus poussé… et sans doute un petit Storify de mes tweets et de ceux que j’ai retweetés.
Sinon, merci vraiment à Smashing Magazine qui m’a offert 2 de leurs livres (je ne sais pas comment ils organisent leur tirage au sort ;))
Et, comme l’année dernière, mention spéciale à Elisabeth Irgens et à l’esprit de synthèse dont elle fait preuve pour produire, pour chaque conférence, des sketshbooks absolument incroyables.
Encore pas mal d’échanges enrichissants, en buvant pas mal de bière… C’était vraiment chouette.
#smashingconf party rocks! pic.twitter.com/E2aIFmaBht
— Arnaud MΛL⭕П (@zemoko) March 17, 2015
Bon allez, il faut que je me dépêche de me préparer, c’est pas tout ça mais j’ai une seconde journée de confs qui commencent dans une heure moi !
Paris Web a été, est et restera l’événement annuel à ne pas manquer.
Certes, sur certains sujets on peut parfois avoir l’impression de tourner un peu en ronds, certes l’équilibre entre technique, méthodo, UI/UX, « life hacking » et, globalement, tout ce que je classerais « ouverture de chakras » n’est pas aisé et peut ne pas convenir à tout le monde tout les ans, certes… mais la magie continue d’opérer.
Je dirais même que c’est encore un peu plus magique quand on choisit certaines conférences « par défaut » et que ces conférences, dont le sujet ou le pitch ne vous disaient rien, vous emportent et vous transportent.
Cette année, j’ai peut-être appris moins de choses que les années précédentes mais j’en repars reboosté, l’esprit bien aéré et mieux dans mon job. C’est génial, non ?
Quelques réflexions, en vrac :
Serment du Beffroi de Montrouge
Je fais le serment de remplir mes fonctions avec conscience, indépendance, et humanité.
Je m’engage à suivre les standards du web, de la qualité et de l’accessibilité pour que le web reste universel, neutre, libre et ouvert.
Je m’engage à respecter et protéger le secret dû aux données personnelles et à la vie privée dont j’aurai connaissance dans l’exécution de mon travail.
Je suis un travailleur du web, j’en suis fier,
et j’assumerai mon rôle avec dignité.
Notes aux futurs orateurs : Star Wars et Retour vers le futur sont des valeurs sures pour vos slides, d’autant plus si vous les utilisez en lego…
Ah, et puis, toutes les présentations sont déjà en ligne ! C’est dingue, non ?
Quelques autres CR, en vrac :
On se retrouve l’année prochaine ? Sans fautes, hein ?
J’essaierais de mieux m’organiser et d’échanger avec tous ceux que j’ai loupé cette année…
2ème journée un chouille plus courte que la première pour cause d’agenda mal géré (place prises voici quelques mois déjà pour aller voir l’exoconférence au Rond-Point à 18h30) et de mauvaise organisation (j’étais persuadé que c’était des e-billets et en fait, non, donc passage obligé par la FNAC…).
Bref…
Quelques très bonnes conférences bons orateurs encore pour 2ème journée… mais mes choix de conférences ont sans doute été moins heureux que pour le jeudi… C’est la loi de Paris Web, vous me direz 😉
Comme pour le jeudi, petit Storify rapide :
Petit résumé, à chaud chaud et rapidement :
Vivement demain !
En attendant, voici déjà un Storify rapide de cette 1ère journée à Paris Web.
Un petit billet technique sur une problématique qui a tendance à m’agacer, quand elle est mal pensée (bonjour le PMU), les champs « date de naissance » des formulaires.
En gros, il existe 4 manières pour demander à quelqu’un sa date de naissance :
Je me propose d’essayer d’évaluer ces 4 manières de faire, dans un contexte à la fois desktop et mobile, sur des sites ou dans des apps.
Si vous êtes pressé, vous pouvez directement consulter ma conclusion !
C’est la méthode la plus simple et la plus basique :
<label for="DateDeNaissance">Date de naissance</label>
<input type="text" id="DateDeNaissance">Pour être le plus complet, on peut ajouter une aide éventuelle pour expliciter le format de date attendu :
<label for="DateDeNaissance">Date de naissance</label>
<input type="text" id="DateDeNaissance" aria-describedby="DateDeNaissance_Aide">
<span class="aide" id="DateDeNaissance_Aide">JJ/MM/AAAA</span>On peut aussi profiter des nouvelles propriétés HTML5 pour contrôler le format :
<label for="DateDeNaissance">Date de naissance</label>
<input type="text" id="DateDeNaissance" aria-describedby="DateDeNaissance_Aide" pattern="\d{1,2}/\d{1,2}/\d{4}">
<span id="DateDeNaissance_Aide">JJ/MM/AAAA</span>Résultat :
Exemple d’implémentation :
<label for="DateDeNaissance">Date de naissance</label>
<input type="date" name="DateDeNaissance">Rien de particulier à rajouter pour être accessible, ça marche « Out of the box ». C’est d’ailleurs l’exemple choisi par moult blogs pour illustrer le nouveau type de champs date (notamment Alsacreation).
Résultat :
Exemple d’implémentation :
Pas forcément la plus simple à manipuler pour être accessible ET ergonomique (3 champs = 3 labels) mais on peut s’en sortir :
<span id="DateDeNaissance">Date de naissance</span>
<label for="JourDeNaissance" id="JourDeNaissance_label" class="text-hide">Jour</label>
<input type="number" id="JourDeNaissance" aria-labeledby="DateDeNaissance JourDeNaissance_label" placeholder="JJ">
<label for="MoisDeNaissance" id="MoisDeNaissance_label" class="text-hide">Mois</label>
<input type="number" id="MoisDeNaissance" aria-labeledby="DateDeNaissance MoisDeNaissance_label" placeholder="MM">
<label for="AnneeDeNaissance" id="AnneeDeNaissance_label" class="text-hide">Année</label>
<input type="number" id="AnneeDeNaissance" aria-labeledby="DateDeNaissance AnneeDeNaissance_label" placeholder="AAAA">Résultat :
Exemples d’implémentation :
La mise en œuvre est assez similaire à celle de la solution précédente :
<span id="DateDeNaissance">Date de naissance</span>
<div class="Selects">
<label class="text-hide" id="JourDeNaissance_label" for="JourDeNaissance">Jour</label>
<select id="JourDeNaissance"><option>1</option>...<option>31</option></select>
<label class="text-hide" id="MoisDeNaissance_label" for="MoisDeNaissance">Mois</label>
<select id="MoisDeNaissance"><option>1</option>...<option>12</option></select>
<label class="text-hide" id="AnneeDeNaissance_label" for="AnneeDeNaissance">Année</label>
<select id="AnneeDeNaissance"><option>1940</option>...<option>1994</option></select>
</div>Résultat :
Exemples d’implémentation :
Si quelqu’un du PMU passe par ici… sachez que je vous maudit tous les dimanches de vos choix ergonomiques hasardeux !
Pour finir, un petit lien vers un site du gouvernement britannique qui s’est posé la même question (et qui réponds sensiblement de la même manière) : Asking for a date of birth
Un petit résumé de la Smashing Conf qui a eu lieu la semaine dernière à Oxford et à laquelle j’ai eu le bonheur d’assister.
Ce que j’en retiens : il serait peut être temps
Le plus dur reste encore et toujours :
Place au Storify :