Une veille quotidienne et subjective sur le web, le livre numérique, l'accessibilité, les réseaux, les outils numériques, le design et la typographie.
Students said it was easier to understand feedback when it was in context.
mozzadrella, How to grade programming assignments on GitHub
Utiliser Git et une plateforme comme GitHub pour échanger entre étudiants et enseignants ? L’idée est séduisante, et pas uniquement pour du code. Par contre je comprends mal l’intérêt de GitHub Classroom…
Via Boris.
This is the most effective way to be productive, really: Just do it.
Sara Soueidan, Migrating from Jekyll+Github Pages to Hugo+Netlify
Sara Soueidan détaille sa migration depuis Jekyll vers Hugo, un changement de générateur de site statique expliqué en détail !
Productivity won’t make you a better person, a better partner or a better friend. Instead it will drive you crazy by lowering your self worth in times of hardship. So be careful with your to-do list. Make sure each task on it isn’t just a distraction from dealing with your reality.
Abby Covert, Fuck Productivity
Privilégier le sens plutôt que tenter de rentabiliser le temps.
- Use feature branches, no direct commits on master.
- Test all commits, not only ones on master.
- Run all the tests on all commits (if your tests run longer than 5 minutes have them run in parallel).
- Perform code reviews before merges into master, not afterwards.
- Deployments are automatic, based on branches or tags.
- Tags are set by the user, not by CI.
- Releases are based on tags.
- Pushed commits are never rebased.
- Everyone starts from master, and targets master.
- Fix bugs in master first and release branches second.
- Commit messages reflect intent.
Un workflow Git parmi d’autres, mais celui-ci a le mérite d’être clair et cohérent.
J’aime assez l’idée du développeur en scribe à l’envers : une élite qui déguise son pouvoir, non sous le sérieux de sa mission, mais sous sa fausse légèreté. Et voilà que tout à coup, la coolitude de la Silicon Valley prend un tout autre sens. Rendre son sérieux à cette activité est aussi un moyen de lutter contre les abus du pouvoir qu’elle s’octroie. Voilà qui est aussi politique.
Xavier de La Porte, Coder, ce n’est ni facile, ni marrant
Les chroniques de Xavier de La Porte sont toujours d’aussi bonne qualité, celle-ci est particulièrement stimulante !
The Magic Book Project is an open source project funded by New York University’s Interactive Telecommunications Program. It aims to be the best free tool for creating print and digital books from a single source.
The Magic Book Project
The Magic Book Project est une solution pour produire différents formats de livre à partir d’une même source en texte brut.
Do ebooks need to look exactly the same in every Reading System?
Jiminy Panoz, Do ebooks need to look exactly the same in every Reading System?
Oui c’est une blague qui concerne celles et ceux qui travaillent dans le livre numérique : un livre numérique, ou ebook, n’a pas besoin d’avoir exactement le même aspect sur tous les systèmes de lecture numérique.
La vingt-troisième édition de la revue Graphisme en France est parue, publiée par le Centre national des arts plastiques (Cnap). Elle aborde pour la première fois la question des logos et des identités visuelles, objet central dans la pratique du design graphique.
CNAP, Graphisme en France n°23
Le dernier numéro de Graphisme en France vient d’être publié, les thèmes de ce numéro de 2017 sont les logos et les identités visuelles. Une version PDF est disponible en ligne, et la version imprimée est distribuée un peu partout ou disponible sur demande. Il manque une version web, ce serait vraiment un plus !
Sauf que là où Jason se plante, c’est qu’en fait, la valeur de son travail lorsqu’il était salarié, ce n’était pas son salaire net…
Princesse RH, Parce que vous le valez bien
Un rappel très complet de combien vaut un indépendant, et donc combien il doit facturer pour vivre. Indispensable pour toute personne voulant lancer son activité.
Passage en revue
Loup Cellard, Design graphique & pratiques numériques
Loup Cellard présente cinq initiatives, revue ou numéro de revue, qui abordent les questions de design graphique mêlées aux enjeux numériques. Forcément Back Office en fait partie, mais il y a également d’autres belles découvertes.
No matter where you go, you are surrounded by systems. We use the word ‘system’ to describe a group of interacting parts as a common whole, and these can be simple, like a watch, or incredibly complex, like the web of computer networks we call the internet. In this book, the term ‘design system’ is used to describe a philosophy that encourages designers to define the rules of their designs as a system of instructions that can be used on more than a single product.
Rune Madsen, Programming Design Systems
Rune Madsen commence l’écriture d’un livre – un livre web – sur une nouvelle approche du design graphique, orientée système plutôt qu’objet, à suivre de près.
Si le réparateur – qui peut être l’utilisateur – peut perpétuellement maintenir une œuvre, les pièces qui s’usent, alors il n’y a pas de date, il n’y a pas de vieillissement. Sur une base qui est une base de pérennité ou tout du moins de grande solidité, on peut installer des pièces qui devront être remplacées, mais en tout cas qui laissent le schème fondamental intact et qui même permettent de l’améliorer. […] Voilà ce que j’appelle l’objet ouvert.
Gilbert Simondon, Gilbert Simondon sur les objets techniques “ouverts” et “fermés” (1967)
La distinction entre “objet technique ouvert” et “objet technique fermé” dans la pensée de Gilbert Simondon, raisonne forcément avec logiciel/code ouvert et fermé en 2017. Il est intéressant de tenter d’appliquer les concepts de Gilbert Simondon dans notre monde contemporain.
In this post, we gathered some Git tips and tricks we use at GitLab everyday. Hopefully they will add up to your aha! moment.
Achilleas Pipinellis, Git Tips & Tricks
Une série de trucs et astuces pour mieux maîtriser git, bien utiles.
Une semaine de culture graphique du 20 au 26 août, à Lurs, Alpes de Haute-Provence.
Les Rencontres internationales de Lure, Constellations – Attractions, liens et tensions graphiques
Louis Éveillard a créé cette page web pour présenter la prochaine édition des Rencontres internationales de Lure, et c’est beau !
En fait j’ai libéré du temps.
Thomas Parisot, Travailler moins pour gagner moins
Thomas Parisot a raconté son expérience de temps partiel à la conférence MiXiT 2017 : comment libérer du temps pour faire autre chose que du travail, pour faire beaucoup de choses, et aussi mieux travailler.
But other than loading fast, AMP sucks.
John Gruber, Scott Gilbertson: ‘Kill Google AMP Before It Kills the Web’
John Gruber réagit au billet de Scott Gilbertson, et critique très vivement AMP – Accelerated Mobile Pages –, une technologie mise en place par Google pour, en apparence, accélérer le web, mais en réalité pour développer une nouvelle place de marché.
I drew what HTTP is & how HTTP1.x and HTTP2 are different.
Mariko Kosaka, HTTP what?
Comprendre la différence entre HTTP1.x et HTTP2 rapidement et facilement ? Cette série de trois illustrations de Mariko Kosaka sont très réussies !
The Screenless Office is a system for working with media and networks without using a pixel-based display. It is an artistic operating system.
The Screenless Office
Un projet original et intrigant, à suivre.
Via Anthony Masure.
A text editor is at the core of the developer’s toolbox, but many other useful pieces of software coexist along with it, such as Git and GitHub. Starting today, Atom adds Git and GitHub integration directly in Atom via the GitHub package.
Michelle Tilley, Git and GitHub Integration comes to Atom
L’intégration de GitHub dans l’éditeur de texte Atom est probablement une fausse bonne idée : comment privilégier d’autres éditeurs de texte si vous utilisez GitHub ? Comment se passer de la plateforme GitHub si vous utilisez Atom ? Cette nouvelle fonctionnalité, “GitHub breaks out of the browser”, au demeurant très prometteuse, risque de donner un peu plus de suprématie à GitHub. Un peu de diversité est pourtant nécessaire.
L’objectif de cette page est par conséquent de donner les clés du livre numérique redistribuable, aussi connu sous le nom d’ebook reflowable text.
Jiminy Panoz, L’ebook redistribuable
Toute personne ayant eu à convaincre de l’intérêt de la liquidité du format EPUB sera heureux de trouver ici réunis un nombre important d’arguments, d’exemples, mais aussi de contraintes et d’obstacles. Jiminy Panoz parle de redistribuabilité, il s’agit bien du caractère adaptatif du format EPUB, en fonction de la dimension de l’écran, mais aussi d’autres paramètres.
Le livre numérique, c’est du web
Au cœur de ce colloque s’inscrit un questionnement fondamental et transversal : qu’est-ce qu’un livre ? Comment est-il appelé à se transformer en contexte numérique ?
CRILQ, Appel : Colloque ÉCRiDiL “Le livre, défi de design : l’intersection numérique de la création et de l’édition”
L’appel de propositions d’interventions pour la deuxième édition du colloque ÉCRiDiL est ouvert jusqu’au 12 juin 2017 !
Fournir la possibilité d’une autonomie même si elle n’est pas utilisée par la majorité permet de créer le terrain d’opportunité d’affaires, de communications, de réalisations des individus. Un des gros problèmes de la centralisation des services est inscrite déjà dans l’architecture de connexion du réseau. Si un simple ordinateur à la maison peut devenir un service, nous élargissons le champs des possibles et des initiatives individuelles.
Karl, Tristan, Ministre de l’économie numérique
Tristan Nitot a posé la question :
Si je devenais ministre du numérique, quelle priorités choisir ? #libre #standards #crypto #privacy #innovation #empowerment #education
@tristan
Voici la réponse de Karl !
This is a minimum viable web app to test most latin open type features.
Jiminy Panoz, Open Type Checker
Jiminy Panoz est joueur, et il nous propose aussi de jouer, avec cette web app permettant de tester les fonctionnalités d’Open Type.
Une constellation est un tracé primitif qui relie les étoiles pour nous guider et donner sens au monde. De même, dans l’abondance quasi infinie de l’information, le designer graphique repère les grands astres et trace discrètement les sentiers de l’intelligible. Typographes, graphistes, artistes, conçoivent-ils des mondes qui leur ressemblent, ou se fondent-ils dans des univers qui les dépassent ?
Les Rencontres internationales de Lure, Constellations – Attractions, liens et tensions graphiques
Le programme de la 65e semaine de culture graphique des Rencontres de Lure est en ligne, et les inscriptions sont ouvertes ! Ça se passe à Lurs du 20 au 26 août 2017.
Logiciel et matériel libre, DIY, réappropriation et détournement des technologies, sciences, défense des droits et libertés sur Internet, sécurité informatique, arts, création, culture(s), politique et société… Autant de sujets et de pratiques autour desquels les hackers du Tetalab et les artistes de Mix’Art Myrys vous invitent à venir découvrir, apprendre, questionner, partager et construire.
THSF #8
Au-delà d’une simple programmation, le THSF vous invite, avec l’ensemble des invités et des intervenants, à partager un temps et un espace communs quels que soient les parcours, les compétences de chacun. L’objectif est de générer ensemble un espace critique et expérimental fondé sur les échanges et les recherches menés dans les champs croisés de l’art, des technologies, de la philosophie et bien d‘autres.
À ceux qui pensent que la technique a déshumanisé l’homme, Gilbert Simondon répond que c’est l’homme, justement, qui a déshumanisé la technique.
Velvetyne’s Worldwide ampersand call
Voici les résultats d’un workshop organisé par la fonderie Velvetyne et les éditions Zeug, “placé sous le signe de l’esperluette”. Plus de 400 esperluettes ont été dessinées et/ou numérisées ! À noter que cette production s’inscrit dans le projet de traduction en français de l’ouvrage Évolutions formelles de l’esperluette de Jan Tschichold.
À ceux qui pensent que la technique a déshumanisé l’homme, Gilbert Simondon répond que c’est l’homme, justement, qui a déshumanisé la technique.
Les Chemins de la philosophie, Du mode d’existence d’un penseur technique
Étant en plein dans la lecture Du mode d’existence des objets techniques de Gilbert Simondon, je ne résiste pas à partager ce podcast. Lire Gilbert Simondon en 2017 m’apparaît essentiel pour qui veut interroger ses pratiques et son rapport au numérique.
Mais si le cloud est l’ordinateur de quelqu’un d’autre, ce dernier sait exactement comment ne pas perdre les données de ses utilisateurs : backup, duplication, réplication, …
L’équation est simple : si on ne supprime plus ses emails, si on a un espace de stockage géant, si on active par dessus l’IMAP2. Alors on utilise vraiment beaucoup d’espace disque et de serveurs.
Enguerran, J’ai dépollué internet
Prise de conscience de ce que représente nos usages de la messagerie électronique, du mail. Enguerran fait des choix pour réduire sa consommation d’hébergement de données, ici dans le cas du mail.
A modern medium for presenting research: The web is a powerful medium to share new ways of thinking. Over the last few years we’ve seen many imaginative examples of such work. But traditional academic publishing remains focused on the PDF, which prevents this sort of communication.
Distill
Une revue de recherche qui n’est pas au format PDF, qui intègre des graphes interactifs, au design travaillé, et dont les sources sont accessibles ? Distill propose une forme et un modèle de publication très originaux, en utilisant notamment git et GitHub.
David Rosenthal a rédigé un billet de présentation, avec quelques interrogations et critiques concernant l’archivage d’une telle forme de revue.
Via iGor.
Alors que les perspectives des universités se modifiaient au niveau européen, les écoles d’art en France se sont trouvées obligées de répondre à ce que Pierre-Damien Huyghe présente comme une « injonction à faire de la recherche ». Cette injonction a un contexte : le merchandising des savoirs. Le philosophe dresse un état des conséquences en matière d’éducation et d’enseignement, et examine les possibilités demeurant dans les champs des arts, du design et de l’architecture.
B42, Contre-temps de Pierre-Damien Huyghe
Ambitieuse entreprise de Pierre-Damien Huyghe dans son nouvel ouvrage qui paraît aux éditions B42.
At your request we have assessed what the possible effects of the Encrypted Media Extensions (EME) as a W3C recommendation would be.
We believe it will be dangerous to the open web unless protections are put in place for those who engage in activities, such as archiving, that are threatened by the legal regime governing the standard.
Lila Bailey, DRM for the Web is a Bad Idea
Le débat autour de l’implémentation de EME (Encrypted Media Extensions), du point de vue de archive.org.
L’Agile est donc régi par trois lois - la loi des petites équipes, la loi du client et la loi du réseau. Ensemble elles génèrent les bases d’une organisation Agile. Ces trois lois nous permettent de déchiffrer la myriade de pratiques agiles qui s’appliquent ou pas dans un contexte particulier. Les pratiques peuvent changer mais l’esprit Agile qui applique les trois lois demeure. Elles offrent un cadre durable pour l’implication d’une organisation qui devient Agile.
Steve Denning, Expliquer l’Agile
Frank Taillandier traduit un article de Steve Denning, qui permet de mieux comprendre l’Agile et ses multiples applications.
This is an important point. The browser market share can vary a lot depending on location.
Peter O’Shaughnessy, Think you know the top web browsers?
Un rappel nécessaire : il y a bien plus de navigateurs que ce que l’on pense lorsque l’on est occidental. Il n’y a pas que Chrome, Firefox, Safari, IE/Edge ou Opera, et cela change pas mal de choses si vous faites du web en dehors de l’Europe et des États-Unis.
Because it is difficult to perfectly transfer a thought from one mind to another it is essential that the principal medium through which such transference is accomplished may be as perfect as it is possible to make it.
Mike Neumegen, Jekyll For WordPress Developers
Un article assez classique sur les générateurs de site statique, et plus particulièrement sur Jekyll. L’approche est intéressante, puisque Mike Neumegen compare continuellement les static site generators à des CMS dynamiques comme Wordpress.
During our time working on Colloq we realised that we don’t need a lot of tools to run our project. Instead, we try to focus on our most important tasks. We try to understand our real needs, and we tweak the available options we have to match our needs. We lower the complexity in our product by reducing the tools we use. We believe that this is one of the reasons we currently work very efficiently on our product.
Anselm, The Tools We Use To Stay Afloat
Anselm, Tobias, et Holger utilisent GitHub pour travailler à plusieurs, Anselm détaille leurs pratiques de la plateforme – gestion des issues, communication, etc. À noter que la même chose est faisable avec GitLab.
We’re excited to introduce you to Twitter Lite, a Progressive Web App that is available at mobile.twitter.com. Twitter Lite is fast and responsive, uses less data, takes up less storage space, and supports push notifications and offline use in modern browsers. The web is becoming a platform for lightweight apps that can be accessed on-demand, installed without friction, and incrementally updated. Over the last year we’ve adopted new, open web APIs and significantly improved the performance and user experience.
Nicolas Gallagher, How we built Twitter Lite
Twitter a mis en place une Progressive Web App et Nicolas Gallagher donne quelques explications sur la conception et l’architecture. À noter que, pour le moment, il y a bien moins de publicité et l’interface est tout simplement plus réussie que la version desktop ou même l’application… Comme quoi le design n’est pas qu’une question de front, mais également d’architecture technique.
Bookmaker is an open-source toolkit to make books out of Word .docx files and HTMLBook HTML files (it can accept either type of file as input). It was developed as part of a pilot project to try to make books with almost no budget, and it is currently in use today at Macmillan.
Bookmaker: Macmillan’s bookmaking tool
Macmillan partage les outils de sa chaîne de publication, intéressant de voir que l’on retrouve toujours le même paradigme : le traitement de texte est conservé, pour le moment il s’agit plus de patchs que d’un changement de pratiques.
Remember–this is a tool we built for ourselves, and we’re not a software company!
Le support de présentation de Nellie McKesson de cette chaîne de publication, lors d’ebookcraft 2017, est disponible en ligne, ainsi que la vidéo.
Via Jiminy.
It’s not just the cost of owning and renewing the hardware, it’s everything else that comes with it.
Sean Packham, Why we are not leaving the cloud
Il y a quelques semaines l’équipe de GitLab – le logiciel et le service de gestion de git – expliquait pourquoi rester dans le cloud était le meilleur choix, toujours dans un effort de transparence très appréciable.
Because it is difficult to perfectly transfer a thought from one mind to another it is essential that the principal medium through which such transference is accomplished may be as perfect as it is possible to make it.
George French, Printing in Relation to Graphic Art
Il s’agit de la version web du livre de George French, Printing in Relation to Graphic Art, publié en 1903. Un bel exemple de livre web.
Via Jiminy.
Les Living Books about History sont une nouvelle forme d’anthologies digitales. Ils présentent des essais courts sur des sujets de recherche actuels, complétés par une sélection raisonnée de contributions librement accessibles en ligne.
Le projet vise à expérimenter un nouveau format de publication scientifique, à favoriser la découverte et la réutilisation de textes et de sources, et à attirer l’attention sur les avantages de l’open access pour la recherche scientifique.
Living Books About History
Une initiative des plus réjouissante, tant en terme de forme que de fond ! Avec notamment Digital Humanities de Tara Andrews ou Histoires de l’Internet et du Web de Valérie Schafer et Alexandre Serres.
Via Joël.
Derrière cet effrayant nom (HyperTextMarkupLanguage) se cache un site pour apprendre simplement les bases du HTML et du CSS. Par ailleurs, celui-ci s’adresse plus particulièrement aux graphistes et étudiants. L’objectif étant de partir sur les bonnes pratiques actuelles.
hypertextmarkuplanguage : guide html & css pour les graphistes
Louis Wimart a créé une documentation très claire pour débuter en HTML et CSS.
Peritext est un projet de recherche en design portant sur l’édition scientifique qui tente de valoriser la relation entre un texte académique et les ressources numériques que ce dernier mobilise. Il s’agit d’une part de valoriser la mobilisation des éléments de contexte issus de ressources numériques dans le contenu d’un document académique, et d’autre part de faciliter l’intégration de ce même document, sous diverses formes, dans l’écosystème global du web, ses standards et de ses espaces.
Peritext
Peritext est un projet de recherche de Robin De Mourat, un ensemble de “briques” permettant de “valoriser la relation entre un texte académique et les ressources numériques que ce dernier mobilise”.
Via Julie Blanc.
Quels sont les mécanismes et enjeux du geste technique d’écrire ? Qu’est-ce que « publier » dans une société numérique ? Comment le numérique transforme-t-il l’idée et l’acte d’écrire ? Dans quelle mesure les interfaces numériques refaçonnent-elles les activités d’écriture et de lecture à l’écran ?
Stéphane Vial et Marie-Julie Catoir-Brisson, Design et innovation dans la chaîne du livre
Suite au colloque ECRiDiL – Écrire, éditer et lire à l’ère numérique – qui s’est déroulé en avril 2016, voici un ouvrage qui rassemble les interventions, il est disponible depuis quelques jours. J’avais participé avec Le livre web, une autre forme du livre numérique, il y a beaucoup d’autres contenus très riches à découvrir, commandez-le à votre libraire !
Nous ne sommes pas hyper connecté aujourd’hui, mais plutôt constamment connecté, même si le terme est moins sexy.
Pia Pandelakis et Anthony Masure, Ex0053 Fantômes de la déconnexion
Première épisode d’une série sur le numérique, Killed by App, avec pour sujet la déconnexion, à écouter !
A blog trying to be a pattern library. All about designing inclusive web interfaces, piece by piece.
Heydon Pickering, Inclusive Components
Heydon Pickering débute une initiative autour du design inclusif, et donc de l’accessibilité : un blog rassemblant des bonnes pratiques autour du desgin et de l’accessibilité du web, avec des bouts de code dedans.
Toby Osbourn: Why do you think in general browser have been slow to support paged media?
Jeremy Keith: In a nutshell, because it’s invisible.
Jeremy Keith Interview
Toby Osbourn s’entretient avec Jeremy Keith, celui-ci donne de la profondeur aux questions techniques liées à print CSS – la mise en forme pour l’impression avec une feuille de style.
Mastodon est donc un logiciel. Au contraire de Twitter qui est un service. Personne ne peut installer le site Twitter sur son ordinateur et permettre à des gens de s’inscrire et d’échanger ailleurs que sur twitter.com. Par contre toutes celles qui ont les connaissances nécessaire peuvent télécharger Mastodon, l’installer quelque part et le rendre accessible à d’autres.
Åldα, Welcome to Mastodon
Une alternative libre et décentralisée de Twitter, qui semble aux premiers abords très intéressante – j’ai moi-même créé un compte sur l’instance principale. La critique d’Éric, Mon problème avec Mastodon, concernant les limites de Mastodon, est également très pertinente.
Afin que tout le monde comprenne le texte, il vaudrait donc mieux tout écrire, comme « lectrices et lecteurs ». Si ce n’est pas faisable, il est possible d’utiliser le point médian, sans en abuser.
Sylvie Duchateau, Langage non genré et accessibilité font-ils bon ménage ?
Très bonne synthèse des possibilités offertes pour utiliser, à l’écrit, un langage non genré, et quelles solutions sont les plus accessibles.
One thing that happened under my watch was the switch from focusing on XML to focusing on HTML. This might seem a little obvious or mundane, but it actually opened a lot of doors when it comes to automation. There’s this “white whale” in the publishing industry called “single source publishing”, which is a term that has come to mean maintaining the book content in a single file, and then “pushing a button” so to speak and magically transforming that file into the finished ebook file, the laid-out print file, and whatever else you need (for example, some publishers are publishing to the web as well now). […] O’Reilly is very techy, so it made sense for them, but it was hard for a lot of the non-tech companies to adopt and implement that kind of tool in a way that would make sense for their staff.
Nellie McKesson, Everything About E-Publishing
Entretien passionnant entre Stacey Sundar et Nellie McKesson pour Type Thursday, où il est question de publication, et notamment de fabriquer des livres avec les technologies du web.
It’s a world wide web out there. There’s plenty of room for everyone. And I, for one, love reading the words of others.
Jeremy Keith, Writing on the web
Si vous avez quelque chose à dire, écrivez ! Publiez ! Le web est fait pour cela !
As I’ve said several times before, the publishing industry as a whole has outsourced their entire workflow and production pipeline to a single vendor—Adobe. It’d be like if the web industry as a whole had decided that websites could only be made with Dreamweaver and only served from a Windows Server.
Baldur Bjarnason, The process is the thing
La comparaison entre l’industrie du livre et le web est intéressante, elle permet de révéler une absence de changement du côté du livre, milieu encore attaché ou contraint par des outils sans savoir comment ceux-ci fonctionnent.
Cela rejoint ce que j’ai exposé dans Une chaîne de publication inspirée du web.
Le constat était simple : si, d’après certains pleureurs, les livres de sciences humaines ne se vendent plus, c’est moins à mon sens parce que le lectorat manque qu’en raison de la pauvreté graphique de la plupart des livres. Cela n’est pas seulement valable pour les couvertures, dont les choix graphiques peuvent toujours se discuter, ou pour les caractères utilisés pour les textes, mais aussi, plus globalement, pour les objets eux-mêmes – certains livres sont de vraies briques, impossibles à ouvrir correctement. Or le savoir doit s’ouvrir au lecteur, au sens propre comme au sens figuré. D’où le choix de notre brochage.
Entretien d’Ulysse Baratin avec Alexandre Laumonier, L’art de publier des essais
Entretien avec Alexandre Laumonier, l’éditeur de Zones sensibles, absolument passionnant, sur : le design dans l’édition, comment un livre peut-il être conçu, la publication papier à l’ère numérique, la chaîne du livre, etc.
Via Anthony Masure.
Être éditeur, c’est créer un contexte (une maison, des livres, peut-être même des lignes de fuite) où tout livre doit pouvoir être le bienvenu à un certain moment […].
C’est à tous les niveaux de la chaîne du livre que se jouent l’indépendance d’esprit et la liberté de pensée : cela demande une attention quotidienne.
Il s’agit là de présenter aux étudiant(e)s le design graphique et la communication, en leur donnant accès à des outils et méthodes de reproduction au sein même de la recherche. Muriel Cooper y témoigne, entre autres, de ses préoccupations principales : son intérêt pour les mécanismes de production, et pour le rapprochement, autant que possible, du processus de fabrication et de celui de la production.
Adeline Racaud, De Theodor Nelson à Muriel Cooper
Un article sur Muriel Cooper et Theodor Nelson, sur la plateforme de publication Radôme des étudiants de l’ÉESAB de Rennes.
Aaron Swartz (1986-2013) était programmeur informatique, essayiste et hacker-activiste. Convaincu que l’accès à la connaissance constitue le meilleur outil d’émancipation et de justice, il consacra sa vie à la défense de la « culture libre ».
Éditions B42, Celui qui pourrait changer le monde
Les Éditions B42 publient un recueil de textes d’Aaron Swartz, et c’est une très bonne nouvelle !
J’ai compris que beaucoup confondent emploi et travail. Parfois oui, ils se confondent. Mais parfois l’emploi empêche de travailler tout en te donnant les moyens de continuer. Absurde. Aujourd’hui je n’ai ni l’un ni l’autre mais j’ai une fenêtre : un peu de temps. Alors je le déplie dans tous les sens pour fabriquer mon travail.
Clémentine Hahn, Tu fais quoi dans la vie ?
Dans le numéro 15 de la revue Faces B, Clémentine Hahn expose une vision intéressante du travail, du temps, de l’emploi, de l’activité salariée. Bref cela concerne une bonne partie de nos vies. Des réflexions qui soulèvent de nombreuses questions.
A-t-on vraiment les moyens de se déconnecter des compagnies d’assurance, des banques et des services d’immigration ? En principe, oui, si l’on peut assumer les coûts sociaux et économiques croissants de la déconnexion et de l’anonymat. Ceux qui souhaitent se déconnecter finiront par devoir payer ce privilège : taux d’emprunt plus élevés, contrats d’assurance plus onéreux et plus de temps perdu à essayer de convaincre les douaniers de leurs bonnes intentions.
Evgeny Morozov, Le prix de la déconnexion
Evgeny Morozov parle de privacy, d’addiction, de centralisation et de futur.
Plongez en 8 épisodes dans la jungle “typographique” de Paris, Londres, Berlin, Barcelone, Marseille, Amsterdam ou encore Montréal et (re)découvrez ces inscriptions qui influencent notre perception de la ville !
arte, Safari Typo !
Après Sacrés caractères en 2014, Thomas Sipp revient avec la réalisation de 8 épisodes d’une nouvelle série typographique, encore avec Bureau 205 au graphisme.
What’s different? Well, everything. The website won’t be running on WordPress anymore; in fact, it won’t have a back end at all. We are moving to a JAMstack: articles published directly to Netlify CDNs, with a custom shop based on an open-sourced headless E-Commerce GoCommerce and a job board that’s all just static HTML; content editing with Netlify’s new open-source, Git-Based CMS, real-time search powered by Algolia, full HTTP/2 support, and the whole website running as a progressive web app with a service worker in the background (thanks to the awesome Service Worker Toolbox library). Booo-yah!
Vitaly Friedman, A Little Surprise Is Waiting For You Here — Meet The Next Smashing Magazine
Smashing Magazine présente sa refonte, basée sur les concepts de JAMstack et d’amélioration progressive, et notamment sur un générateur de site statique, un bel exemple de développement web moderne !
PrePostPrint is a two days open workshop dedicated to the experimentation of alternative publishing systems.
PrePostPrint
Sarah Garcin, Raphaël Bastide, Étienne Ozeray et Romain Marula organisent un workshop autour des systèmes de publication alternatifs, les 6 et 7 avril 2017 à Paris, autant dire que le sujet est d’actualité ! J’y serai, et vous ?
Lire n’est pas consommer, c’est déjà produire du sens.
Nicolas Taffin, Dans les coulisses de la mise en accessibilité du livre « surveillance :// »
Sylvie Duchateau d’Access42 a interviewé Tristan Nitot, Nicolas Taffin et moi-même, autour du livre surveillance:// publié chez C&F Éditions. Un échange très riche, qui a permis de réunir quatre sujets rarement évoqués ensemble : les données personnelles, l’édition, le livre numérique et l’accessibilité ! Sans être un spécialiste de l’accessibilité du livre numérique, cet entretien m’a permis d’expliquer que l’accessibilité est avant tout une question d’approche et de bonnes pratiques.
Embracing minimalism on different aspects of your life has plenty of benefits, like peace of mind, knowing where things are, and being low-maintenance in general.
Jeremy Keith, Progressive Web App questions
Jeremy Keith a répondu à quelques questions posées par Colin van Eenige, à propos des Progressive Web Apps. Le point de vue Jeremy Keith est toujours très intéressant, et en rapport avec un web ouvert.
So there you go—I’m very excited about the capabilities of these technologies, but very worried about how they’re being “sold”. I’m particularly nervous that in the rush to emulate native apps, we end up losing the very thing that makes the web so powerful: URLs.
Embracing minimalism on different aspects of your life has plenty of benefits, like peace of mind, knowing where things are, and being low-maintenance in general.
Jonathan Verrecchia, Zeromalist – Zero is more
Un manifeste minimaliste, avec des points très pertinents, et du recul à prendre sur certains aspects (en tout cas c’est mon avis).
Via Frank.
Pour construire le web, il a fallu notre participation à tous, et c’est à nous tous, désormais, de construire le web que nous voulons – pour tous.
Tim Berners-Lee, Three challenges for the web, according to its inventor
Pour les 28 ans de l’invention du web, Tim Berners-Lee publie une tribune dans laquelle il dénonce trois tendances qui visent à restreindre l’ouverture du web : perte du contrôle de nos données personnelles, question de la désinformation et de sa diffusion, et propagande politique en ligne.
Contrast is the difference in luminance or color that makes an object (or its representation in an image or display) distinguishable. In visual perception of the real world, contrast is determined by the difference in the color and brightness of the object and other objects within the same field of view.
Brent Jackson, Colorable
Un outil pour déterminer la qualité du contraste entre deux couleurs – par exemple celle d’un texte et celle du fond –, très pratique et complémentaire de Accessible color palette builder.
Ce qui m’intéresse quand je fais des outils pour les designers, c’est comment on permet de donner cette marge de liberté que les designers vont utiliser avec leurs outils traditionnels.
Nolwenn Maudet, Les Nouvelles vagues, Les machines : Merveilleuses bécanes
Superbe émission de Marie Richeux – Les Nouvelles vagues – avec Nolwenn Maudet et Sophie Fétro, à l’occasion de leurs articles dans le premier numéro de la revue Back Office.
la plus grande difficulté en accessibilité web, n’est pas tant l’accessibilité elle-même, que le mot accolé, « web », qui est lui abyssalement méconnu. Voilà la réalité : celleux qui sont responsables des sites web, commanditaires, chefs de projets, éditeurs… ne connaissent que les documents bureautiques et plus précisément Microsoft comme horizon indépassable. Ils font tout avec ça. Tout. Y compris leurs sites web.
Romy Têtue, Accessibilité bureaucratique
Romy raconte une situation qui semble totalement surréaliste aujourd’hui, en 2017, et qui est pourtant bien réelle.
We believe that single-source content in HTML, with styling expressed with CSS, is the best way to make our books.
Dave Cramer, Beyond XML: Making Books with HTML
Fabriquer des livres imprimés et numériques avec HTML + CSS, plutôt qu’avec InDesign ou XML ? C’est ce qui a été mis en place chez Hachette Book Group, et ce que nous raconte Dave Cramer.
In InDesign, the content and the presentation are inseparable—two different presentations of the same content means having two independent files. Even embedding XML in InDesign doesn’t change anything; you still have to maintain that content in multiple files. We needed something better.
Paper is limited as a physical medium; it’s not connected to the network. Ebooks are limited by vendor silos, Digital Rights Management (DRM) lock-in, and what Amazon or Apple will let you do with them. Yet books are a central set of nodes in how I define myself, and I would like to explore my relationship with books using digital tools. But I can’t.
Boris Anthony et Hugh McGuire, A Momentary Suspension of Disbelief
Boris Anthony et Hugh McGuire, les fondateurs de Rebus Foundation, échangent autour des concepts de livre, de livre numérique et d’open textbooks : expériences de lecture, constitution du savoir, construction de soi, déception liée au livre numérique tel qu’il existe aujourd’hui, modèle du livre numérique à réinventer avec le web, etc. Un entretien passionnant qui introduit les travaux de recherche de Rebus Foundation !
The synthesis has to happen in the reader’s mind, and figuring out the tools to do that effectively and delightfully is an exciting challenge. Boris Anthony
If everyone’s interactions with their copies of a book feed back up to their source—their creator and publisher—they can begin to engage a distributed conversation and exploration.
Hugh McGuire
It’s simply not good enough to just go and build another reader app, another ebook store or stuff like that. A huge part of the work that needs to be done is adding the necessary infrastructure to the existing web to make books first-class citizens on the network, and beyond that: figuring out what equitable value flows and business models can bring all this to life.
Boris Anthony
L’édition scientifique fait aujourd’hui face à plusieurs transformations : réduction des budgets et des «personnels de renfort» éditoriaux, transition des supports vers le numérique, et crise de la reproductibilité des résultats. Chacune conduit à des évolutions des besoins des éditeurs, donc aussi par contrecoup des auteurs. Alors que Word est l’outil et le format standard pour les textes de sciences sociales depuis les années 1990, RMarkdown apparait mieux adapté à la situation contemporaine.
Alexandre Hobeika et Florent Bédécarrats, Une alternative à Word : écrire en RMarkdown
Comment utiliser Markdown en situation académique ? Se passer de Word dans le domaine de l’édition universitaire est-il possible ? Des réponses à ces questions avec RMarkdown – mais il existe d’autres solutions basées sur Markdown ou AsciiDoc.
C’est surtout et avant tout une problématique culturelle : la conception d’un livre numérique, c’est beaucoup plus qu’une réplique au mieux du livre imprimé, avec, éventuellement, du multimédia et des interactions. Il faut y intégrer les problématiques d’utilisabilité, de performance, de compatibilité avec les réglages utilisateur, etc.
Nicolas Gary s’entretient avec Jiminy Panoz, “La conception d’un livre numérique, c’est bien plus qu’une réplique du livre imprimé”
Entretien avec Jiminy Panoz, qui aborde la conception des fichiers EPUBs, mais également quelques points intéressants comme les chaînes de publication des éditeurs.
Mon principal problème avec tous les gestionnaires de soit-disant contenu statique est qu’ils le ne sont pas. Le contenu n’est pas généré à chaud en effet, au moment de la requête HTTP, mais il est tout de même généré au moment de la mise à jour. Mais le problème, le plus important est que presque tous ces gestionnaires regénèrent tout le contenu du site pour la création d’un seul article et de fait la plupart du temps détruisent les informations de cache HTTP.
Karl, Le printemps de février
Karl en avait déjà parlé il y a quelques années lors de son utilisation de Pelican, cette critique des générateurs de site statique est intéressante, et je ne sais pas si certains des générateurs ont réussi à résoudre ce problème – il est tout de même désormais possible de ne générer que les pages créées ou modifiées avec Jekyll par exemplee.
Hypertext, broadly defined, is a document which contains links to other documents. Pretty simple in theory, but it’s a concept that has echoed through the minds of innovators for over a hundred years.
Jay Hoffmann, A Brief History of Hypertext
Jay Hoffmann raconte l’histoire d’Internet, et cette partie sur l’hypertexte est passionnante. Chouette projet, sous forme de timeline, à suivre.
Everyone has abilities, and limits to those abilities. Designing for people with permanent disabilities actually results in designs that benefit people universally. Constraints are a beautiful thing.
Inclusive Design at Microsoft
Une vision et une approche intéressantes sur l’accessibilité, qui rejoignent le point de vue de Heydon Pickering : concevoir des produits inclusifs plutôt que les rendre accessibles, et considérer que nous nous sommes tous potentiellement des personnes en situation de handicap. Je suis de cet avis, même si cela crée le débat actuellement.
Via Nicolas.
Cette manifestation permet d’illustrer des pratiques qui débordent du seul champ du design graphique et dans lesquelles se mêlent différentes disciplines. Elle laisse apparaître des questions (Quels en sont les acteurs ? Quels sont aujourd’hui les enjeux et les pratiques de l’édition contemporaine ?), esquisse des réponses, ouvre des potentialités.
Exemplaires, formes et pratiques de lʼédition
Une manifestation et un colloque qui valent le coup, en tout cas l’édition 2015 était de qualité, j’avais d’ailleurs écrit un billet sur OSP : OSP : non-outil.
Mon prochain voyage aux États-Unis pour le travail, je pense y aller sans données personnelles, puisque le simple passage de la frontière est un risque. Le risque a plus d’une ramification. Ce que nous transportons dans nos appareils mobiles et nos ordinateurs sont des tranches de vie, non pas seulement la notre, mais celles de tous nos contacts, de toutes personnes avec qui nous communiquons. Cela me pose déjà un problème pour mes données personnelles, mais c’est encore plus terrifiant pour les données des autres. Une forme de responsabilité supplémentaire surgit.
Karl, La folie des frontières
Voyager sans données, pour protéger nos intimités personnelles et celles des autres.
I’m using Kirby as a CMS, but only on my local machine. The output of my Kirby templates and content is converted to a static site, which I push to github. This flow is baked into my gulp file, to make things quick and simple.
Nate Steiner, Blogging flow
Une utilisation originale de Kirby – un flat CMS qui n’utilise pas de base de données, contrairement à Wordpress –, utilisé comme un générateur de site statique.
There’s a proposal to add a new
<h>element to the HTML spec. It solves a fairly common use-case.
Jake Archibald, Do we need a new heading element? We don’t know
Ajouter un élément <h> pourrait-il résoudre le problème de hiérarchie des niveaux de titres dans un document HTML, en laissant le navigateur analyser et construire l’arborescence ? Question qui n’est pas si simple, notamment pour prendre en compte l’existant…
Le premier numéro de Back Office interroge les notions d’outil, d’instrument et d’appareil, dans le contexte du design.
Back Office, Faire avec
Le premier numéro de la revue Back Office est sorti, il est disponible en version papier et numérique. Une très belle initiative d’Anthony, Élise et Kévin, co-éditée par B42 !
Conserver dans le numérique ce que la main et l’œil ont de spécifique, construire ses propres systèmes et architectures techniques, ouvrir les boîtes noires des programmes pour travailler ensemble, revisiter des projets oubliés par l’histoire pour explorer d’autres directions, autant de façons de faire « avec » le numérique que nous vous proposons d’explorer.
Je parle beaucoup des générateurs de site statique mais je parle toujours de comment utiliser des générateurs de site statique. Ils sont souvent perçus comme une boîte noire. Je crée un modèle, j’écris un peu de Markdown et hop j’obtiens une page entièrement formatée en HTML. C’est magique !
Mais qu’est-ce vraiment un générateur de site statique ? Qu’y-a-t-il dans cette boîte noire ? De quelle magie Vaudou s’agit-il ?
Brian Rinaldi, Qui y’a t-il dans un générateur de site statique ?
Frank Taillandier traduit un article de Brian Rinaldi, qui décrit très clairement et très précisément comment fonctionne un générateur de site statique, à lire si le sujet des générateurs de site statique vous intéresse – et il devrait vous intéresser !
[…] je vais essayer d’exposer les obstacles qui font que design et open source font rarement bon ménage, essayer de comprendre pourquoi le grand public préfère utiliser des logiciels espions de sales capitalistes plutôt que leurs alternatives libres, et envisager des pistes de réflexion.
Julien, Le design dans le libre : pistes de réflexion
Julien aborde une question délicate, celle du design – pas uniquement le graphisme, il s’agit bien du design dans sa globalité – dans le libre. Les raison de ces échecs sont probablement celles de l’absence de place au design dès le début d’un projet, et le manque de confiance accordée au designer lorsqu’il est impliqué dans un projet. En lisant ce compte-rendu qui suit l’article, on comprend qu’il y a aussi souvent un problème de gouvernance.
At Paged Media, we have a vision for books in browsers, a vision that tries to learn from history, from the art and craft of print. We want them to be as beautiful as print, but flexible, accessible, adaptable. We want to be able to take a book and change the font or screen size, and have it automatically adjust to the new size, but still without widows and orphans and bad breaks. We want to be able to use ideas from the history of print, such as drop caps or footnotes or running heads, as well as links, popups, javascript, forms, and all the clever tools from the age of browsers.
Dave Cramer, Our vision for books in browsers
Grâce à Julien je découvre Paged Media : “A blog which advocates for innovative approaches to making books in browsers.”
I want to collect, connect, digest, and perhaps then I can create something from what I’ve found. What kind of bag can hold the things I find and make on the web?
Dave Cramer, A Bag Full of Stories
Il s’agit de la transcription d’une intervention de Dave Cramer à une conférence de Books in Browsers, qui résume très bien les questions suscitées par l’EPUB – le format actuel du livre numérique – et le web : comment réussir à utiliser le web pour raconter une, des histoires ? Comment rapprocher le web et le livre ?
Here we are, in 2016, with all this new web technology, and I can easily imagine a feature in your browser where making a book is as easy as making a bookmark. Just click a button to add a new chapter to your story.
Thus we turn the playlist into the mixtape, and the web becomes a net that catches the story.
Learning to code shouldn’t be hard. We’re making it easier by putting together a comprehensive set of web development tutorials to help transform complete beginners into talented Interneting professionals. We’ve got the curriculum, all you need is the motivation to start reading it.
Oliver James, Interneting Is Hard (But it doesn’t have to be)
Oliver James a écrit une série de tutoriels, en anglais, HTML & CSS Is Hard, pour apprendre les bases du web en 14 leçons : HTML, CSS, sémantique, mise en forme, formulaire, typographie, etc. Cela semble (très) bien fait !
[…] le blog est le fruit d’une évolution personnelle grâce à l’intelligence du collectif qui a pris la peine d’échanger, de proposer d’autres voies. Un journal qui n’est plus un curriculum vitae mais un chemin de pensée montrant une progression au fil des années.
[…]
Le blog se rapproche de l’open-source sur ce plan là qui consiste à exposer son code à la critique collective en vue de le rendre plus pertinent.
David Larlet, Lettre à Marion
Depuis plusieurs semaines David s’est lancé dans une forme de correspondance, en ligne. Cette lettre à Marion dessine les différences entre livre et blog, cette lettre parle de pratiques d’écriture d’aujourd’hui.
Thomas Parisot, développeur web basé à Londres, viendra présenter son expérience d’écriture d’un livre à paraître aux éditions Eyrolles. Ce projet est réalisé en résidence itinérante et collaborative.
Écrire à plusieurs avec GitHub?! – Rencontre avec Thomas Parisot
Thomas passant par Grenoble, je me suis dit que c’était l’occasion idéale pour présenter sa démarche d’écriture de son livre sur Node.js, et La Coop est le lieu parfait pour échanger. Cette rencontre aurait pu s’intituler “Écrire un livre en 2017”.
Cela se passera jeudi 23 février 2017 à La Coop, 31 rue Gustave Eiffel à Grenoble, l’entrée est libre, sur inscription.
Our website has been fully open source since we released it around two years ago. We built the site using Jekyll, a popular static website generator.
The site is hosted on Github. We used Jekyll with Github for several reason:
- It’s fast
- It’s secure
- It’s version controlled
- It’s flexible
- It’s dev friendly
- It’s limited
Rapide, sécurisé, versionné, flexible, limité, tous les arguments en faveur de la combinaison générateur de site statique + fichiers versionnés avec Git + hébergement du code source et des fichiers sur GitHub.
(Je découvre 14islands et je suis assez fan de leur démarche, de leur vision et leurs projets.)
I think every website from now on should use some of the Progressive Web App features.
Hjörtur Hilmarsson, We built a PWA from scratch - This is what we learned
L’équipe de 14islands a conçu une application web, une Progressive Web Application, et explique très clairement comment ils ont procédé.
En ces temps fait d’incertitude avec parfois l’impression d’être devant un immense vide, où les plus grandes certitudes sont ignorées, bafouées, où la haine est attisée de toutes parts alors que pourtant tout pourrait être si clair et si lumineux, consigner aujourd’hui le futur passé demeure, à mes yeux, le meilleur moyen de ne pas se perdre en route.
Hoedic, Pourquoi bloguer en 2017
Les reprises de blogs et carnets en ligne sont de plus en plus nombreuses : indépendantes, intimes, ouvertes, curieuses.
Accepter que ce qu’on fait (le paragraphe qu’on ajoute, le mot que l‘on corrige, l’idée que l’on apporte) ne nous appartient pas, mais se fond dans un ensemble plus vaste.
Xavier de La Porte, Du Google Docs comme modèle politique
L’écriture collaborative comme programme politique ? Si Xavier de La Porte distingue l’usage de Google Docs de celui d’outils plus respectueux comme les pads – et notamment ceux mis en place par Framasoft – il aurait été intéressant d’aller regarder comment on écrit avec Git – que ce soit du code ou du texte.
Yesterday we had a serious incident with one of our databases.
GitLab, GitLab.com Database Incident
GitLab – la plateforme et le service basés sur Git, concurrent à GitHub – a eu un incident majeur il y a quelques jours, avec fermeture de gitlab.com pendant plusieurs heures, et perte de données… Ce qui est intéressant ici c’est la façon dont la crise a été gérée : communication très transparente, explications détaillées, et même une retransmission en direct de la récupération de la base de données. De l’humain dans le code, mais aussi une communication bien menée.
We, the people who work on the web, have seen firsthand the great things can be accomplished when we open up, share, discuss ideas, and collaborate together. We need to stand by our commitment to openness and collaboration, and must unequivocally condemn any efforts to suppress the freedom of speech and ideas. We have a tremendous opportunity to help spread the spirit of the web, as it has woven itself into every industry and aspect of society.
Brad Frost, The Web’s Responsibility In The Trump Era
Brad Frost pointe quelques énormités constatées ou en perspective suite à l’arrivée de Donald Trump à la présidence des États-Unis, et en rapport avec le web. L’appel à résistance de Brad Frost est clair, mais est-il politique ?
À un moment, je pense qu’EPUB (ou son successeur) ne pourra pas faire sans évangélistes.
Jiminy Panoz, Maintenant, l’évangélisation auprès du web
Jiminy Panoz expose de façon synthétique et convaincante ce que beaucoup de personnes intéressées et impliquées dans le livre numérique pensent : il faut évangéliser le livre numérique auprès des acteurs du web – l’EPUB, son “successeur” et les Portable Web Publications.
Une citation bonus, parce que cela me semble aussi être une aberration :
Quant aux rapports et livres blancs, la très grosse majorité n’est disponible qu’au format PDF — ce qui est pour le moins ironique quand le rapport ou livre blanc a pour sujet le livre numérique.
The Electric Book workflow is a set of tools and processes for creating high-quality books. […] It lets you store books in plain text with great version control, and output website versions, ebooks and print editions easily from a single source.
Arthur Attwell, The Electric Book workflow
Dans le même esprit que ce que The Getty Publication a mis en place : une chaîne de publication basée sur des outils issus du web, afin de simplifier les processus, et d’envisager les différentes versions d’un même livre dès l’écriture.
I recently added an option to save blog posts for offline reading, and this post will detail how I did that so you can too.
Una Kravets, Implementing “Save For Offline” with Service Workers
Una Kravets présente la façon dont elle a implémenté des Service Workers pour une lecture hors ligne de ses articles.
This is a tool to help designers build color palettes with combinations that conform with accessibility standards.
Accessible color palette builder
Voici un outil qui permet de vérifier que des combinaisons de couleurs – par exemple les couleurs d’un texte et d’un fond – respectent un contraste suffisant, et donc restent lisibles par toutes et tous. Un outil bien pratique (utilisable en local).
Bienvenue sur le site de la nouvelle initiative open source de Mozilla visant à documenter et à analyser l’état de santé d’Internet. En combinant des informations de plusieurs sources, elle rassemble des données relatives à cinq thèmes clés dont elle propose une brève présentation.
Mozilla, Comment mesurer l’état de santé d’Internet ?
Mozilla lance une initiative intéressante : “Bulletin de santé d’Internet, Éléments utiles et néfastes à notre principale ressource mondiale.”
Via Clochix.
Pourquoi cette intimité entre les bibliothèques, l’informatique et, au-delà, Internet ? Cette intimité a bien des causes, mais pourrait presque tenir en une personne. Un homme très connu des bibliothécaires, documentalistes, historiens du livre etc. mais dont la notoriété mériterait d’être étendue largement au-delà, tant son oeuvre est fascinante. Cet homme, c’est Paul Otlet.
Xavier de La Porte, Le belge qui a rêvé Internet
Paul Otlet n’a peut-être pas inventé Internet, mais il a imaginé/conceptualisé un système d’information qui s’en rapproche beaucoup !
En fait, ce qui est fascinant chez Otlet, c’est qu’il avait anticipé que le savoir ne serait pas plus seulement dans les livres, qu’il connaîtrait d’autres supports, d’autres modes de consultation, de classement.
Je voulais expérimenter une chaîne de production statique pour plusieurs raisons. Premièrement, je voulais m’assurer que notre travail demeure accessible aussi longtemps que possible. […] Notre deuxième préoccupation était la dépendance à des logiciels propriétaires. […] Enfin, comme toute personne ayant une formation en design, je me soucie beaucoup du design et de l’expérience que nous proposons à nos utilisateurs.
Antoine Fauchié s’entretient avec Eric Gardner, Publier des livres avec un générateur de site statique
Eric Gardner a accepté de répondre à mes questions concernant la chaîne de publication qu’il a mis en place pour les éditions de The Getty. De mon point de vue c’est une petite révolution, car il s’agit de passer du couple Word + InDesign, ou d’une chaîne XML complexe, à un ensemble d’outils issus du web : Markdown, YAML, Git et un générateur de site statique. C’est une révolution métier.
Un grand merci à Frank d’avoir accepté cet entretien sur Jamstatic.fr, et pour avoir grandement contribué à la traduction.
La version anglaise a ensuite été publiée sur The New Dynamic, merci à Bud Parr : Interview with Eric Gardner, Getty Publications
The main objective of this event is to “touch” what the EPUB digital publication format can bring to the professionals and to the readers of the 21st century in terms of flexibility, interoperability and accessibility. With the EPUB Summit, EDRLab aims to strengthen a true spirit of cooperation between professionals and push to the massive adoption of the EPUB 3 format by the European publishing industry.
Laurent Le Meur, EPUB Summit 2017, first press release
Le deuxième EPUB Summit aura donc lieu les 9 et 10 mars 2017 à Bruxelles. Cet événement dédié au livre numérique devrait assez naturellement s’élargir au document numérique, pour le moment les sujets abordés seront, principalement, la fusion/association de l’IDPF et du W3C, et le lancement de LCP – Light Content Protection –, une mesure technique de protection (DRM) interopérable.
Programme disponible en ligne : https://edrlab.org/programme-epub-summit-2017/
Maybe I lost my attention because I’m weak, lonely, pathetic. Maybe everyone else has total control; they can resist all the information spun by algorithms—all the delicious dopamine hits in the form of red circles. Bing! Maybe it’s just me.
But … I want my attention back.
Craig Mod, How I Got My Attention Back
Dans un long papier Craig Mod explique pourquoi et comment il a voulu se réapproprier son attention, dans un monde hyper-connecté et surchargé en information : à lire absolument.
There are a thousand beautiful ways to start the day that don’t begin with looking at your phone. And yet so few of us choose to do so.
Je ne veux plus participer à un mouvement de centralisation de la vie numérique sur quelques mal-nommées plateformes […].
PiaP, Quitter Facebook
Pia présente très clairement les raisons de son départ de Facebook, c’est bien dit, et cela fait réfléchir à nos usages d’autres réseaux sociaux ou plateformes.
Google’s goals with the AMP Project are laudable, but there are major security and UX concerns that need to be addressed. In its current form, AMP is bad for the open web and should be changed or eliminated.
Kyle Schreiber, The Problem With AMP
Ce n’est pas le premier billet qui vient critiquer AMP, le langage de balisage créé par Google pour accélérer le web : mauvaise expérience utilisateur en raison des URLs et des contenus dupliqués (même contenu avec deux accès différents, dont celui avec AMP peu compréhensible), la dépendance à Google en raison du contrôle du langage et des serveurs qui hébergent les pages, et les questions de données personnelles et de sécurité.
Si la précarité s’éprouve aussi à travers la fracture numérique, des initiatives solidaires existent pour la contrer.
Les Nouvelles vagues, Connexions solidaires
Belle émission qui replace le numérique dans un contexte plus global, réel, humain, par rapport à ce que nous – les acculturés du numérique – avons tendance à poser. Cela fait du bien d’écouter ces témoignages de vie, et cela donne envie de se retrousser les manches, notamment pour un web plus inclusif.
EPUB est trop compliqué et les chaînes logicielles éditoriales sont du coup trop compliquées et surtout trop rares.
Daniel Glazman, Livre électronique, qu’est-ce qu’on a raté ?
Daniel Glazman livre en 11 points pourquoi le livre numérique ne décolle pas en France. Je partage ses avis, hormis le point 8, je lis sur téléphone mobile et je pense que cela va se développer.
NUMERO ONZE, magazine numérique de l’Internet
NUMERO ONZE
Un magazine numérique pour une fois original. Chaque numéro prend la forme d’une page web, une couverture façon magazine papier avec les titres qui amènent vers quelques contenus : un entretien sous forme d’échanges qui viennent se superposer à la vouverture, et des liens rubriqués (application, développement, typo, GIF, etc.). Un système simple, efficace. Dommage que l’adaptation aux écrans ne soit pas mieux réussie.
Pour ma part, j’ai voulu faire une histoire française du Web - ce qui qui n’est pas tout à fait la même chose qu’une histoire du Web français.
InaGlobal, Une histoire française du Web…
Long entretien, passionnant, avec Valérie Schafer, “historienne d’Internet, du Web et des cultures numériques”.
For a small site/app that takes 2 or 3 Mb, I can accept to download everything, because the convenience to have all this available while offline can be great. But I think 16 Mb is really to much.
Nicolas Hoizey, How much data should my Service Worker put upfront in the offline cache?
Désormais un site web peut être utilisé hors ligne, après une mise en cache des données (fichiers HTML, CSS et JavaScript, mais aussi images et fontes), et grâce aux Service Workers – voir mon billet Quatre bonnes raisons de faire du web hors connexion à ce sujet. Nicolas Hoizey pose une question que personne n’osait poser : quelle limite fixer pour la quantité de données stockées localement ? L’exemple qu’il prend est le livre web de Jeremy Keith : Resilient Web Design. Question pertinente qui concerne aussi les domaines de l’accessibilité et de la qualité web.
Que ce soit sur les supports imprimés et numériques, nous sommes toujours assez liés à l’orthogonalité pour des raisons techniques, pratiques et d’habitude. Et si la navigation était oblique ?
Anthony Masure et Kevin Donnot, Web oblique
Dans le numéro 7 de la revue Back Cover des Éditions B42, Anthony Masure et Kevin Donnot présente le site du photographe Enrico Floriddia, réalisé par Raphaël Bastide : slanted.cc.
Ginetta created a concept for their new jobs website, which allows siroop to introduce themselves in a unique way. Through a conversational UI, a dialog between between siroop and potential candidates is established.
[…]
We used Kirby CMS as a lightweight file-based backend to manage the content of the site. Kirby is simple, especially for content editors.
Ginetta, siroop: Jobs
Étude de cas d’un site web de recherche d’emplois : une interface conversationnelle – un peu comme uxchat.me – avec le CMS Kirby comme gestionnaire de contenus.
Via Kirby.
As we move our code to CodePen, our writing to Medium, our photographs to Instagram we don’t just run the risk of losing that content and the associated metadata if those services vanish. We also lose our own place to experiment and add personality to that content, in the context of our own home on the web.
Rachel Andrew, It’s more than just the words
Rachel Andrew pose la question de nos maisons numériques que nous pouvons créer et maintenir, indépendamment des plateformes de blogging ou des réseaux sociaux. Dans le même esprit que mon billet Interroger nos pratiques de publication en ligne.
Je partage l’interrogation de Clochix : “Mais être locataire de sa propre maison Web a-t-il un sens pour qui n’est pas Webeu⋅se ?”
Offrons de nouvelles possibilités narratives aux auteurs en les débarrassant du carcan du livre. Jouons des possibilités graphiques et typographiques de l’écran. Brouillons les frontières entre web et livre — n’envisageons qu’un seul corps pour nos créations, celui de l’écran.
Walrus, Livre numérique : ce que nous avons raté, pourquoi nous l’avons raté, et comment nous allons changer les choses
Les réflexions de l’éditeur Walrus, en ce qui concerne le livre et le texte, sont aussi irrégulières que pertinentes. Cet appel à considérer autrement le texte, le livre, le web et le numérique est réjouissant !
Recently, more freedom in web design has meant that now every browser vendor and W3C have started to implement and recommend vertical design for text layouts and formatting for web design.
As for typesetting, it has now become normal to utilize horizontal and/or vertical layouts for Japanese text, where previously restrictions meant only horizontal were allowed.
たてよこWebアワード
Mettre en forme du texte, horizontalement et verticalement. Une belle démonstration.
The future of typography is not to be found in new letters alone, but a series of tools, techniques and options combined together.
Robin Rendle, The Futures of Typography
Nouvel essai de Robin Rendle : après The New Web Typography en février 2016 avec des références à Jan Tschichold, voici un texte qui présente les possibilités, ou plutôt les outils, dont les designers vont pouvoir s’emparer pour offrir de nouvelles expériences, dans le web. Le point de départ s’appuie sur deux figures historiques de la typographie : Johannes Gensfleisch zur Laden zum Gutenberg et Aldus Pius Manutius.
When seen as separate, disparate technologies the few upgrades I’ve mentioned above don’t seem all that impressive. But when the ServiceWorker API, new font formats, and Grid Layout are brought together the web is suddenly very different to the one that we experience today.
Building a better web. Sounds great, doesn’t it? But what do we need to do to make it so? And what do we mean by better? Isn’t it great as is? This is what we are going to try to unravel and present to you this coming year.
O’Reilly, Building a better web in 2017
De la résilience aux Progressive web apps, en passant par l’accessibilité ou la performance, les experts d’O’Reilly évoquent les sujets de 2017, dans la continuité de 2016.
A collection of CSS snippets to do progressive enhancement and achieve better typography, layout and UX in eBooks.
Blitz eBook Tricks
Après les checklists sur la performance et le design de livre numérique, voici une liste de trucs pour construire au mieux une feuille CSS pour un EPUB. Un outil pratique, qui par ailleurs s’installe sur votre téléphone puisqu’il d’une web app.
So where have we got to? Access is important, but inclusion is bigger than access. Inclusive design means making something valuable, not just accessible, to as many people as we can.
Heydo Pickering, What the Heck Is Inclusive Design?
Une définition du design inclusif, qui intègre la notion d’accessibilité tout en ne s’y limitant pas.
Via Marie.
If you think the book should be available in any other formats, and you fancy having a crack at it, please feel free to use the source files.
Jeremy Keith, The many formats of Resilient Web Design
Jeremy Keith nous propose un très bel exemple de publication numérique sous plusieurs formats – web, EPUB, PDF, audio – pour son livre Resilient Web Design. Cela est possible pour deux raisons : une distinction entre le fond et la forme, et une ouverture des sources qui permet à n’importe qui de proposer une version.
Le Print On Demand est mort. Bonne nouvelle, diront ceux qui s’en inquiétaient mais n’avaient même pas eu le temps d’apprendre de quoi il s’agissait.
François Bon, le Print on Demand est mort (et imprimé)
Ainsi commence l’article de François Bon. Il y est question de Print On Demand, ou impression à la demande, ce processus d’impression qui permet de fabriquer un livre en un seul exemplaire, s’affranchissant ainsi des contraintes de tirage. Ce changement de paradigme, débuté il y a déjà plusieurs années, permet aux auteurs ou aux éditeurs de publier beaucoup plus facilement, en version papier. Et tout cela est très fortement lié au numérique, principalement au niveau de la chaîne de publication.
The trouble with expecting perfection in one go is that it can be tempting to take the safe route, to go with the tried and tested. But giving ourselves room to test and refine also gives us the freedom to take risks and try original approaches.
Eleanor Ratliff, Accessibility Whack-A-Mole
Comment adapter le design d’une typographie web pour la rendre plus accessible ? Et comment organiser un projet pour aller vers cette accessibilité ? Un article qui parle de design formel et de design de projet.
Et c’est évidemment de politique dont il est question ici.
David Dufresne, De Mac à Linux. Parce qu’il n’y a pas d’alternative.
David Dufresne, auteur et réalisateur de documentaires, prend le temps d’expliquer son passage de Mac à Linux : clair et concis, idéal à lire pour quelqu’un qui n’aurait pas encore sauté le pas.
De politique pure. De choix des armes. De construire notre monde de demain, maintenant.
GitLab, une des alternatives à GitHub, a fait un superbe cadeau de Noël à sa communauté : l’intégration des GitLab Pages à la version communautaire de GitLab !
Framasky, GitLab libère les GitLab Pages
GitLab, comme GitHub, permet d’héberger des pages web et d’utiliser des générateurs de sites statiques : un simple git push génère un site web complet, basé sur Jekyll ou d’autres static site generators. Contrairement à GitHub, GitLab peut être installé librement sur un serveur, pour héberger du code et gérer des projets. À partir de janvier cette fonctionnalité de génération de site web sera ajoutée à cette version installable, ce qui veut dire que n’importe qui pourra désormais avoir une instance de GitLab, héberger le code source de son site web, générer les pages HTML de ce site, et héberger le site. Une très bonne nouvelle !
What happens next is fun.
Jenn Lukas in What Comes Next Is The Future
Le documentaire de Matt Griffin, What Comes Next Is The Future, est disponible depuis plusieurs mois, en ligne. C’est un film qui parle du web, de son histoire, de l’opportunité qu’il représente, de la façon dont il est conçu et de son avenir. C’est un film qui aborde essentiellement des questions de design, il prend la forme d’entretiens avec les figures du web : de Tim Berners-Lee à Jeffrey Zeldman en passant par Brad Frost ou Jeremy Keith.
Critiquable sur le fond comme sur la forme, ce film est néanmoins incontournable pour toute personne travaillant dans le web, le numérique, dans l’édition, ou dans le domaine très vaste des sciences de l’information.
Le film est en version originale, en langue anglaise, mais il est possible d’afficher des sous-titres – anglais.
Voici quelques citations extraites du documentaire :
The web taught me how to make websites which is a brilliant idea when you think of this thing that can teach people how to extend itself. So the fact that people were sharing and connecting right from the start has had a huge effect on my life and on my work.
Jeremy Keith
Anyone can publish from anywhere in the world.
Jeffrey Zeldman
In this industry and especially in front of development because you can view anyone’s source, I think it’s really neat because we can see how other people are building things and we can talk about how we are building things.
Jenn Lukas
So clearly the key to the web was going to be, should be a virtual system which existed on the top of all these existing systems and allowed you to see them all, so they were all part of one great big hypertext book.
Tim Berners-Lee
It [Flash] exactly inverted the web’s fundamental set up. So the web from its inception prizes ubiquity over consistency. Right, the whole idea is that I don’t care, you know, I don’t care what kind of device you have, if you have a thing that can consume HTTP and HTML, you will get data. You will get the content. Flash was exactly the opposite.
Eric Meyer
CSS Zen Garden was the first sort of universal sense across the community. The first glimmer of how the separation of content and presentation could really work.
Lyza Danger Gardner
If my content is separated from my design and my content is semantically marked up it’s going to be easier for let’s say a blind person who uses the screen reader to navigate my content.
Jeffrey Zeldman
The web is flexible by default, right? I mean it’s able if nobody designed it. If nobody showed up for work tomorrow and we were just serving plain HTML text documents to the entire internet, any screen any device that understood HTML would be able to understand them. You know, it’s the designers and the developers that kind of bring extra complexity to this medium. John Allsopp was talking about this, you know, back in 2001 where he was basically saying that this is this medium that has an ebb and flow to it. You know that this is just truly flexible completely adapted medium and we should design for that. Ethan Marcotte
In an app store, there’s this intermediary that has to evaluate each contribution, each app before it can be put up there for you to download and use. Imagine if you’re publishing a website and you had to… every time you published it or made any change submitted to some authority and then wait days potentially for that change to go through and they could reject it for any reason. We wouldn’t have the web that we have today.
Tantek Çelik
Watching people understand that the web can be a first-class application platform if only we let it. Watching people’s excitement at being able to be a real application without changing anything about how you build and how you deliver it. Just URLs, HTML and the real honest to goodness web all the way down. That has been incredibly gratifying for me.
Alex Russell
What happens next is fun.
Jenn Lukas
Vous l’aurez compris : pour Noël, je voudrais que nous réalisions tous que faire un site Web aujourd’hui, c’est avant tout le réaliser pour demain, pour la personne qui s’en occupera après nous et dans l’optique que l’ensemble dure plusieurs années et soit aisément maintenu.
Boris Schapira, Un Web au Futur
À l’occasion de nowwwel, Boris Schapira parle de résilience : comment concevoir un site web qui vieillira bien, qui sera modulable et reprenable ?
Nous pouvons désormais accéder directement depuis le navigateur à l’appareil photo, prendre des vidéos, capturer de l’audio et utiliser WebRTC pour construire un système de messagerie dans le navigateur sans avoir besoin d’installer le moindre plugin. Il est également possible de construire des Progressive Web Apps qui, grâces à une icône de lancement, des notifications ou encore des fonctionnalités disponibles hors connexion, etc., permettront de reproduire une expérience proche de ce qu’offraient jusque-là les applications natives. Et pourquoi s’arrêter en si bon chemin ?
Stéphanie Walter, Les super pouvoirs des navigateurs mobiles
Stéphanie Walter explore les possibilités du web mobile, avec des exemples concrets et des mises en situation très réalistes !
Petite maison de production de podcasts.
Qualiter
Des podcasts sur le numérique : Studio 404, C’est Cool C’est Quoi ?, Trajectoires et Le Log. À télécharger, à écouter sur iTunes ou Soundcloud, et à débattre sur les forums dédiés. Une belle initiative !
Via Anthony.
Design is not just what it looks like and feels like, design is how it works.
The eBook Design Checklist
Après The eBook Performance Checklist, Jiminy Panoz a mis en place une checklist pour le design des livres numériques. Il s’agit encore d’une Progressive Web App, ce qui veut dire que ce site web peut être installé comme une application, et être utilisé hors connexion.
Avoir le contrôle de sa vie numérique n’est donc pas forcément synonyme d’en garantir la pérennité.
Clochix, Pérénnité
Clochix explique assez clairement que le contrôle de nos vies numériques n’est pas simple : placer nos données sur des services tiers ne nous assure pas de les retrouver quelques années plus tard, mais auto-héberger nos données présente le risque de les perdre (arrêt de l’hébergement, perte d’un nom de domaine, etc.)… Pour compléter ce que dit Clochix, on peut aussi adopter la stratégie POSSE, Publish (on your) Own Site, Syndicate Elsewhere pour une bonne partie de notre vie numérique : déposer ses fichiers d’abord sur nos hébergements personnels, et ensuite envisager de les mettre également sur des services tiers.
Datée de novembre 2015, une grande saga du livre numérique de juillet 1971 à nos jours.
Le livre 010101 (1971-2015), www.010101book.net
J’ai enfin déposé le code source du livre web Le livre 010101 (1971-2015) de Marie Lebert, www.010101book.net, sur GitHub. Le site web est généré avec Jekyll, et il y a quelques modifications pour la génération de la table des matières notamment.
On December 17, 1996, W3C published the first standard for CSS. And thus from December 17, 2016 until one year later, CSS is 20 years old.
W3C, 20 Years of CSS
Le CSS a vingt ans ! Le W3C a également publié une petite histoire du CSS : https://www.w3.org/Style/CSS20/history.html
La 7e édition de Sud Web aura lieu à Aix-en-Provence, les 19 et 20 mai 2017 […].
Sud Web, Ouverture des inscriptions pour Sud Web
Sud Web – “la conférence itinérante des travailleurs du web” – 2017 aura lieu les 19 et 20 mai 2017 à Aix-en-Provence ! Les inscriptions sont ouvertes, et il y a toujours un appel à propositions en cours, proposez un sujet !
Armés des bons outils méthodologiques et d’un jeu de compétences techniques de base, il me semblerait normal qu’ils deviennent tous, à terme, de meilleurs profesionnels que je ne le suis.
Boris Schapira, Enseigner et apprendre
Boris propose une définition de l’enseignement, et je me retrouve dans cette description.
Pourquoi ne pas profiter de l’ambiance festive entre les trolls sportifs et les discussions politiques (ou l’inverse) pour éduquer sur l’état du web et pointer quelques pistes pour améliorer la situation ?
David Larlet, Militantisme festif
Expliquer à son entourage l’état du web et les alternatives qui existent face aux silos, une bonne idée – militer et vulgariser – de David en cette d’année.
Every developer will understand and admit that we’re biased which browsers we want to support. Therefore a decision made with that bias will likely not reflect reality of people who will try to access the website/app.
Anselm Hannemann, The World uses the Internet (differently)
Comment les utilisateurs accèdent réellement à un site web ? Quel(s) navigateur(s) utilisent-ils ? Quelle est la qualité de leur connexion internet ? Est-ce que les scripts peuvent être chargés dans tous les contextes ? Etc. Autant de paramètres qu’il faut prendre en compte au moment de créer une application web, et qui nécessitent des choix.
If you make websites in any capacity, I hope that this book will resonate with you. Even if you don’t make websites, I still hope there’s an interesting story in there for you.
Jeremy Keith, Introducing Resilient Web Design
Jeremy Keith vient de publier un nouveau livre, un livre web ou web book : Resilient Web Design.
It’s a good time to go all in on the web. I can’t wait to see what the next few years bring. Personally, I feel like the web is well poised to replace the majority of apps we now get from app stores.
Henrik Joreteg, Installing web apps on phones (for real)
Henrik Joreteg aborde la question pratique de l’installation des Progressive Web Apps, et la façon dont les navigateurs et les OS réagissent, très instructif.
Via Jiminy.
Now, the advised method for creating a document outline is to still make use of nested <section> elements, but in combination with the appropriate heading rank for each section.
Ire Aderinokun, Document Outlines in HTML 5.1
Ire Aderinokun présente un changement important dans HTML 5.1, la structuration avec les <section>, qui semble désormais plus logique, puisque la hiérarchie des titres est désormais respectée.
C’est rigolo comme les thèmes abordés dans les notes de version sont les mêmes en 1997 qu’en 2016, non ?
Gaël Poupard, Les nouveautés dʼIE4
Pour #nowwwel Gaël Poupard présente les nouveautés d’Internet Explorer 4, le navigateur de Microsoft sorti en 1997, oui oui ! Et finalement ce navigateur posait, à cette époque, des concepts et projets qui sont encore d’actualité (hors connexion, CSS, pagination, etc.).
Malgré notre volonté de tout garder, malgré le haut niveau de technicité que nous mettons à cela, nous sommes condamnés à ne conserver que des instantanés. Nous devons admettre les vides et les absences.
Xavier de La Porte, Archiver le web, c’est être condamné aux vides
L’archivage numérique comporte forcément des vides, et c’est peut-être ce qu’il reste de poésie ou d’humain au numérique.
L’ouvrage emblématique de Tschichold, La Nouvelle Typographie (1928) est un véritable manifeste pour la modernité, analogue dans son domaine au livre du Corbusier Vers une architecture. Prenant la forme d’un manuel, l’auteur y fait table rase de la typographie ancienne qui ne trouve grâce à ses yeux que dans son contexte historique, maintenant dépassé.
Éditions Entremonde, La Nouvelle Typographie de Jan Tschichold
Les Éditions Entremonde publie une traduction française du livre emblématique de Jan Tschichold, La Nouvelle Typographie, et c’est un événement en soit.
Pour rappel, B42 avait publié un livre résumant la querelle entre Max Bill et Jan Tschichold, Max Bill / Jan Tschichold. La querelle typographique des modernes, dont la source de ces échanges était justement La Nouvelle Typographie et le changement de position de Jan Tschichold. J’avais réalisé une chronologie pour mieux appréhender ce texte : Max Bill, Jan Tschichold : une chronologie.
Via Emmanuel.
Mais dans ma tribu, la forme qui pourrait être la plus visible est le lien… hypertexte !
Pep, Ces liens qui nous (ré)unissent
Plusieurs billets se suivent autour des carnets web, des liens entre ceux-ci, et de la blogroll – cette liste de liens qui permet de signaler les carnets et blogs amis :
À la suite de mon lighting talk Le fanzinat des gens du web j’ai publié une liste OPML de carnets web, à compléter sur GitHub : https://github.com/antoinentl/les-carnets-des-gens-du-web
Au même moment, les 24 jours du web sont cette année décentralisés.
Blog posts should be accessible to everyone too though and we haven’t spoken enough about how we should all be doing this. I’ve pulled out the things that blog owners and admins will need to consider in almost every post they publish.
They definitely don’t make up an exhaustive list, but they’re a start.
Amy McNichol, How to make blog posts accessible
Quelques recommandations pour rendre un billet de blog accessible, proposées par Amy McNichol du GDS Digital Engagement. Classiques mais claires et bien formulées :
Les réseaux sociaux sont de grands dévorateurs d’énergie, d’optimisme et de temps. Ce sont des machines impitoyables. Ces machines se nourrissent de notre force, elles l’aspirent, jouent sur nos ambitions, notre peur du vide, notre besoin de reconnaissance et d’être aimés.
Neil Jomunsi, Vous êtes sur la messagerie de Neil Jomunsi, laissez un petit mot après le bip…
Neil Jomunsi quitte les réseaux sociaux, dégoûté. Sa critique est juste, attendons de voir ce qui en adviendra !
TypoDiplo, le site des usages du Monde diplomatique, a été créé par les correcteurs et l’équipe Internet du journal. Il ambitionne d’être une référence originale aussi bien en matière orthotypographique que pour des données géopolitiques. Depuis décembre 2016, il est proposé librement aux internautes.
TypoDiplo
Belle initiative du Monde diplomatique qui met à disposition ses règles typographiques. Le site est basé sur SeenThis, service de short-blogging.
Avant de transférer un livre numérique sur ma liseuse, la plupart du temps je le modifie pour l’adapter à mes préférences, et aux limitations logicielles.
Emmanuel Clément, Un epub neutre
Emmanuel reprend les EPUBs avant de les lire : il les nettoie, les simplifie, pour que sa lecture soit plus confortable. Cela rappelle un peu l’initiative EPUB zéro.
Alors écrivons !
HTeuMeuLeu, En décembre, écrivez et partagez vos articles avec le hashtag #nowwwel
Cette année pas de 24 jours du web, pour cause de manque de réponses à l’appel à auteurs… Mais pour combler ce rendez-vous qui était – pour moi – incontournable, un hashtag : #nowwwel ! À suivre, mais il est également possible de proposer des articles, “une version décentralisée” des 24 jours de web comme le dit si bien STPo.
Today we are launching Telegraph – a publishing tool that lets you create rich posts with markdown, photos, and all sorts of embedded stuff. Telegraph posts get beautiful Instant View pages on Telegram.
Telegram, Instant View, Telegraph, and Other Goodies
Telegram, l’application de communication chiffrée, lance un outil minimaliste pour publier du contenu, Telegraph. Un titre, un auteur et un contenu, le support de Markdown, et un minimalisme qui dépasse Medium.
Ainsi, je propose que chaque ligne de code soit examinée à l’aune de la première formulation de l’impératif catégorique : “Agis de telle sorte que la maxime de ta volonté puisse toujours valoir en même temps comme principe d’une législation universelle.” Et hop, c’est réglé.
Xavier de La Porte, L’histoire du développeur qui aurait dû lire Kant
Optimizing web pages for print is important because we want our sites to be as accessible as possible, no matter the medium.
Manuel Matuzovic, I totally forgot about print style sheets
Quelques conseils pour développer une version imprimable d’une page web.
Version française disponible : CSS : n’oubliez pas l’impression papier!.
Every file reference you insert adds a block of content to your document, be it an image, table, or plain text file. These content blocks can then be ordered, stacked and chained with ease.
iA Writer 4
iA présente la nouvelle version de son application iA Writer : à l’origine il s’agissait d’un éditeur de texte supportant le Markdown, avec un goût prononcé pour la simplicité et l’efficacité, désormais cela ressemble de plus en plus à une chaîne de publication. iA annonce un nouveau concept pour cette application : la transclusion. Cela permet d’intégrer des documents dans un document, et ceci simplement avec un chemin vers le fichier concerné (image, autre fichier Markdown, tableau au format CSV, etc.). Un workflow simple et efficace. Le concept, et son application, son très prometteurs !
We think this syntax is a natural extension to Markdown, and it would please us to see other apps use it too.
The reading experience will get even better with the Windows 10 Creators Update! In addition to providing a great reading experience for PDF files – you can now read any unprotected e-book in the EPUB file format with Microsoft Edge.
Dona Sarkar, Announcing Windows 10 Insider Preview Build 14971 for PC
Le navigateur Edge de Microsoft Windows est donc capable de lire un fichier EPUB, sans application ou extension particulières, c’est une très bonne nouvelle !
GitHub a une approche du travail très particulière et étant donné que je me suis démené dernièrement pour décrire cette culture à mes collègues, j’ai décidé de documenter quelques-uns des points communs que j’ai pu identifier à plusieurs reprises chez les GitHubbers les plus performants.
Ben Balter, Les sept habitudes des gens super efficaces chez GitHub
Frank Taillandier propose une nouvelle traduction d’un article écrit initialement en anglais : Ben Balter présente plusieurs des qualités communes qu’il a remarqué chez les personnes travaillant chez GitHub, et principalement sous l’angle de la performance :
Reading Systems constrain your performance budget and if you’re not careful enough, your users will suffer. We’re glad to help with this checklist!
The eBook Performance Checklist
Jiminy Panoz propose une checklist pour la performance des livres numériques au format EPUB : une application web sous forme de liste de points à cocher, accompagnés d’explications précises et synthétiques. Bien pratique pour ne pas oublier les points essentiels de la performance des EPUBs !
À noter que cette checklist est un site web qui peut être installé et utilisé hors ligne sur Android, c’est un exemple de Progressive Web Application.
Proteus is a collection of useful starter kits to help you launch your static site or prototype faster.
Proteus
Deux kits pour démarrer facilement, et rapidement, un projet à base de générateur de site statique : avec Middleman ou Jekyll.
Via Jamstatic-fr.
New way to read & write Markdown.
typora
typora est un éditeur Markdown qui permet d’utiliser cette syntaxe tout en la visualisant – ce qui est d’habitude séparé en deux étapes et deux écrans est ici rassemblé. Cette application fonctionne sur Linux, Windows et Mac.
Via Anthony Masure.
At the Getty, I’m building a platform (working title: Octavo) for publishing digital art books. The goal is to generate multiple book formats (web, PDF, EPUB, print on demand) from a single set of text files.
Eric Gardner, Building Books with Middleman Extensions
Eric Gardner, designer et développeur pour Getty Publications, a choisi d’utiliser un générateur de site statique pour fabriquer des livres, un choix disruptif mais fonctionnel !
Our digital publications team came up with an innovative solution, which presents the content as a responsive website and paperback and offers free downloads of the book as EPUB, MOBI, and PDF, as well as exports of catalogue data and image sets. Under the hood for all these is a static-site generator that unites images and style sheets with text files that contain the entire content of the book.
Ruth Evans Lane, An Editor’s View of Digital Publishing
Ruth Evans Lane, de Getty Publications, la maison d’édition de The Getty (institution, musée, etc.), expose sa chaîne de publication pour l’édition papier et numérique. Basée notamment sur Markdown, Git et Middleman, ce workflow est original pour une maison d’édition, il reprend les principes des générateurs de sites statiques et de la JAMstack. J’espère pouvoir faire une série d’articles pour expliquer plus longuement ce principe.
Via Frank Taillandier.
The editing craft is timeless, but e-books require new tools and new workflows
So, I decided to create a “Progressive Web Application” for this blog.
Ire Aderinokun, “Offline First” with Service Worker (Building a PWA, Part 1)
À travers trois articles complets, Ire Aderinokun donne toutes les informations nécessaires pour la fabrication d’une PWA.
The member organizations of the International Digital Publishing Forum (IDPF) have overwhelmingly approved, by a margin of 72 (88%) in favor to 10 (12%) opposed, a plan proposed by the IDPF Board of Directors to combine IDPF with the World Wide Web Consortium (W3C). The plan will now proceed, with anticipated completion of the combination by January, 2017 still subject to finalization of the necessary definitive agreements.
IDPF, IDPF Members Approve Plan to Combine with W3C
La fusion annoncée entre le W3C et l’IDPF est donc désormais officiellement actée, après quelques remous dans le milieu – oppositions affirmées de grands groupes d’édition.
Les narratifs semblent être intrinsèques à l’espèce humaine : toutes les cultures en tout moment et en tout lieu ont utilisé les récits. Et maintenant les humains sont confrontés à une ressource additionnelle : les bases de données, par le biais des ordinateurs. Certains théoriciens, comme Manovich, considèrent les narratifs et les bases de données comme des ennemis naturels, mais dans nos sociétés contemporaines je ne pense que ce soit des ennemis naturels, ce sont des combinaisons synergétiques. Je pense qu’avec la littérature électronique, beaucoup d’oeuvres de littérature aujourd’hui crée des narratifs, des récits, grâce à des bases de données. Ce ne sont plus des ennemis de ce point de vue là, ce sont des associés dans la compilation d’un travail littéraire.
Katherine Hayles, Bien penser à l’ère numérique
Pendant 28 minutes Katherine Hayles répond aux questions de Sylvain Bourmeau, dans l’émission La Suite dans les idées sur France Culture. Et cela donne une forte envie de lire l’ouvrage de Katherine Hayles, Lire et penser en milieux numériques.
Hopefully my website will even outlive me, too. That’s because I don’t want my presence online to resolve into a tacky business card once I’m gone — I’m an XYZ in San Francisco — instead, I want it to be an archive of everything that I’ve ever thought was worth keeping around. All the things I’ve pointed at, linked to, discussed, argued about. Once I’m gone I want this place to be an archive of all the things I’ve ever loved, even if they were messy and fragile and a little broken.
Robin Rendle, Blogging and Atrophy
Robin Rendle réagit suite à l’article de Jeremy Keith, A decade on Twitter, et souligne l’importance de disposer de son propre espace sur le web – en dehors des silos fermés des réseaux sociaux –, et de ne pas en faire simplement une carte de visite professionnelle. Robine Rendle parle de flux et d’archive, je le rejoins largement sur cette dualité – nécessaire.
Once I’m gone I want this place to be an archive of all the things I’ve ever loved, even if they were messy and fragile and a little broken.
Web fonts are okay. They make your blog prettier. They’re also slow and kind of an annoying experience, but if you need to use them, use them. Just remember that it’s also your responsibility to make your site load super fast, and if you don’t, it’s totes fair game for people (me) to whine about it on Twitter.
Monica Dinculescu, Web fonts, boy, I don’t know
Un court article sur les web fonts et la performance.
Variable fonts will save significant space in apps and operating systems, cutting down on download speeds, load times, and server costs. They’ll make the web typographically richer, and give designers new tools to create beautiful designs. Variable fonts will also help create single fonts that work as well on large screens, like desktops, as they do on modern devices with small screens, like wearables.
John Brownlee, Google, Apple, Adobe, And Microsoft Are Quietly Developing A New Type Of Font
Les variable fonts arrivent, et elles devraient permettre de résoudre beaucoup de problèmes de design – côtés dessinateurs de caractères et designers graphiques – et de performance – surtout côté web.
The GitLab Workflow is a logical sequence of possible actions to be taken during the entire lifecycle of the software development process, using GitLab as the platform that hosts your code.
Marcia Ramos, GitLab Workflow: An Overview
Plongée dans le workflow de GitLab, la plateforme d’hébergement de codes : étapes des développements, gestion des issues, utilisation de git, etc.
Car vingt ans après les premiers pas de l’archivage, si d’énormes progrès ont été faits, de nombreuses questions se posent encore. Le Web ne cesse d’évoluer, et complique la tâche des archiveurs.
Morgane Tual, Vingt ans d’archivage du Web : les coulisses d’un projet titanesque
L’archivage du web est presque aussi vieux que le web lui-même, Morgane Tual nous propose de plonger dans les structures et institutions qui opèrent cette tâche délicate.
4G Will Be Everywhere Soon — Wrong […]
Developer Experience Is More Important Than UX — Wrong […]
Technical Architects Don’t Know What They Need — Wrong […]
Offline Is For Rare Scenarios — Wrong […]
Local Data Is Only For Offline — Wrong […]
Offline Can’t Be Done With Current Standards — Wrong […]
Tiago Simões, I Was Wrong About Offline
Un article assez court sur ce qu’est réellement le hors ligne, avec quelques éléments que j’avais soulignés par ici.
Via Jiminy Panoz.
À l’heure du tout numérique, certains sont encore attachés aux ouvrages en bel et bon papier !
arte, La sensualité des livres
Au-delà de l’accroche maladroite, ce documentaire présente brièvement des approches intéressantes : Steidl, Irma Boom, et même Jan Tschichold.
View a website’s skeleton by resetting all styling to browser default.
structure.exposed
Une façon simple de voir ou visualiser un site web avec la feuille de style par défaut de votre navigateur préféré, et donc de voir comment les contenus sont structurés !
A curated list of Markdown software, libraries and resources.
Awesome Markdown
Voici une page de ressources sur Markdown, le langage de balisage simple et efficace : applications, extensions, bibliothèques, tutoriels, etc.
Via Frank.
My plea to designers and software engineers: Ignore the fads and go back to the typographic principles of print — keep your type black, and vary weight and font instead of grayness. You’ll be making things better for people who read on smaller, dimmer screens, even if their eyes aren’t aging like mine. It may not be trendy, but it’s time to consider who is being left out by the web’s aesthetic.
Kevin Marks, How the Web Became Unreadable
Kevin Marks fait un constat sombre (sic) : le web est devenu illisible du fait de choix esthétiques qui ne permettent pas une bonne lisibilité des contenus, selon la situation des utilisateurs, le matériel et le contexte.
Progressive enhancement. Because sometimes your JavaScript just won’t work.
Be prepared.
Everyone has JavaScript, right?
Le débat est régulier, est-ce qu’il faut partir du fait que tout le monde a JavaScript ? Mauvaise question ! Beaucoup d’éléments sont à prendre en compte, et donc il vaut mieux privilégier une amélioration progressive, ou une utilisation dégressive.
À lire également, That “JavaScript not available” case par Christian Heilmann.
Without your consent most major web platforms leak whether you are logged in. This allows any website to detect on which platforms you’re signed up. Since there are lots of platforms with specific demographics an attacker could reason about your personality, too.
Your Social Media Fingerprint
Certaines plateformes web utilisent une méthode simple pour vérifier si l’on est connecté à un service – Gmail, Paypal, Twitter, etc. À découvrir !
6 nouveaux services et une annonce majeure pour attaquer la 3e – et dernière – année de notre (modeste) plan de libération du monde… De moins en moins modeste : déjà trente services à ce jour !
Framasoft, Dégooglisons saison 3 : 30 services alternatifs aux produits de Google & co
Framasoft continue de mettre en place des alternatives aux services de Google et autres plateformes en ligne, et c’est impressionnant.
6 nouveaux services et une annonce majeure pour attaquer la 3e – et dernière – année de notre (modeste) plan de libération du monde… De moins en moins modeste : déjà trente services à ce jour !
Twitter, Rendre les images accessibles aux utilisateurs malvoyants de Twitter
Twitter propose désormais aux utilisateurs – après une activation dans les paramètres – de décrire les images partagées : 420 caractères pour compléter l’attribut alt de la balise img, ou pour contourner la limitation des 140 caractères.
Standards work is political—people with different interests, perspectives, and goals trying to agree on what should be done.
Dave Cramer, Thirteen Ways of Looking at Ebook Standards
La fusion de l’IDPF et du W3C révèle des tensions jusque-là étouffée, Dave Cramer rappelle les enjeux et contraintes pour travailler autour des standards.
La réalité est autre, mais il faut avoir le goût de l’observation pour la reconnaître.
Joël Faucilhon, N’espérez pas vous débarrasser du livre numérique
Plusieurs articles récents font le constat que, pour le livre numérique, la fête est finie. Entre une interprétation discutable de chiffres et d’études, il y a surtout un problème de positionnement :
L’article de Joël Faucilhon permet de se (re)mettre en tête une réalité que certains éditeurs ou médias oublient un peu vite.
EPUB exists because the web doesn’t allow us to easily speak about collections of documents.
Hadrien Gardeur, Web Publication Manifest
Depuis quelques jours Hadrien Gardeur expérimente différentes applications pour permettre la lecture d’EPUBs (le format du livre numérique), directement dans le navigateur. À tester, à observer de près, pour contribuer à ces projets qui poussent le livre numérique dans le web.
Voici un exemple de Web App : https://hadriengardeur.github.io/webpub-manifest/examples/viewer/
The most accessible format for any content on the web is plain text.
Ire Aderinokun, Alternative Text and Images
Pour rendre une image accessible, il y a l’attribut alt de la balise img, cet article regroupe tout ce qu’il faut savoir sur l’alternative textuelle !
A typeface five years in the making, Google Noto spans more than 100 writing systems, 800 languages, and hundreds of thousands of characters. A collaborative effort between Google and Monotype, the Noto typeface is a truly universal method of communication for billions of people around the world accessing digital content.
Emma Tucker, More than 800 languages in a single typeface: creating Noto for Google
Google – et Monotype – travaillent depuis plusieurs années sur ce projet : concevoir et produire la fonte la plus complète qui soit. Beau projet.
C’est ce que je voudrais explorer dans ce petit livre : comment saisir le potentiel positif de l’informatique connectée sans devenir victime de la surveillance de masse. Au-delà des dénonciations, il me semble important de comprendre les ressorts de l’usage de nos traces, mais également de montrer les outils et les méthodes qui permettent de conserver une part de libre arbitre dans nos usages numériques.
Tristan Nitot, Surveillance://
C&F éditions publient le livre de Tristan Nitot, Surveillance://, commencé sur le blog de Tristan il y a plus d’un an, remis en forme et retravaillé pour cette édition. Un livre important pour comprendre ce que nos usages du numérique impliquent aujourd’hui. (Et j’ai participé à la production de la version EPUB de ce livre.)
Pour en savoir plus sur le livre et l’auteur :
The goal of this document is to help operational teams with creating secure web applications.
Mozilla, Security/Guidelines/Web Security
Un outil pratique pour avoir une vision d’ensemble des questions de sécurité de sites ou applications web. À appliquer ou à connaître – et faire connaître – selon là où l’on intervient.
This is not about having the biggest body text, because biggest isn’t best. It’s about optimizing for the best reading experience you can possibly give your users, and smaller body text doesn’t fulfill that potential.
Christian Miller, Your Body Text Is Too Small
Un article qui traîte trois points de la question – essentielle – de la taille du texte sur le web : constats et histoire, pourquoi les textes devraient être plus, quelques conseils – typographiques – pratiques.
The dos and don’ts of designing for accessibility are general guidelines, best design practices for making our services accessible.
Karwai Pun, Dos and don’ts on designing for accessibility
Six posters pour concevoir en prenant en compte l’accessibilité : ce qu’il faut faire et ce qu’il faut éviter dans des cas pratiques et concrets pour les personnes en situation de handicaps – dont l’autisme ! Clairs, concis, des outils très utiles !
Une version française de ces posters est également disponible : https://github.com/UKHomeOffice/posters/tree/master/accessibility/posters_fr.
Au-delà d’être une plateforme où distribuer leurs contenus, Medium semble donc surtout pour l’instant être un laboratoire d’engagement et d’échange pour les médias.
Guillaume Galpin, Medium : quelles perspectives pour les médias ?
Analyse de Medium avec le regard d’InaGlobal, et pour résumer Medium ne semble pas dépasser l’intention, pour l’instant.
Avec Bertrand, nous voulions surtout partager nos retours d’expérience et le plaisir retrouvé que nous avions à apprendre et à concevoir itérativement des sites de qualité où le contenu est roi. Donner envie aux développeurs front de reprendre la main sur leur code tout en proposant une expérience optimale aux utilisateurs.
Frank Taillandier, Ne passons pas à côté des choses simples
Passer d’un backend lourd à un worklow basé sur des fichiers statiques standards : un sujet passionnant que la modification des processus de travail des développeurs web, abordé avec succès par Frank Taillandier et Bertrand Keller lors de Paris Web 2016.
Le support de leur présentation est également disponible en ligne.
We didn’t learn anything from the web.
Jiminy Panoz, Why the web should take a look at eBooks
À l’occasion de Paris Web 2016, Jiminy Panoz a proposé une mini-conférence de 15 minutes intitulée “Pourquoi le web devrait s’intéresser au livre numérique”, en explorant des points de convergence entre web et livre numérique. Jiminy a également mis en ligne sa présentation : https://jaypanoz.github.io/pw2016/.
Qui exploite nos données ? Comment sont-elles exploitées ? Quelle est notre responsabilité là dedans ? Et quelles sont les mesures à prendre pour protéger la vie privée de “nos” internautes.
Thibault Jouannic, Anatomie d’une désintoxication au Web sous surveillance : la conf Paris-Web
Le transcript complet de la conférence – lumineuse – de Thibault Jouannic lors de Paris Web 2016.
I cannot say how much I learned from this event [Paris Web]. I used to say that I could learn more in two days at ParisWeb than in 6 months of technical watch on my own, reading blogs. That’s the conference that made me the web developer I am today. It has this incredible energy, this special #sharethelove mood.
Tim Carry, Searching the ParisWeb conferences
Quelques jours (semaines ?) avant Paris Web, Tim Carry propose un outil pour naviguer et rechercher dans 10 ans de conférences Paris Web. Au-delà de l’utilité sur le fond, c’est un bon exemple de ce que l’on peut faire avec un workflow statique, sans base de données, mais avec un service web axé sur la recherche. Ça va vite !
Not all of your customers are going to have your app installed. For those who visit via the web, providing them with a better experience will make them happier and generate more revenue for your business.
It’s really that simple.
Jason Grigsby, Progressive Web Apps Simply Make Sense
Un énième discours ventant les mérites des Progressive Web Apps, axé sur l’aspect économique de la chose :
The inaccessible web doesn’t need to stay the way it is. As front-end developers you have an important, powerful role in making the web the inclusive place it should be.
Mischa Andrews, Developers: get started with web accessibility
Un article qui vise à convaincre les développeurs front-end de produire des objets numériques accessibles, en quelques points facilement applicables :
Performance is not an afterthought, it’s a main objective. And I hope I have convinced you that you should care.
Jiminy Panoz, Let’s talk about eBook performance
Jiminy Panoz soulève un sujet peu abordé dans le domaine du livre numérique : la performance. Il attire l’attention sur un point essentiel de l’expérience utilisateur, souvent délaissée par les producteurs/développeurs de livres numériques – au détriment des éditeurs…
How many of us, eBook producers, actually have a precise idea of mobile apps’ or eInk Readers’ performance? Can you list CSS or JS bottlenecks? Do you define rules or best practices based on performance? Do you know how Reading Systems work? Really?
Une véritable révolution s’est bel et bien opérée dans nos pratiques de lecture et d’écriture, moins par le fait d’un nouveau medium que par celui d’un nouveau concept appliqué à un nouveau medium. Ce n’est pas l’ordinateur lui-même qui a changé pour toujours la linéarité du texte – c’est la possibilité, grâce à des logiciels, de créer dans l’espace numérique abstrait une structure de texte absolument nouvelle et fonctionnelle : l’hypertexte.
Alessandro Ludovico, Post-Digital Print, page 29
Inspiring the Web with just 10k
10K Apart, Project Gallery
Un certain nombre de projets du concours 10K Apart sont déjà visibles en ligne, certains sont très inspirants !
Si vous n’avez pas honte de la première version de votre produit, c’est que vous l’avez lancé trop tard. Pas besoin que ce soit parfait ou complet. Ça ne devrait pas l’être pour tout dire. Publiez tôt, publiez souvent.
Ben Balter, 10 façons de rendre un produit excellent
Frank Taillandier publie une traduction de 10 ways to make a product great de Ben Balter, ce dernier propose 10 points très clairs pour rendre un produit excellent, avec à chaque fois des exemples issus de son expérience de GitHub Pages – le service d’hébergement de sites web de GitHub.
C’est très sérieux. C’est LE grand expert de la cybersécurité Bruce Schneier qui l’a écrit sur son blog hier “quelqu’un est en train d’apprendre à détruire Internet” ce sont ses mots. Quand Bruce Schneier dit quelque chose comme ça, il faut mieux y prêter attention…
Xavier de La Porte, Quelqu’un se prépare à détruire Internet
Internet serait détruisible ?… Une partie de l’infrastructure, oui.
All that breadcrumbs do is make it easier for visitors to move around the site, assuming its content and overall structure make sense. It’s one of the few simple things that enhances usability and fosters user comfort. And that’s sufficient contribution for something that takes up only one line in the design.
Nick Babich, Breadcrumbs For Web Sites: What, When and How
Des conseils à suivre et des écueils à éviter concernant les breadcrumbs – fil d’Ariane en français –, un élément essentiel de la navigation sur des sites complexes.
Quoi qu’il en soit, cet outil Mozilla Observatory arrive à point nommé, il met en exergue certains efforts à fournir pour proposer des sites toujours plus sûrs, et s’inscrit parfaitement dans une démarche de qualité et d’amélioration continue. Bien entendu, la sécurité de vos sites ne s’arrêtera pas là.
Nicolas Hoffmann, Obtenir une bonne note sur Mozilla Observatory : HTTPS/CSP/SRI/CORS/HSTS/HPKP/etc.
Nicolas Hoffmann explique – patiemment – comment améliorer la sécurité de sites web que l’on administre, au moment où Mozilla met un outil de vérification à disposition : https://observatory.mozilla.org/.
But the truth is this: you can’t and won’t be able to count on the local operating system of every device to support all of the languages demanded by a truly worldwide web.
Richard Fink, Webfonts on the Prairie
Un débat récurrent dans le milieu du web : les webfonts sont-elles une fausse bonne idée ? Cet article n’apporte pas de réponse, mais pointe – malgré l’intention initiale de l’auteur – la complexité de la question…
Strapdown.js makes it embarrassingly simple to create elegant Markdown documents. No server-side compilation required. Use it to quickly document your projects, create tutorials, home pages, etc.
Artur Adib, Strapdown.js
Une façon simple d’intégrer des données structurées en Markdown dans un fichier HTML, pour obtenir une page HTML – cela nécessite du JavaScript, mais sans avoir de compilation côté serveur. C’est très intéressant, même si les usages semblent limités en pratique. Et le problème principal vient de l’utilisation de JavaScript.
[…] si vous lisez ces lignes sur papier (ce qui est certainement le cas), c’est donc que vous avez, pour une raison ou pour une autre, choisi d’utiliser le “vieux” medium. Pourquoi ? Probablement parce qu’il propose toujours la meilleure “interface” jamais conçue à ce jour.
Alessandro Ludovico, Post-Digital Print, page 7
Here is the complete list of tools I use when I design in the browser using css and html.
Adam Morse, Tools I Use for Designing in the Browser
Adam Morse livre sa liste d’outils pour designer des sites web, une dizaine au total, sans oublier du papier et un crayon.
These are some common causes of design, scalability, performance and maintainability issues I find when refactoring CSS for clients
Mariano Miguel, Common CSS Mistakes (And How To Fix Them)
Une petite liste d’erreurs CSS souvent commises, avec des solutions pour les éviter facilement. Des erreurs techniques qui proviennent bien souvent de problèmes de conception !
As a result, brutalism is compelling, if for nothing else than to provide an alternative to the safe confines of design conventionalism.
Marc Schenker, The rise and rise of the brutalist design trend
Depuis quelques mois, et surtout depuis la création du site web www.brutalistwebsites.com, le design brutaliste est en vogue. Et pourtant ce n’est pas nouveau, mais, comme l’explique Marc Schenker, probablement plus visible.
Designers have realized that front-end code is not that much more complicated than mastering Sketch or Illustrator and a knowledge of their materials (browsers, native apps) strengthens their design.
Engineers have realized that there is a relationship between systematic design pattern thinking and creating DRY code, that there is a mathematic elegance to typographic theory and they can express it in code.
Organizations understand that designers and the people who realize those designs should have a shared context, timeframe, language, and incentives.
Jory Cunningham, Design Technologists: Front-End Development in the Design System Era
Qu’est-ce qu’un Design Technologist ? Jory Cunningham y répond : ce n’est pas un développeur web full stack mais la personne qui saura accorder une équipe de designers, de graphistes, de développeurs front end, de développeurs back end, autour de projets numériques/web.
Design Technologists bring a constructive pessimism to the design process.
It gives us great pleasure to announce the 2016 10k Apart competition. Create a fully functioning website in 10 KB or less! Amaze your friends! Astound the world! Compete for fabulous prizes!
Jeffrey Zeldman, Another 10k Apart: Create a Website in 10 KB, Win Prizes!
A List Apart lance un concours, la règle : créer un site web fonctionnel avec 10Kb de fichiers maximum, et sans JavaScript ! Un retour aux bases, avec un accent sur la performance, l’accessibilité et le lazy load, excitant ! Toutes les informations sur le site de l’événement : https://a-k-apart.com
[…] moi finalement ce qui me surprendrait le plus, après 8 ans d’Internet et maintenant que l’e-mail s’est généralisé, que les outils techniques se sont simplifiés (comme ce spip sur lequel j’écris ici), pourquoi aussi peu d’auteurs se soient lancés dans un site personnel qui paraîtrait presque comme une politesse : documentation, archives, dialogue, pourquoi aussi peu d’auteurs dans ceux qui me sont les plus proches se sont jamais sentis l’envie de mettre simplement la main à la pâte…
François Bon, où en sont les pionniers du Net
François Bon fait le point, en fêtant 20 ans de connexion internet, sur la place des auteurs, des livres, des textes sur internet et sur le web.
What we need then is a way to incubate ideas, build prolyfills and somehow get lots of eyeballs, use and participation. We need to see what sticks, and what can be better. We need ideas to fail safely without breaking the economics of participation or breaking the Web.
Brian Kardell, The Future Web Wants You.
À propos du web et des standards, et de comment avancer en travaillant de concert.
We abandoned the expectation that users are experts. Anyone should be able to figure out how to use AS, even if it’s their first time visiting.
Ali Torbati, Death to Complexity: How we Simplified Advanced Search
Comment repenser une interface de recherche avancée ? Ce cas concret permet de voir quels choix – simples – sont faits, entre des designers, des intégrateurs et des développeurs.
Markdown est le format par défaut des contenus dans la plupart des générateurs de site statique et il devrait devenir aussi le format par défaut dans lequel vous rédigez vos notes, vos rapports, vos articles de blog ou vos livres.
Frank Taillandier, Traitement de texte multicanal
Frank Taillandier a traduit l’article d’iA, Multichannel Text Processing, quelques jours avant que je publie la traduction que j’ai réalisée du même texte, avec l’aide de plusieurs personnes. Heureux hasard qui permettra une fusion des versions !
Raconter les internets en musiques, c’est traverser cinq décennies et révéler un nouveau monde, rêvé puis numérisé, connecté, démultiplié, surveillé et peut-être demain réinventé. Un voyage sonore dans une réalité tout sauf virtuelle qui façonne aujourd’hui nos sociétés.
France Culture, Voyage dans les internets
Cinq épisodes qui retracent l’histoire d’Internet, en musique, à écouter absolument !
Après deux années de travail, j’ai le plaisir de vous annoncer la parution de la deuxième édition du livre qualité Web aux éditions Eyrolles.
Élie Sloïm, Qualité Web, deuxième édition
Un ouvrage qui aborde les questions de bonnes pratiques et de qualité web, mais aussi –notamment – d’accessibilité et de performance !
When designers code their own site they have total control.
Donny Truong, Do Designers Create Their Own Site Anymore?
Est-ce que les designers ne devraient pas coder leur site web personnel plutôt que de se reposer sur des plateformes comme Squarespace ou Adobe Portfolio ? Définitivement oui. Mais cela ne veut pas forcément dire créer un CMS complet ou écrire une feuille de style complexe from scratch, il y a des frameworks et des bibliothèques qui existent, à chacun d’explorer les possibilités du web.
Over the years I’ve come to realize that most difficult part of making websites isn’t the code, it’s the “hidden expectations”, the unseen aspects I didn’t know were my responsibility when I started: Accessibility, Security, Performance, and Empathy.
Dave Rupert, Hidden Expectations
Dave Rupert explore les faces cachées du web – l’accessibilité, la sécurité, la performance et l’empathie –, et pose la question de la difficulté d’être généraliste :
Becoming a generalist in these areas can be difficult.
NASA just announced that any published research funded by the space agency will now be available at no cost, launching a new public web portal that anybody can access.
Peter Dockrill, NASA just made all the scientific research it funds available for free
Cela semble assez incroyable, vu d’ici, mais la NASA ouvre totalement ses recherches ! C’est un signal fort en faveur de l’Open Access.
Static site generators are wonderful, even when they have to deal with work for which they weren’t initially created.
Stefan Baumgartner, Using A Static Site Generator At Scale: Lessons Learned
Stefan Baumgartner présente le retour d’expérience d’une utilisation d’un générateur de site statique – Jekyll –, pour un site web de plus de 2000 pages et 40 auteurs ! La stack complète est détaillée, un imposant workflow qui permet de faciliter la rédaction et la gestion des contenus (Markdown + Git), de produire des pages et un site web léger (Jekyll), et de faciliter le travail des développeurs et webmasters (Liquid).
La partie “Editing With A Static Site Generator” est notamment très instructive !
On parle de dématérialisation, mais en réalité le livre électronique est toujours rematérialisé. Il est dématérialisé pendant un moment parce qu’il est sous forme de flux, et puis il arrive sur un terminal. Le terminal peut être le livre.
Imaginez que je sois un chercheur, et que je consulte sur une base de données quinze articles sur la couleur rouge, qui est mon objet d’étude. À titre personnel, si on me propose un service d’impression d’un volume sur la couleur rouge que je compose pour moi – avec ces quinze articles –, et qu’on me l’envoie par la Poste, je trouve cela confortable. C’est une des revanches possible du livre au format papier. C’est un terminal de lecture comme un autre.
En revanche si je ne peux pas avoir un petit moteur de recherche qui me permette d’indexer les 15 articles en question, je suis frustré par ce que j’ai aussi besoin de pouvoir faire de l’exploration de données. Et donc il est évident que les deux vont cohabiter et que de nouvelles formes d’imprimés vont se développer.
Marin Dacos dans l’émission Place de la toile spéciale édition numérique en 2009
En 2009, Xavier de La Porte consacrait une émission spéciale de Place de la toile à l’édition numérique, avec Marin Dacos, Virginie Clayssen et Hubert Guillaud. 7 ans plus tard – oui ça passe vite –, les choses ont changé, et en même temps pas tant que cela ! À réécouter cette émission d’une heure, on se prend à rêver à certains scénarios présentés par ces trois veilleurs et experts du livre numérique, il y a encore du chemin à faire (principalement sur l’expérience de lecture, la médiation et l’offre).
(Merci à celui ou celle qui a déposé le podcast sur archive.org !)
According to Tschichold, however, books designed in the 19th century were for the people and the technology of the time; they solved problems that were entirely inapplicable to the needs of his own century a hundred years later.
Robin Rendle, The New Web Typography
En février 2016, Robin Rendle proposait un long article sur la “nouvelle typographie web”. En partant de La nouvelle typographie de Jan Tschichold, puis en abordant la question du design numérique, Robin Rendle interroge notre rapport à la typographie sur le web et la façon dont nous mettons en forme les textes que nous lisons sur écran.
Lecture, édition, typographie, design, les points d’entrée de ce texte sont nombreux.
Quelques citations :
[…] with the web, it’s hard not to dream of a Utopian media format.
I’m interested in what happens to typography, or the mechanical process of setting letters into legible text, when we design interfaces on top of flimsy networks and unpredictable browsing environments. I think these technical implications have drastic consequences on how designers and developers ought to see the art of typography itself.
[…] I think we need a guide of some description, we need rules for this new form of typography and in order to make these rules I think we need to return to Jan Tschichold and his “common, everyday book.”
Principles of the New Web Typography:
- We must prioritise the text over the font, or semantics over style.
- We ought to use and/or make tools that reveal the consequences of typographic decisions.
- We should acknowledge that web typography is only as strong as its weakest point.
The New Web Typography demands to be seen; bad typography is better than none at all.
Atom (RFC 4287) est l’un des formats XML qui permet d’avertir et de distribuer les mises à jour de votre site Web. Il a été conçu afin de réduire les ambiguïtés du format RSS 2.0. Après de longues batailles, les acteurs professionnels des outils traitant les flux RSS ont atteint un consensus à l’IETF en décembre 2005.
Karl Dubost, Comment construire un flux Atom ?
Karl Dubost proposait, en 2013 et sur Open Web, un mode d’emploi complet pour constuire convenablement un flux Atom, et c’est assez simple à suivre !
Via Nicolas Hoffmann.
[…] this is what will happen to most AMP URLs: AMP URLs will break.
Anselm Hanneman, How AMP supercharges link rot
AMP, ce système mis en place par Google pour améliorer les performances des sites web – principalement de presse, permettant au passage aux éditeurs de mieux placer des publicités –, pose un vrai problème de pérennité.
Accessibility is something you have to think about with every new bit of content added to your site. It can’t be an afterthought. However no site is perfect so you as long as you a making incremental improvements and reacting to feedback you are doing a good job.
Peter Brumby, Why web accessibility benefits us all
Quatre critères d’accessibilité présentés et expliqués, dans le but de montrer combien l’accessibilité web est bénéfique pour tous le monde, et pas uniquement pour les personnes en situation de handicap.
The only thing design can do is facilitate the access, consumption, or interaction of that content. Design is simply a function with content as an input.
Jeremy Thomas, Web Design in 4 minutes
Jeremy Thomas a créé une page qui explique, en quatre minutes, ce qu’est le web design – ou design web. C’est interactif et très pédagogique, à mettre entre toutes les mains ! Jeremy explique sa démarche par ici.
Via la Web Development Reading List.
Icons are weak at transporting exact meaning, but powerful at transporting emotion.
Oliver Reichenstein on Icons - UX Chat
Cet entretien d’uxdesign.cc avec Oliver Reichenstein d’iA aborde la question des icônes, dans le cas de l’UX design.
Cet entretien n’est pas un texte linéaire : il prend la forme d’une conversation entre le chatbot d’uxdesign.cc, Oliver Reichenstein et le lecteur. Cette nouvelle forme, dynamique – ou supposée dynamique –, rend le lecteur actif, un peu à la manière des livres dont vous êtes le héros. Cette nouvelle forme, assez disruptive pour un lecteur habitué à un contenu figé, pose beaucoup de questions : quels usages ? quel statut par rapport à un texte classique ? le lecteur a-t-il une certaine liberté ? etc.
Free and liberated ebooks, carefully produced for the true book lover.
Standard Ebooks
Des livres numériques de bonne qualité – traduction, OCR, règles typographiques.
Via iGor
Recently the Internet Archive and Mozilla announced “No More 404s”, an experiment to help you to see archived versions of dead web pages in your Firefox browser.
Mark, No More 404s! Resurrect dead web pages with our new Firefox add-on.
Rediriger les pages 404 vers une version archivée de archive.org, beau projet !
Les Progressive Web Apps sont encore un terrain vierge. C’est maintenant qu’il faut s’y mettre.
Jason Grigsby, L’argumentaire commercial pour les Progressive Web Apps
Frank Taillandier continue de promouvoir les Progressive Web Apps avec cette traduction d’un article de Jason Grigsby. Ce dernier expose très clairement les avantages commerciaux des PWA, avec exemples à l’appui.
Thank you Tim and thanks to all who have, by their efforts, helped to create the Web – from its earliest beginnings, to its inestimable impact on our lives now and for all the exciting ways it will continue to evolve in the future.
Amy van der Hiel, 25 years ago the world changed forever
Le 6 août 1991, Tim Berners-Lee postait un message annonçant le “WorldWideWeb project”. 25 ans déjà.
So what exactly is Background Sync? Well, it is a new web API that lets you defer actions until the user has stable connectivity. This makes it great for ensuring that whatever the user wants to send, is actually sent. The user can go offline and even close the browser, safe in the knowledge that their request will be sent when they regain connectivity.
Dean Hume, ServiceWorker: A Basic Guide to BackgroundSync
Dean Hume présente une fonctionnalité intéressante des Service Workers, permettant de synchroniser des requêtes et pas uniquement des documents ou des fichiers !
Via Jeremy Keith.
Pourquoi innover ? C’est quoi les perspectives d’une civilisation qui préfère innover plutôt que découvrir, inventer ou créer ? C’est quoi l’horizon ?
Xavier de La Porte, La tête dans la toile
Xavier de La Porte définit avec beaucoup de pertinence, et non sans une critique fondée, la notion d’innovation, et le mouvement de fond qui s’opère sur la recherche. Cette chronique est toujours en écoute (ou en lecture) sur France Culture, mais optez plutôt pour l’ouvrage regroupant ses chroniques, “Ce qui nous arrive sur la toile”, publié par C&F Éditions.
Même si des lettres mises en pages et imprimées selon les règles de la discipline peuvent dégager une impression sinistre, cette autorité n’est souvent qu’apparente. L’apport de la typographie est bien plus important : en fixant et en diffusant la langue sous une forme objective et irrévocable, les mots – mais aussi les nombres, pensez aux rapports annuels par exemples, sans oublier les illustrations – sont exposés aux regards scrutateurs et aux esprits critiques. La typographie rend le texte vulnérable.
Gerard Unger, Pendant la lecture, page 209
Les yeux et le cerveau fonctionnent à une vitesse fulgurante et surprenante, et se jouent de nous. Nous avons reconnu et lu les lettres avant même d’en prendre conscience.
Gerard Unger, Pendant la lecture, page 146
Celui qui connaît l’histoire de son domaine d’activité est capable de la prolonger. Celui qui sait d’où viennent les connaissances et les sciences est mieux en mesure de déterminer la direction qu’il souhaite prendre.
Gerard Unger, Pendant la lecture, page 109
La lecture crée son propre silence.
[…]
La naissance du silence s’accompagne d’un autre phénomène prodigieux : non seulement l’environnement semble s’estomper, mais aussi l’objet sur lequel notre attention s’était tout d’abord concentrée. Les caractères d’imprimerie se fondent dans nos pensées comme un comprimé effervescent dans un verre d’eau.
Gerard Unger, Pendant la lecture, pages 49 et 50
Internet, ce n’est pas seulement le téléphone ou la télévision. Internet est un espace où l’on exerce sa décision, en permanence. Celle de cliquer ici ou là, de chercher ceci ou cela, d’aller ici ou là. Si, à la limite, on peut admettre qu’on punisse quelqu’un en le privant temporairement de sa liberté, peut-on vouloir priver quelqu’un de sa capacité à faire des choix, même minuscules, ad vitam ? C’est peut-être cela qu’Internet pourrait éviter.
Xavier de La Porte, La tête dans la toile
From the pros and cons listed above, it seems to me that as soon as a small to medium-sized business or organisation has any budget, Squarespace becomes the natural choice. The rest are either limited in how they integrate with your mailing list (essential) or analytics (less essential but still a common business practice).
Baldur Bjarnason, Which CMS/blog system would you choose?
Dommage que Baldur Bjarnason ne mette pas plus en avant l’argument de la maîtrise de l’outil et des données, dans ce billet sur les choix d’un CMS.
La nouveauté du datajournalisme repose sur le fait qu’une organisation ou un individu peut, avec de très faibles ressources, aller d’un bout à l’autre de la chaîne de création de valeur. C’est la raison pour laquelle le datajournalisme peut se définir comme l’action de mesurer ce qui ne l’est pas encore et qui devrait l’être, tout comme le journalisme traditionnel peut se définir comme l’action de donner la parole aux sans-voix. Le fait de pouvoir, pour toute personne, mesurer un phénomène de manière rigoureuse, est très nouveau. Il permet de concurrencer les mesureurs officiels qui, jusqu’à présent, avaient le monopole de la mesure de la réalité.
Nicolas Kayser-Bril, Informer avec des données structurées
Long texte de Nicolas Kayser-Bril sur les données, à lire.
Comme Morris, on peut constater aujourd’hui une uniformisation de la production graphique. Par ailleurs, la grande majorité des designers utilisent les mêmes outils, créés par la même société (Adobe). L’homogénéisation des outils et celle de la production ne sont-elles pas liées ?
Kévin Donnot, Code = design
À l’origine publié dans le numéro 18 de Graphisme en France, cet article de Kévin Donnot explore les méthodes et outils des designers, et constate que, lorsque la machine n’est pas utilisée comme un outil créatif, il y a des effets d’uniformisation.
Un texte à relire régulièrement.
Les régulateurs européens vont décider prochainement de donner aux grandes entreprises du secteur des télécommunications le pouvoir d’influencer ce que nous pouvons faire ou ne pas faire en ligne. L’Europe a besoin de toute urgence de fixer un cadre clair à la neutralité du Net afin de protéger nos libertés et nos droits sur Internet.
Sauvez Internet
Cela prend vraiment deux minutes : rendez-vous sur https://www.savetheinternet.eu/ et envoyez un message type à votre régulateur national pour que les grandes entreprises ne soient pas favorisés via les fournisseurs d’accès à Internet. En clair : ne pas traiter de la même façon le trafic de n’importe quel site web serait la pire chose qui pourrait arriver – économiquement, techniquement et démocratiquement.
markdown serves Markdown files as HTML pages on demand, but it can also generate a static site from Markdown so it doesn’t have to render on-the-fly. You can specify whole custom templates or just the CSS and JavaScript files to be used on the pages to give them a custom look and behavior.
Caddy, markdown
Caddy est un serveur web HTTP/2 écrit en Go, et il supporte nativement le Markdown !
Via Bruno Bord.
Getting back to the homepage is about 6 times harder when the logo is placed in the center of a page compared to when it’s in the top left corner.
Kathryn Whitenton, Centered Logos Hurt Website Navigation
Intéressante étude qui prouve qu’un logo aligné au centre ne favorise pas une bonne navigation, et qu’il vaut mieux un logo placé à gauche.
Je suis de plus en plus exaspéré par le discours de certains technophiles experts (réels ou auto-proclamés, je ne suis pas apte à en juger) débinant la majorité des solutions de sécurité parce qu’elles ne sont pas assez fortes, parce qu’elles ne sont pas invulnérables. Ce discours est à mon sens contre-productif, car il présente la protection de son intimité comme un but impossible à atteindre, ou seulement au prix d’efforts dont le coût semble à la plupart d’entre nous démesuré par rapport au risque dont ils nous protègent. Il incite finalement à ne pas se protéger puisque toute protection serait vaine.
Clochix, L’intimité n’est pas chose trop compliquée réservée à l’”Élite”
Ce n’est pas parce qu’on ne maîtrise pas tout qu’il ne faut pas conserver une intimité numérique, et Clochix explique très bien cela !
Code has a story.
Mark Llobrera, Write What You Know (Now)
Mark Llobrera écrivait, en décembre 2015, un manifeste pour que les designers et développeurs web écrivent ce qu’ils savent, qu’ils partagent leurs expériences.
I feel like a web designer’s life is full of those little stories, every day. And usually you tell your teammates over lunch, or over a beer, and you laugh and say, “Isn’t that nuts?” Well, I’m here to say, “write it up.” Let someone else hear that story, too.
Comment cela se passe chez les artisans ? On ne parle pas vraiment de formations ou d’études, on parle d’apprentissage, la différence c’est que l’on apprend par la pratique.
Gilles Roustan, Artisan développeur
Bel article de Gilles Roustan sur ce qu’est le travail de développeur, et comment il s’apprend – et se transmet.
Votre point fort ce n’est pas votre formation, c’est votre savoir faire, alors montrez-le !
Bookmark services are not enough. They have already failed, becoming weird, accumulating useless features, prioritizing recommendations rather than helping users collect and save links.
Zeh Fernandes, Bookmark is dead
Les marque-pages sont morts, nous dit Zeh Fernandes. Mais, souligne-t-il avec beaucoup de pertinence, à l’heure des graphes et des moteurs de recommandation, pourquoi personne n’a encore développé un système simple de recherche/navigation dans des liens visités/marqués ? La solution n’est peut-être pas dans les marque-pages mais dans la recherche/visualisation d’un historique de navigation ?
Technological speaking that’s something possible today: we already store a lot of user data, and the natural search was pretty advanced. So please Google, Firefox or any browser vendor: help me navigate my path of hyperlinks and stop creating this old and painful bookmarking experiences.
Remember, the web, like the internet, has no centre. In theory I could start from any single A element, and by following all the forking paths, traverse the entire World Wide Web.
That opening hyperlink could be on your own website. One single A element can be the portal to an entire universe of knowledge.
Jeremy Keith, <A>
Belle conférence de Jeremy Keith, à l’occasion du CSS Day 2016, autour du A, et de ses différentes déclinaisons – Apophenia, Anchor, Archive, Adactio, etc.
Earlier this month, I gave the afternoon keynote at the Internet Archive’s Decentralized Web Summit, speaking about how the people who are building a new kind of decentralized web can guard against their own future moments of weakness and prevent themselves from rationalizing away the kinds of compromises that led to the centralization of today’s web.
Cory Doctorow, Guarding the Decentralized Web from its founders’ human frailty
Cory Doctorow est doué pour présenter les choses de façon claire, pertinente et drôle, c’est le cas ici lorsqu’il parle de web décentralisé. Sans être accusateur, il parvient à éveiller la conscience des utilisateurs d’internet, et également celle de ses fondateurs.
Chercher l’erreur – Égarements et odyssées graphiques
Les Rencontres internationales de Lure
L’inscription à la semaine d’été des Rencontres de Lure est ouverte depuis plusieurs semaines, inscrivez-vous vite avant le 14 juillet ! La semaine d’été des Rencontres de Lure en quelques points :
La thématique de cette édition 2016 : l’erreur.
De la simple bourde à la faute en passant par la coquille, l’erreur peut être de jeunesse, 404, de justice, voire fatale. Au fil de nos corrections, ctrl+Z, relectures et repentirs, elle s’efface devant l’ardeur avec laquelle nous la chassons. Cherchez l’erreur et vous trouverez bavure, bug, impair, défaut, illusion, mais aussi de sympathiques maladresses. Cultivez l’imperfection et vous courez à la rencontre de perdants magnifiques, d’anti-héros édifiants, d’imperturbables et dignes mordus de poussière.
Et pourtant, l’erreur révèle aussi les failles d’un système que l’on croyait trop parfait. Elle nous renvoie à nos limites, défie notre imagination, nous met face à l’imprévu et force notre créativité. Cette déviance parfois infime, toujours déroutante, nous bouscule hors des sentiers battus. On tombe, on s’en étonne, on en rit, ou bien on s’effraie du chaos qui menace.
Le design graphique et la typographie se nourrissent d’avaries et de soubresauts, qui sont autant d’invitations à une réinvention permanente. Vous aussi venez échouer avec nous aux Rencontres internationales de Lure du 21 au 27 août 2016 à Lurs, Alpes-de-Haute-Provence.
I am interested in what the Web can learn from books and what books can learn from the Web.
And I think in order to answer those questions it’s important to try to define what we mean by “books,” what are the qualities that are essential to “a book” that are not essential to, for instance, a website. Hugh McGuire, What books can learn from the Web / What the Web can learn from books
Hugh McGuire tente de définir le livre, de comprendre pourquoi le livre et le web sont s’y éloignés – et pourtant tous les deux si essentiels dans nos cultures basées sur les savoirs –, et d’imaginer comment l’un peut apprendre de l’autre. Un article à lire pour mieux comprendre comment le livre numérique pourrait évoluer.
Books can learn from the web how to be bounded, but open.
The web can learn from books how to be open, but bounded.
Cet article est également une introduction aux webbooks, ou web books, ou livre web.
An eBook framework (CSS + template) which mantra is to “find simple solutions to complex issues.”
FriendsOfEpub, Blitz
Jiminy et Quentin ont créé, il y a quelques mois déjà, un framework pour le livre numérique, l’initiative est suffisamment rare pour être signalée ! Je n’ai pas testé, mais les objectifs sont assez clairs :
Blitz was designed to deal with the significant obstacles a newcomer or even an experienced producer might encounter. Its major goals are:
- to be simple and robust enough;
- to offer a sensible default;
- to manage backwards compatibility (ePub 2.0.1 + mobi 7);
- to provide useful tools (LESS/SASS);
- to get around reading modes (night, sepia, etc.);
- to not disable user settings.
[…] nous nous sommes rapidement rendu compte que l’un des points intéressants était la production de contenus hors-ligne, sa mise à disposition et sa mise à jour.
Alexis, Consultez vos sites web hors-ligne
Rapide retour d’Alexis sur un hackathon autour du web hors connexion, questionnements assez éloignés de simples sites web consultables hors ligne, mais plutôt dans l’idée de pouvoir accéder à de grandes quantités d’informations, dans des environnements où il n’y a pas du tout d’accès internet.
Les Progressive Web Apps apportent les fonctionnalités attendues des applications natives à l’expérience de navigation Web sur un mobile, en utilisant des technologies basées sur les standards, et en tournant dans un conteneur sécurisé accessible à tous sur le Web.
En somme, les Progressive Web Apps décrivent toute une série de technologies, de concepts d’architecture et d’API Web qui travaillent de concert pour proposer une expérience similaire aux application natives sur le Web mobile. Voyons ensemble les quelques tenants de base des Progressive Web Apps.
Que sont les Progressive Web Apps ?
Frank et Enguerran on traduit l’article de Max Lynch sur les Progressive Web Applications, publié initialement sur le site de Ionic, merci à eux !
Les Progressive Web Apps sont à la fois de nouvelles API, des modèles de conception et du jargon marketing.
CSS ne devrait pas être utilisé pour altérer lʼimportance sémantique d’un contenu. Et par extension, utiliser les sélecteurs dʼéléments ou dʼattributs semble une bonne idée. Je reformule au cas où : séparer le fond de la forme est une bonne idée, mais pas séparer la forme du fond. La forme dépend du fond, là où le fond ne dépend pas de la forme.
Gaël Poupard, Le sens de la sémantique
Gaël revient sur les rôles des langages HTML et CSS, et remet au centre du débat la question, celle de la sémantique.
The web is a mess. It is, like its creators, imperfect. It’s the most human of mediums. And that messiness, that fluidly shifting imperfection, is why it’s survived this long. It makes it adaptable to our quickly-shifting times.
Matt Griffin, The Future of the Web
Plutôt qu’une vision du futur du web, il s’agit plutôt de constats, positifs ou résignés, mais importants, en vrac : l’importance de développer des applications web plutôt que des applications natives, les effets de répétition liés à certaines évolutions technologiques (Flash, JavaScript), la culture de l’erreur et de l’échec, l’importance du contexte, le best effort, etc.
Through my research on the web, I stumble upon a lot of resources like tools, websites and tutorials.
Damiano Bacci, The definitive data journalism resources list
Des ressources et des outils utiles pour manipuler et mettre en forme de la data.
Every word and letter in an interface matters. Good writing is good design. Text is ultimately interface, and it’s us, the designers, who are the copywriters shaping this information.
Viljami Salminen, Typography for User Interfaces
Viljami Salminen propose un article assez complet sur le rôle de la typographie dans les interfaces utilisateur, et notamment les dix points clés à prendre en compte.
Cet article est un résumé d’une conférence, dont le support est disponible par ailleurs par ici.
To ease our work make our interfaces faster, more accessible, and eventually more legible and productive too, because ultimately, good typography enables productivity for everyone. It could even save your life.
We do not control the environment executing our JavaScript code, interpreting our HTML, or applying our CSS. Our users control the device (and, thereby, its processor speed, RAM, etc.). Our users choose the operating system. Our users pick the browser and which version they use. Our users can decide which add-ons they put in the browser. Our users can shrink or enlarge the fonts used to display our Web pages and apps. And the Internet providers that sit between us and our users, dictating the network speed, latency, and ultimately controlling how—and what part of—our content makes it to our users.
All we can do is author a compelling, adaptive experience, cross our fingers, and hope for the best.
The fundamental problem with viewing JavaScript as the new VM is that it creates the illusion of control.
Aaron Gustafson, A Fundamental Disconnect
Aaron Gustafson rappelle la difficulté de concevoir des applications – web – avec JavaScript, et de ne pas oublier de prévoir les cas où JavaScript ne sera supporté, ou mal interprété.
Cet article a été écrit en septembre 2014, mais il semble toujours aussi pertinent.
The history of the Web is littered with JavaScript disaster stories. That doesn’t mean we shouldn’t use JavaScript or that it’s inherently bad. It simply means we need to be smarter about our approach to JavaScript and build robust experiences that allow users to do what they need to do quickly and easily even if our carefully-crafted, incredibly well-designed JavaScript-driven interface won’t run.
Il rappelle alors les 3 règles suivantes :
- “Vous devez faire chacun votre tour la vaisselle”
- “À chaque tour de vaisselle que vous réalisez, vous devez vous munir de votre palet et venir le placer en haut du tube”
- “Les autres frères et soeurs doivent ensuite valider le fait que la corvée ait bien été réalisée en ouvrant ensemble le couvercle grâce à leurs clés respectives ce qui a pour conséquence de faire tomber le palet de couleur à l’intérieur du tube. La majorité des clés suffit à faire tomber le palet.
Collectif Bam et Block Chain France, La blockchain expliquée à un enfant de 5 ans
La block chain expliquée simplement, très utile pour démontrer l’intérêt de cette technologie – permettant notamment de créer une monnaie décentralisée, dont le Bitcoin.
Q: What happens if every word translates into an emoji?
A: It’s not useful but it’s a lot of fun.
iA, Roger That: Emoji Overdrive
L’équipe de iA a créé un outil permettant de transformer 2 000 mots (anglais) en emoji. C’est drôle, mais surtout très intéressant en terme d’usages !
That is the Medium appeal, in a nutshell. Keeping everything from being shit. It wants to do so by adopting many of the tics and habits of the original blogosphere—the intertextuality, the back-and-forth, the sense of amateurism—without being the open web.
Robinson Meyer, Ev Williams is The Forrest Gump of the Internet
Robinson Meyer a rencontré Ev Williams, l’un des fondateurs de Blogger et l’ancien CEO de Twitter, aujourd’hui CEO de Medium – cette plateforme de publication bien connue. Ev Williams explique – à travers différentes analogies plus ou moins réussies, comparant l’internet ou le web à des archipels et des continents, et parlant des contenus comme de la nourriture – que le web doit se centraliser, que Medium doit être un espace de confiance permettant à toutes et tous de s’exprimer, face à certains continents moins bien intentionnés (mon regard n’est peut-être pas très objectif). Il y a beaucoup de choses intéressantes dans cet article, qui permettent de comprendre comment les grandes plateformes imaginent l’évolution du web – même si c’est assez inquiétant.
I proposed that Medium is trying to be the Whole Foods of content. He laughed.
Readium LCP is therefore an effort to find a new balance between the needs of the rights owners and those of end users.
[…]
LCP is really more than a password based protection scheme.
EDRLab, Readium LCP Principles
L’EDRLab publie les principes de LCP Readium, la mesure technique de protection pour les livres numériques au format EPUB qui devrait remplacer la DRM Adobe. Pourquoi remplacer la DRM Adobe ? Essentiellement pour deux raisons : ne plus être tributaire d’Adobe – qui, en plus, n’est pas un acteur de la chaîne du livre, même s’il l’est devenu, de fait –, et permettre plus facilement certains usages – comme une meilleure gestion du prêt numérique.
I will summarize the Readium LCP main objectives as a set of bullet points:
- Effective enforcement of classical usage restrictions
- Support for different workflows, especially retail, library lending, subscription
- Ease of use for the end user
- Offline access to the publications always possible
- Perfect system interoperability
- No interference with content accessibility (a11y)
- Unlimited access (in time) to the publications where allowed by rights holders
- Friendly sharing possible (but anti-oversharing enforcement)
- Ease of implementation via the release of open-source software
- Independence from individual technology vendors
- Management by a non-profit organization
LCP Readium se veut un système distribué, avec les principes suivants (grossièrement résumés) :
Quelques questions subsistent :
Votre centre d’intérêt n’est pas le livre numérique ? Suivez tout de même de près LCP Readium, car c’est une tentative de vendre des contenus numériques avec des mesures techniques de protection !
I’m not convinced that it should be all about “books in browser-based reading systems” or “books on the web.” I think we may have evolved past our definition of book. We need a new noun to describe long-form content on the web that is packaged an connected. Publishers need to help us figure out exactly what this is in specific contexts.
Jean Kaplansky, Absolute truth
Jean Kaplansky réagit à un article de Jiminy Panoz : la question ou le débat concernant l’articulation entre l’EPUB et le web n’est pas tant une question d’interface ou de technique, que de définition de ce qu’est un livre et un document, numérique ou non numérique.
A concise, referential guide on best web typographic practices.
Typography Handbook
Un livre web d’une page sur les bonnes pratiques typographiques sur le web, par Kenneth Wang, une bonne introduction à Professionnal Web Typography de Donny Truong.
The only file format that works as expected anywhere is no file format, in other words: Plain Text.
[…]
Because of its universality and simplicity, Plain Text gets us further than any file format. Yet, Plain Text editors are not made to visually structure text, optimize complex layouts, fiddle with detailed typography, or interlink text bodies. They are great for finding the right words, but fall short the longer the text gets. A contemporary writing process needs to allow us to freely move back and forth between plain words and formatted text, via automated workflows or copy-paste.
iA, Multichannel Text Processing
IA a écrit un article sur les workflows d’écriture et de publication d’une très grande clarté. Face au WYSIWYG, le fichier texte sans formatage est le moyen le plus simple, interopérable et résilient d’écrire et de partager du texte. Et le langage sémantique ultra simple qu’est Markdown permet de transformer ce principe en réalité.
Même si cet article est également une promotion pour l’application iA Writer (iOS, Mac et Android), ce texte est à faire lire à toute personne ayant un lien avec l’écriture et le partage de texte (auteurs, éditeurs de livres, éditeurs de logiciels, universitaires, étudiants, etc.).
Yes, you can build 2007 websites much better now. They will be consistent across platforms and perform great. But my 12 year olds don’t want 2007 websites. They want 2016 apps.
[…]
Web progress is open progress and open is slow, painful, and by definition designed by a committee. It takes about a decade longer for open technology to reach the maturity of closed systems.
At the end of the day it is not about technology but about cost.
Eran Hammer, The Fucking Open Web
Même si les technologies sont disponibles et relativement mûres, il est aujourd’hui très compliqué de construire une application basée sur les standards du web : difficultés de compatibilité avec les navigateurs, lenteur d’évolution des standards, coûts engendrés, etc. Eran Hammer constate, avec regret et un humour très sombre, que développer des applications natives est tout simplement plus simple et la seule solution pour faire vivre sa start-up.
The web is the future. The web will always be the future. But that’s the problem. I need to ship products now.
I firmly believe people running their own servers will be a big deal in the years to come, as the Minecraft generation comes of age, and at the same time the cloud will continue to grow with hosted apps. It’s all going to be big. And people will always need writing tools, and that’s what 1999.io is – the best writing tool I could imagine and implement in 2016.
Dave Winer, Where we’re at with 1999.io
Dave Winer lance son CMS, un outil de blogging simple et efficace : 1999.io. Il faut courir voir les fonctionnalités de cet outil : 1999.io/about/.
“The web is already decentralized,” Mr. Berners-Lee said. “The problem is the dominance of one search engine, one big social network, one Twitter for microblogging. We don’t have a technology problem, we have a social problem.”
Tim Berners-Lee dans l’article de Quentin Hardy, The Web’s Creator Looks to Reinvent It
À l’occasion du Decentralized Web Summit, plusieurs acteurs du web ouvert – dont Tim Berners-Lee ou Brewster Kahle (Internet Archive) – ont travaillé pour trouver des solutions aux effets de centralisation du web, ou au problème du modèle économique du web basé trop souvent sur la publicité, ou encore aux solutions de paiement.
How did the UK reach an increasingly mobile population? Responsive websites, he replies. “For government services that we were providing, the web is a far far better way… and still works on mobile.”
Sites can adapt to any screen size, work on all devices, and are open to everyone to use regardless of their device. “If you believe in the open internet that will always win,” he says. And they’re much cheaper to maintain, he adds, because when an upgrade is required, only one platform needs recoding.
Joshua Chambers, Why Britain banned mobile apps
Joshua Chambers a interviewé Ben Terrett, former head of design at the UK Government Digital Service, à propos de la refonte complète des services en ligne du gouvernement de Grand Bretagne, gov.uk. Ben Terrett explique les choix et les méthodes : centrés et testés sur les utilisateurs, et non sur les intuitions des dirigeants ; avec une équipe réduite mais pluridisciplinaire, et en capacité de prototyper rapidement ; en étant en développement continu et en acceptant les retours d’utilisation (par exemple : suppression des boutons de partage vers les réseaux sociaux car utilisés par seulement 0,1% des utilisateurs) ; etc.
But if Terrett could leave readers in Asia with one bit of advice, it’s this: remember the user needs. Don’t ever let agencies suggest ideas without justifying why it benefits citizens. The temptation is always there for them to meet internal objectives without building a simple service – and sometimes even complicating the citizen experience with an unnecessary app or web page.
I’d love to see more experimentation around online/offline hypertext/books. For now, you can visit HTML5 For Web Designers, add it to your home screen, and revisit it whenever and wherever you like.
Jeremy Keith, Taking an online book offline
Voilà, Jeremy Keith l’a fait : il avait créé il y a déjà plusieurs années un livre web – ou web book ou encore online book –, HTML5 For Web Designers, ce livre site est désormais consultable hors ligne (après le chargement d’une seule page). En regardant le script serviceworker.js (ici) utilisé par Jeremy, on comprend mieux comment cela fonctionne.
Cela ouvre des perspectives immenses pour la lecture numérique !
Are you upset that technology is hijacking your agency? I am too. I’ve listed a few techniques but there are literally thousands. Imagine whole bookshelves, seminars, workshops and trainings that teach aspiring tech entrepreneurs techniques like this. They exist.
The ultimate freedom is a free mind, and we need technology to be on our team to help us live, feel, think and act freely.
Tristan Harris, How Technology Hijacks People’s Minds — from a Magician and Google’s Design Ethicist
Tristan Harris dénonce les manipulations des entreprises de la Silicon Valley à travers les interfaces et les choix – ou les non choix – qui y sont proposés aux utilisateurs. Il propose un manifeste et met en place des alternatives, par ici : http://timewellspent.io.
En complément de cet article en anglais, un entretien en français sur Rue89, par là.
Je suis assez impressionné du fait que l’article de Tristan Harris est également sur Medium, ce qui me semble quelque peu en contradiction avec ce qu’il promeut…
Le maitre mot que je retiens de cette édition est la congruence (être en accord entre ses actions, ses sentiments, son être, etc.). Ce n’est pas toujours facile, mais c’est la seule voie pour durer.
Nicolas, Retour sur Sud Web 2016 à Bordeaux
Nicolas parle de Sud Web 2016, et il me fait découvrir le terme congruence, un retour intéressant.
Whether you use a framework as part of your design process or not, when it’s time to go public, nothing will ever beat lean, hand-coded HTML and CSS.
Jeffrey Zeldman, Has Design Become Too Hard?
Via HTeuMeuLeu.
[…] launching sites and applications based on Bootstrap or any other heavy framework is like using Microsoft Word to send a text message.
Ce n’est peut-être pas si étonnant si autant de participants écrivent sur leur expérience de Sud Web !
Ce qui m’a surpris en premier, c’est que pendant ces deux jours, je n’ai pas vu beaucoup de code, et je n’ai presque pas vu de web, du moins en première lecture.
Pierre-Yves Desnoues, Sud Web 2016 @ Bordeaux
Sud Web est définitivement une conférence particulière. Ne cherchez pas à la saisir, elle viendra tout simplement à vous, honnête et bienveillante. Sa bonhomie ne cessera de vous étonner. Après cinq ans d’existence, elle reste surprenante, mouvante, en témoigne le thème de cette édition 2016 : Partageons nos super-pouvoirs.
Baptiste Adrien, Sud Web 2016 Bordeaux : un excellent millésime
Pour moi, le mot qui est le plus revenu cette année est celui de la valeur
Maxime Warnier, SudWeb 2016 : la valeur du travail et des chocolatines
On m’avait vendu Sud Web comme la conférence super humaine, un peu moins technique que certaines autres, plus centrée sur l’humain. Et je ne peux que confirmer.
Nathalie Pauchet, Mon premier Sud Web, retour d’expérience
Et puis les présentations ont démarrés et ce sont enchaînés et je me suis rappelé. Ce n’est pas tant que les participants et les orateurs sont des personnes exceptionnelles et bienveillantes. Elles le sont bien sur. C’est surtout qu’elles sont plus de 180…
Brice, SudWeb : La conférence qui fait du bien
Un weekend créatif avec de vrais morceaux de bienveillances et partages à l’intérieur. Ça a le mérite d’être reboostant & de donner le smille.
Laurie, Bienveillance & partage : bienvenue à Sud Web
As Pauline’s character grew up from her fifth birthday to being an accomplished professional looking for the meaning of her life, the talks addressed these issues with an incredible diversity.
Basile Simon, Sud Web 2016
Sud Web est ce que les gens y apportent. On y apprend beaucoup, on échange beaucoup et on rencontre plein de gens passionnés et passionnants.
Olivier Keul, Sud Web 2016 – Bordeaux
Avec Sud Web on ne sait jamais ce qu’on tirera des conférences, et c’est tant mieux. On repart avec des réflexions qui ont rebondi d’un métier à l’autre, on apprend en décloisonnant – c’est ce qui fait toute la pertinence d’un sujet inattendu (la couture dans une conférence de gens qui travaillent dans le Web ?), qui ouvre à de nouvelles idées et permet d’envisager de nouvelles perspectives sur nos métiers.
Stéphane, Sud Web 2016 : toujours inattendu, toujours satisfaisant
Stéphane fait son résumé de Sud Web 2016 : assez complet pour donner une bonne idée de ce qui s’est passé et de ce qui s’y est dit.
Pour ne ramener ce parallèle qu’à notre domaine professionnel, Sud Web nous parle là de garder l’esprit ouvert par rapport à nos habitudes (de conception, de développement) et à penser en fonction de notre contexte actuel (qui, dans le web, est toujours différent de ce qu’il était un an plus tôt).
Delphine Malassingne, Zéro gâchis mais plein de questions
Delphine évoque Sud Web 2016 en faisant le rapprochement entre la dernière conférence – “Zero waste” par Mylène L’Orguilloux – et les métiers du web : est-ce qu’on ne pourrait pas tenter de fabriquer des sites et applications en s’inspirant du concept Zero waste utilisé dans le textile ? L’un des retours de Sud Web 2016 les plus revigorants !
De la même façon, la transmission – enseigner, partager sur un blog nos réflexions et nos expériences, échanger de vive voix avec plus junior que soi, collaborer avec des apprentis – est très importante.
C’est même l’un des piliers de notre communauté, initialement autodidacte. Et les évènements comme Sud Web permettent justement d’apprendre et de transmettre, en dehors de nos lieux de travail, et en dehors de toute contrainte de production.
Le simple fait de se voir et d’échanger dans des lieux neutres, loin de nos bureaux, active déjà notre capacité à prendre du recul sur notre activité.
Marie Guillaumet, Sud Web 2016 : en un mot, génial !
Voici le retour de Sud Web 2016 de Marie, qui insiste sur la dimension humaine de l’événement, et elle a bien raison !
Les éditions de cette conférence se suivent mais ne se ressemblent pas si ce n’est dans leur recherche de singularité. Chaque intervention donne envie d’aller interagir avec l’orateur pour échanger plus que d’ouvrir son laptop. Derrière ces sujets non-techniques se cachent des réflexions plus profondes qui n’interrogent plus le comment mais le pourquoi et de plus en plus le pourquoi pas ?
David, SudWeb 2016
David revient sur Sud Web 2016 en quelques phrases, il résume bien ce qui s’y est passé.
Jusqu’ici je me suis dit que je devais choisir. J’ai pensé naivement que je ne pouvais pas être et un brasseur et un developpeur, mais la réalité c’est que c’est exactement ce que je suis: les deux.
Alexis, Cloisonnement des activités ?
Un retour de Sud Web par l’un des participants, Alexis, qui résume très bien ce qu’est Sud Web : une réflexion sur la façon dont nous souhaitons travailler – dans le web ou ailleurs –, et peut-être vivre.
Je fais aujourd’hui ce que vous me voyez faire depuis mes 10 ans : j’écris des programmes, je pianote, j’écris des poèmes.
Bastien, J’ai dix ans
À défaut d’avoir pu être présent à Sud Web, Bastien a écrit une lettre qui a été lue sur scène, un beau texte qui donne envie de ne pas oublier qu’on peut encore avoir dix ans.
Mais quand tout va bien, j’ai dix ans : je joue, je construis, je code, je partage, j’écris, j’avance, j’m’en fous.
Cher parents, voici donc ce que je fais : j’essaie d’avoir tous les jours 10 ans et de me sentir aussi joyeusement libre que je l’étais sous votre règne discret.
Vous pensez certainement que ça ne ressemble pas beaucoup à une ambulance. C’est votre bon sens qui vous le dit. Mais le bon sens est une invention des adultes. Ça n’existe pas dans le monde des enfants. Les enfants n’ont pas d’interdits, ils font les choses librement. Ils finissent toujours pas apprendre à être réalistes. Ne leur demandez pas de l’être trop tôt.
Un petit livre à l’usage des parents, pour mieux comprendre leurs enfants à travers les jeux.
À l’occasion de son intervention lors de Sud Web (Les valeurs de LEGO™), Thomas Gasc a scanné, mis en page et déposé en ligne un manuel Lego™ de 1973. On y apprend beaucoup de choses, et ce petit livre pourrait presque être des conseils de design !
C’est pourquoi il est difficile de séparer le jeu des choses sérieuses. Les distractions des enfants ne devraient jamais être évaluées froidement. Le jeu est avant tout une libre expression. Sous sa meilleure forme, il est profondément sérieux. Er utile. Les enfants commencent à jouer quand ils sont âgés de quelques mois et ne s’arrêtent jamais vraiment. Le jeu grandit avec eux.
I hope we’ll see more examples of Progressive Web Apps that don’t require JavaScript to render content, and don’t throw away responsiveness in favour of a return to device-specific silos. But I’m not holding my breath. People seem to be so caught up in the attempt to get native-like functionality that they’re willing to give up the very things that make the web great.
Jeremy Keith, Regressive Web Apps
Suite à l’événement Google I/O, Jeremy Keith rappelle ce que devrait être une Progressive Web Apps, en démontrant les incohérences des développements de certaines grandes firmes (Google, Facebook, etc.). Des pistes de bonnes pratiques pour des applications web ouvertes et réellement interopérable.
Mais alors, à quoi bon réinventer la ratatouille ?
Le premier argument qui me vient à l’esprit, c’est bien entendu la qualité. En cuisinant moi même une ratatouille, je connais la qualité de mes ingrédients.
Le second argument, c’est la facilité de personnalisation. Vous n’aimez pas les poivrons ? Aucun problème, je vous fait une ratatouille sans poivron.
Le dernier argument, c’est le plaisir. Découper soi même amoureusement ses aubergines, courgettes et tomates, et les faire revenir langoureusement à la poêle, c’est quand même autre chose que jeter un sachet plastique surgelé dans le micro-onde.
Rémi, Réinventer la roue
Finalement, questionner et réinventer – en partie – les outils que l’on utilise, c’est s’assurer d’apprendre, de prendre du plaisir, d’augmenter les performances de l’outil et d’être efficace – sur le long terme.
Welcome to Monoskop, a wiki for collaborative studies of the arts, media and humanities.
Monoskop
Grâce à Joël, je découvre cette mine incroyable, des livres et revues sur – notamment – le design graphique et la typographie, mais aussi sur d’autres sujets.
Premièrement, mettons-nous d’accord sur une Journée Mondiale de Sensibilisation à l’Accessibilité (Global Accessibility Awareness Day). Ce sera une journée dans l’année durant laquelle les développeurs Web, partout dans le monde, essaieront d’améliorer la prise de conscience et le savoir-faire en accessibilité du web.
Ce jour-là, chaque développeur web sera incité à tester au moins une page de son site dans un outil d’accessibilité. Après avoir réparé la page, il sera incité à écrire un billet de blog sur ce qu’il a changé, pour inspirer d’autres à les suivre.
Global Accessibility Awareness Day
Le 19 mai est donc la Journée Mondiale de Sensibilisation à l’Accessibilité, et c’est une très bonne chose ! Même si il semble que cette initiative soit suivie surtout par des anglophones, il y a beaucoup de choses à découvrir – par exemple via #GAAD. À noter dans l’espace francophone :
Ça me rend dingue. Depuis 20 ans donc (en comptant ma thèse et mon post-doc) je croise souvent plein de collègues qui ont des choses passionnantes à raconter. Et qui ne les racontent pas. Qui ne les raconteront jamais autrement que sous la forme d’un jargon imbitable dans des revues hors de prix pour un public inexistant.
Olivier Ertzscheid, Pourquoi je ne publie(rai) plus (jamais) dans des revues scientifiques.
Olivier Ertzscheid n’est pas content, et il explique très bien pourquoi. Plus globalement, la question du fonctionnement des revues scientifiques pose celle de la visibilité de la recherche, de la réception et de la transmission de celle-ci, et de la réappropriation de ces contenus et données dans un espace public.
Because it’s frustrating to work on the same problem with some of the same people but very different processes. Because ebook folks need help from web folks. Because we want more people at the table, and less duplicated effort. Because IDPF has much to offer W3C when it comes to accessibility. Because we think that books should be first-class citizens of the web.
[…]
Bringing more people to work together on reading in browsers can make the web better for everyone. Better together? I say yes. Dave Cramer, W3C and IDPF: Better Together?
Le rapprochement entre l’IDPF – l’instance derrière le format du livre numérique, l’EPUB – et le W3C pose tout de même quelques interrogations ou contraintes, que Dave Cramer évoque sans pour autant écarter le fait que cette fusion est une nécessité.
Je suis surpris de voir que les unités relatives ne font pas encore consensus dans la communauté Web, notamment sur la typographie.
Nicolas Hoffmann, Les em/rem avec les préférences utilisateurs
Quelle utilisation des unités relatives en prenant compte des préférences utilisateurs ? C’est ce qu’explore – très clairement – Nicolas Hoffmann.
Publishing books on the web isn’t a risk: it’s the future.
Peter Brantley, Books, in a browser
Peter Brantley aborde la question du rapprochement de l’IDPF et du W3C, et les enjeux autour de la convergence du livre numérique et du web :
Berners-Lee noted four crucial affordances for publications on the web. Permanence: the open web is built on our most reproducible standards; materials published using HTML5 and its successors stand an excellent chance of remaining available in future networked environments. Seamless: ebook and digital magazine content can flow across different kinds of devices, from laptops to mobiles, with no fundamental disruption. Linked: publications can incorporate content that resides across the globe, in whatever form, as long as it is addressable on the web. Trackable: publications embodying standard identifiers such as DOIs or ISBNS, and persistent author identification, can be identified, and their use analyzed around the web.
People often judge a website by how quickly they can get what they need and leave. Headings are a great way to do just that. They’re visually larger than the rest of the content, so they stand out. They provide a description of what’s in each section, so people can skip ahead or stop when they find the section they need.
People who use screen readers also use headings to skim and scan the content on a long page.
[…] Headings also help people create a mental outline of the content on the page.
Julie Grundy, Creating bulletproof headings
Comment organiser les niveaux de titres dans une page/document HTML tout en restant accessible ? Julie Grundy aborde cette question avec beaucoup de pédagogie, c’est clair et efficace !
Les trois étapes :
À noter que le troisième point est rarement abordé dans ce type d’article : la structure sémantique doit être accompagnée de contenus compréhensibles et clairs :
Finally, headings need to be descriptive and useful. There’s no point making a lovely outline structure for our page if we’re going to use generic headings like “Learn more” or “Visit.” What are we going to learn about, and who are we being invited to visit? Let people see at a glance what you’re offering, instead of making them read every word.
Le fait d’avoir fait de longues phases séparées et d’améliorer le portfolio graduellement m’a semblé être une méthode efficace, et chose rare pour un book perso, le projet ne me sort pas par les yeux et j’ai plaisir à y ajouter des petites fonctionnalités ou à en améliorer des existantes.
Julien, Refonte de judbd.com : Étude de cas (1ere partie)
Julien présente, pas à pas, le cas de la refonte de son portfolio. C’est bien écrit, avec des conseils très pragmatiques.
Dans la deuxième partie, il est question de l’utilisation de Kirby, le flat CMS bien pensé.
En regardant cette photo, je pense à nos innombrables discussions sur ce blog et ailleurs à propos des livres numériques et du web, de ce qu’est un livre numérique et de ce qu’il n’est pas, je pense à “Books in Browsers”, je pense à l’attachement inconditionnel que j’ai pour le web et toutes les aventures qu’il contient, je pense aux livres, à ceux qui les écrivent, les éditent, les fabriquent, les défendent, les vendent, les lisent.
Virginie Clayssen, IDPF et W3C : books and browsers
L’IDPF et le W3C sont donc en cours de rapprochement, de “fusion” :
Fusionner, cela signifie que l’IDPF va disparaître, pour devenir un groupe de travail du W3C, dédié au format EPUB, et que celui-ci ne sera plus uniquement le format des livres numériques mais le format de tous les documents numériques que l’on souhaitera encapsuler pour qu’ils puissent notamment être lus hors ligne.
Combien de qualité êtes-vous prêts à payer, ou, plutôt, à quel moment la qualité a un [retour sur investissement] maximal dans votre projet web ?
Fuuuuuuuuuu, Vous n’avez pas assez d’argent pour de la qualité.
La question de la qualité web, abordée avec une certaine dose d’humour. Il faudrait probablement ajouter un peu de contraste, puisque la qualité web n’est pas toujours une question de coûts, mais aussi de méthode et de culture.
Parcourir en fouillant. S’efforcer de connaître, de fréquenter, de rencontrer. Chercher à retrouver. Chercher à connaître. Faire une enquête. Tâcher d’acquérir, d’obtenir. Terminer une œuvre avec un soin extrême, jusque dans les plus petits détails. Essayer d’atteindre. Tenter de découvrir, de discerner une qualité. Être en quête. Désirer connaître. Être à la recherche. Examiner avec soin. Chercher avec soin, méthode, réflexion. Être attiré. Solliciter. Étudier ou bien examiner.
Chercher
Graphisme en France 2016, Recherche, design graphique et typographie, un état des lieux
Le numéro 22 de la revue Graphisme en France est paru, publié par le Centre national des arts plastiques, et mis en page cette année par Alice Jauneau et David Vallance.
Le sommaire :
La revue est disponible gratuitement et plus ou moins facilement dans les lieux culturels. Le PDF est disponible en ligne, en attendant, bientôt, une version numérique.
Forget about our romantic, endangered memories of “old book smell”. Most of my university books and manuals smelled of plastic, but that’s beyond the point. There are many ways in which the physicality of the support helps us handle knowledge: understanding and memorizing concepts, making connections, keeping references, aiding visual memory. There are as many, if not more ways in which a digital tool could do just the same, with the added benefit of being always with you(something a few 500-pages manuals cannot boost to be). And yet, it doesn’t.
[…]
Yet, if we talk about active reading, many features are missing across all these apps. They concern the way we study, and the many tricks we use to understand, assimilate, and memorize written text. I tried to analyze how we approach the texts we use to study, how we use them, then listed some of the features I think are most needed.
Chiara Lino, Unexploited design opportunities: Ebooks still suck for studying
Chiara Lino fait le constat – que je partage largement – que le livre numérique ne remplit pas toutes ses promesses, et principalement pour une lecture dite active, lorsqu’on étudie, par exemple. Chiara explore huit fonctionnalités – qui rejoignent certains éléments que nous avions imaginés pour Annothèque :
Via Emeline Mercier.
Mes amis pensent que j’aime mon métier pour son côté technique. J’adore l’informatique et je passe mes soirées à coder, je ne m’en cache pas. Mais ce n’est pas ce qui me permet de gagner ma vie. Comme dans toutes les activités de service, ce qui me lie à mes clients, c’est la confiance.
Boris Schapira, Confiance
Boris Schapira décrit très bien son travail : il est consulté par un commanditaire, il consulte ses équipes, il rassemble et organise aussi clairement que possible des éléments et des réponses. Le bilan semble presque trop parfait, mais peut-être que cela vient de la position de Boris – consultant-expert.
Quelque 80 millions de personnes dans l’Union sont touchées par un handicap. Avec le vieillissement de la population, ce chiffre devrait passer à 120 millions d’ici à 2020. Une approche commune dans le domaine de l’accessibilité du web contribuera à rendre la société numérique plus inclusive et à libérer le potentiel du marché unique numérique pour tous les Européens.
La directive couvrira les sites web et les applications mobiles des organismes du secteur public, des administrations aux universités en passant par les tribunaux, les services de police, les hôpitaux publics et les bibliothèques. Elle les rendra accessible à tous, et notamment aux personnes malvoyantes, malentendantes et souffrant de handicaps fonctionnels.
Commission européenne, La Commission salue l’accord visant à rendre plus accessibles les sites web et les applications mobiles du secteur public
Voilà une bonne nouvelle – datée du 3 mai 2016 – pour le web (européen), et c’est suffisamment rare pour être signalé : des règles vont être mises en place pour renforcer l’accessibilité des sites web et applications mobiles du secteur public.
Parmi les points de la directive, un élément me semble intéressant à noter : “Le texte de la directive […] prévoit un suivi régulier des sites web et des applications mobiles par les États membres, lesquels devront établir des rapports à ce sujet. Ces rapports devront être communiqués à la Commission et rendus publics.”
Espérons que cette directive dépasse l’effet d’annonce.
Que ce soit à la surface d’un disque dur ou dans la mémoire d’un serveur web, nos données semblent volatiles et désincarnées. Est-il possible d’imaginer des entités qui représentent ces données à la fois visuellement et de façon physique ? C’est à cette question que se sont attelés les participants du workshop proposé par Stereolux et mené par le studio Chevalvert en mars dernier.
Strabic, Et si nous fossilisions nos données ?
Strabic présente les résultats d’un workshop mené par Stéphane Buellet du studio Cheval vert : des expérimentations pour donner de la matière aux données, et archiver – d’une certaine façon – celles-ci. C’est original, parfois disruptif et souvent poétique.
La capacité que chacune de ses chroniques, chacun de ses portraits, a de dresser, de pointer, de soulever, d’analyser, de relativiser, de subjectiver aussi, est l’essentiel de la qualité de ce livre. Xavier part du “je”, il part de lui, pour nous emmener sur les internets, ces internets chafouins, libertaires, ces internets sécuritaires, morcelés, corsetés, fragmentés, et de nouveau ces internets émancipateurs, libérateurs, accessibles, toujours accessibles.
Olivier Ertzscheid, La tête dans la toile.
Olivier Ertzscheid parle du livre de Xavier de la Porte, La tête dans la toile, publié chez C&F Éditions, et il en parle bien.
Le livre, recueil d’un an de chronique sur France Culture, est disponible ici ou chez votre libraire le plus proche.
Everybody knows that the digital locks of DRM on the digital media you own is a big problem. If you’ve bought a digital book, album, or movie, you should be able to do what you want with it—whether that’s enjoying it wherever you want to, or making it more accessible by changing the font size or adding subtitles, or loaning or giving it to a friend when you’re done. We intuitively recognize that digital media should be more flexible than its analog forebears, not less, and that DRM shouldn’t take away rights that copyright was never intended to restrict.
Parker Higgins, Yes, All DRM
À l’occasion du day against DRM, qui fête ses dix ans, Parker Higgins, de l’EFF, rappelle combien les DRM posent de multiples problèmes, et l’ensemble des DRM !
À lire également, la réaction de Cory Doctorow.
Depuis que les données — ce carburant des marchés publicitaires — leur assurent des profits faramineux, les cadors de la Silicon Valley ne demandent pas mieux que d’offrir, à des prix imbattables, des services et des biens conçus pour leur délivrer plus de données encore. Une offre infiniment variée, qui inclut bien sûr systèmes de navigation et réseaux sociaux, mais aussi mouchards capables de nous traquer pendant que nous faisons du sport, mangeons ou conduisons, ou même pendant que nous faisons l’amour : pour eux, tout cela n’est rien d’autre que des données, or les données, c’est de l’argent.
Evgeny Morozov, Féodalisme 2.0
Données personnelles, interfaces, outils, Silicon Valley, GAFA, web, usages numériques, économie mondial, bourse, services publics, micro-paiement, etc. Ce qu’expose – et prédit en partie – Evgeny Morozov est assez terrifiant.
[…] il paraît assez vraisemblable que Google, Facebook et les autres finiront par opérer les infrastructures de base grâce auxquelles le monde d’aujourd’hui fonctionne. Nul doute qu’elles y aspirent, sachant la pluie de données qu’un tel contrôle leur permettrait de recueillir.
Songez-y. Compte tenu de l’instabilité économique générale, est-il raisonnable de tenir pour acquis que la publicité restera cette vache à lait magique qui apporte l’Internet gratuit jusqu’au Sri Lanka et permet à des millions de personnes d’échanger messages et fichiers sans débourser un sou ?
Reconquérir une meilleure attention à notre environnement immédiat, sans pour autant sacrifier les avantages de certaines connexions lointaines, tel est peut-être le défi principal qui nous fait face.
Yves Citton, Notre-Dame-des-Média, Ceci tuera ceux-là, qui ne mourront pas
Dans le numéro 43 de la revue Azimuts – “The end of the world as we know it” – Yves Citton propose une lecture contemporaine du chapitre de Victor Hugo, “Ceci tuera cela” – Notre-Dame de Paris, Livre II, chapitre 2 –, également présent dans ce numéro d’Azimuts. Un texte incontournable, puissant et moteur, pour qui s’intéresse aux problématiques du numérique – web, internet, IoT, etc.
La frontière entre le monde des objets physiques et celui des systèmes d’information numériques s’estompe un peu plus chaque jour de sorte que nous sommes de plus en plus souvent connectés dans notre vie quotidienne, à titre individuel et professionnel. Cet environnement constitue une infrastructure que l’on appelle aussi l’Internet des Objets dont l’étendue et l’accroissement ne cessent d’étonner.
[…]
On pourrait espérer que ces des objets intelligents et connectés par le moyen d’Internet facilitent la vie des personnes handicapées, des personnes âgées, dans bien des situations. Invisibles à la maison, dans les transports en commun, sur le lieu de travail, les objets équipés de capteurs peuvent doter les services de la capacité à s’adapter aux besoins particuliers de leurs usagers. Des exemples concrets du confort et de la simplicité apportés par de tels objets commencent à émerger et de nombreux projets de recherche ont été lancés pour explorer et développer les possibilités de ces technologies pour réduire l’exclusion numérique.
10e Forum européen de l’accessibilité numérique, L’accessibilité numérique dans un monde connecté
Belle thématique pour le 10e Forum européen de l’accessibilité numérique : les objets connectés.
[…] la poudre que contient le design sert aux feux d’artifices beaucoup plus souvent qu’aux explosifs.
Pierre Doze, Les joies irritantes des caresses infécondes, ambition du design et éloge du fourbi
Dans le numéro 44 de la revue Azimuts – “When design cherishes the ambition to save the world” – Pierre Doze aborde le concept d’ambition du design. Critique, souvent virulent et impitoyable, et certainement lucide, cet article révèle la réalité (d’une partie) du design aujourd’hui. Pour autant il ne faut pas tomber dans un fatalisme béhat, mais plutôt prendre conscience de cette ambiguité qui réside, parfois – et dans certains projets –, entre discours, motivation, conception et réalisations.
Impérialismes multiples, condescendance, incongruité, autosatisfaction, sentimentalisme, cécité, prétention, narcissisme, hypocrisie – là où il faudrait associer l’humilité intellectuelle à l’optimisme, une méfiance systématique à l’endroit de l’ethnocentrisme, le respect de principe à l’égard des contextes où on voudra s’inscrire, impliquant l’enquête et la recherche.
Le designer est convoqué pour tenir une burette : il ne présente aucun péril pour l’ordre de ce monde qui va mal.
Une forme de décroissance technique pour revenir aux fondamentaux sans pour autant s’en tenir à des expériences utilisateurs et développeurs de la décennie précédente.
David Larlet, Simplicité par défaut
David s’interroge sur la notion de simplicité dans le cas du développement web : définition, objectifs, enjeux, méthode, etc. Les implications sont autant du côté de l’expérience utilisateur, de la question de la dette technique, mais également de l’accessibilité – en creux.
Me battre pour une meilleure expérience utilisateur plutôt que contre un framework, chercher à se faire plaisir davantage via ce qui est produit que par un contentement technique.
Que souhaites-tu aux générateurs de site statique ?
Mon plus grand souhait c’est qu’ils soient mieux compris de tous et perçus comme une vraie solution, honnête et prête pour la production, pour les sociétés intéressées dans la réalisation de sites web.
Bertrand Keller, Entretien avec Parker Moore de Jekyll
L’un des enjeux autour des générateurs de site statique, pointé par Parker Moore dans cet entretien, est la question de l’évangélisation dans des contextes professionnels, un sujet que j’aimerai aborder lors de la journée de samedi de Sud Web.
Inclure des utilisateurs non-voyants dans les tests utilisateur, une démarche encore isolée.
Marion Lévêque, 4 recommandations pour mener un test utilisateur avec des non et malvoyants
Retour d’expérience court mais intéressant, concernant un test utilisateur qui inclut des personnes non et malvoyantes.
Today, we’re pleased to tell you we’re extending our platform products, both the REST API and Twitter Cards, so that our customers, publishers and third-party apps will be able to publish images to Twitter that are accessible to people who are visually impaired.
Todd Kloots, Alt text support for Twitter Cards and the REST API
2016, Twitter implémente des solutions pour rendre les contenus non-textuels en partie accessibles, via l’utilisation de la balise alt et les Twitter Cards, bonne nouvelle !
J’aime le fait qu’on utilise un senseur interne, conçu pour détecter les mouvements propres de l’appareil, pour un usage externe. J’aime aussi le fait que l’ordinateur devient entièrement un bouton : on peut appuyer dessus n’importe où.
Baptiste, Cogner à son ordi
Utiliser certaines fonctions de certains ordinateurs pour faire ce que font d’autres appareils mobiles, un usage low tech séduisant par son minimalisme et son ingéniosité.
C’est la première fois qu’un livre me force à penser « tiens, une liseuse, ce serait peut-être mieux » plutôt que de défendre dur comme fer le papier.
Stéphane, Livre pas-électronique, le retour
Stéphane en avait déjà parlé sur son carnet, le livre numérique est une expérience qui ne le satisfait pas. Et là, devant la nécessité d’une lecture – amplifiée par le fait qu’il dispose du texte, mais pas du bon design –, le livre numérique apparaît comme une option tangible.
Intéressant en terme d’expérience utilisateur.
In its ruggedness and lack of concern to look comfortable or easy, Brutalism can be seen as a reaction by a younger generation to the lightness, optimism, and frivolity of todays webdesign.
Brutal Websites
Souvent épurés et typographiquement minimalistes, des sites web qui vont – un peu – à l’encontre de la mode actuelle. Ça fait du bien.
(Il y a des interviews avec la plupart des designers/propriétaires des sites présentés !)
Via bachbach.
Publishers, authors, bookstores, distribution channels: the publishing world is facing the digitalisation of content. This opens new opportunities to create and distribute ebooks and other digital publications, but it also generates changes into the value chain, that require professionals to collaborate to be at the edge of innovation.
EDRLab, EPUB Summit
L’EPUB Summit – qui s’est déroulé les 7 et 8 avril 2016 à Bordeaux – c’était “le rendez-vous des experts mondiaux du livre numérique”, et plus globalement de la publication numérique. Stratégie, rencontres et débats des acteurs de l’industrie du livre et du numérique – dont le W3C –, discussions autour du format EPUB, enjeux des DRM et de l’interopérabilité, etc. N’ayant pas pu m’y rendre, voici quelques liens qui synthétisent ces deux jours :
The average person with a smartphone or laptop and a stable internet connection probably spends more time interacting with typography in a single day than with food, music, and family combined.
[…]
Here’s a list of 5 easy ways to improve the typographic quality and effectiveness of any website, email, or digital product design.
Studio Function, Typography tips for a better user experience
Les cinq points abordés sont les suivants :
Typography is an invisible craft that permeates almost every aspect of our waking lives. Good typography has a major role to play in the creation of successful, memorable user experiences.
What makes a cool URI?
A cool URI is one which does not change.
What sorts of URI change?
URIs don’t change: people change them.
W3C, Cool URIs don’t change
L’éternel débat sur la forme et la pérennité des URLs – et donc des URIs – est ici vite réglé : il apparaît évident que les adresses doivent être compréhensibles, et pas uniquement par les machines, mais dans la pratique c’est plus complexe… Même avec une gestion fine des redirections – dans le cas d’un changement –, il faut tenter de concevoir des systèmes, des organisations et des arborescences les plus logiques, les plus lisibles, et les plus maintenables possible.
Chrome avait promis la disparition – visuelle – du champ URL dans le navigateur, nous n’y sommes pas encore. Et quand bien même, il faudra continuer à concevoir des systèmes compréhensibles afin de favoriser leur résilience.
Via Nicolas Hoizey.
User experience designers do so many things, but research is, for me, absolutely central to what we do and the contribution we offer to a design process.
Andrew Travers, Interviewing for research
Un petit livre, publié initialement en 2013 chez – feu – Five Simple Steps, qui semble bien utile pour mener des enquête d’usage en UX design.
Les porteurs de messages que nous sommes doivent respecter le lecteur et lui permettre ainsi de mémoriser facilement… Surtout que nous allons de plus en plus vers une information ou une distraction immatérielle.
Roger Bodin, Dis, c’est quoi la lisibilité ?
Le médium numérique n’a pas de matérialité sculpturale. Il permet seulement de réaliser une silouhette, avec les traits caractéristiques d’un caractère produit par la gravure et à l’échelle – exclusive – à laquelle il sera imprimé, en relief, à l’envers et en métal. Or, au lieu de retirer de la matière pour obtenir la forme voulue, le caractère numérique prend forme à l’écran par la modification de ses contours. Donc à proprement parler, une “reconstitution numérique” n’a simplement pas de sens.
John Downer, Call it what it is, Azimuts 43
Je ne suis pas tout à fait d’accord avec cette approche de John Downer – et l’exemple de Prototypo lui prouverait d’ailleurs le contraire, puisque le dessin des caractères se fait par leur centre –, mais cet article est passionnant.
À lire dans le dernier numéro – double – d’Azimuts, la revue du post-diplôme de l’École supérieure d’art et design de Saint-Étienne.
This is a demonstration of all the data your browser knows about you. All this data can be accessed by any website without asking you for any permission. Most of the data points are educated guesses and not considered to be accurate.
What every Browser knows about you
Robin Linus, avec cet outil, nous démontre – dans le cas où l’on ne le saurait pas encore ou si nous l’avions oublié – que nous donnons beaucoup d’informations simplement en visitant un site web : type de machine, système d’exploitation, navigateur (et version précise), extensions du navigateur, adresses IP, débit de la connexion, connexion à des services en ligne (et oui), etc.
Chez Medium, nous construisons un nouveau recoin de l’Internet spécialement conçu pour les personnes et les éditeurs souhaitant approfondir leur expérience de la conversation et de l’engagement.
[…]
Nous voulons que Medium soit votre espace d’écriture unique, votre seule destination pour publier du contenu.
Medium France, Rendre Medium encore plus puissant pour les éditeurs
Quel est le réel intérêt d’utiliser ce type de plateforme ? Disposer d’une plateforme en mode SAAS, un peu comme Wordpress ? Bénéficier du savoir-faire de Medium en terme de design, de technique (implémentation prévue de AMP notamment), de référencement, de performance et de disponibilité, et des outils de rédaction et de statistiques ? Ajouter à cela la dimension réseau social et l’interaction qui va avec ? Ce serait ce que Wordpress n’est pas totalement parvenu à faire, et le projet de Medium est séduisant.
Toutefois plusieurs limites me semblent apparaître assez vite :
Version anglaise de cet article.
Via Virginie Clayssen.
Créez votre site web à partir de preuves, pas à partir de légendes urbaines.
UX Myths
Version française de UX Myths, initiative de Zoltán Gócza et Zoltán Kollin, deux UX designers. Quelques exemples de ces légendes urbaines qu’il est nécessaire de démonter et d’expliquer avec tout projet web :
Il faut aussi aller voir les superbes posters réalisés pour l’occasion
Combien peut coûter un site web ? Combien de temps cela peut-il prendre de le faire réaliser ? Passer par une agence , un freelance, oui, mais comment trouver le bon prestataire ? Que faut-il préparer en amont avant de le contacter, le rencontrer ? Un cahier des charges, ok, mais qu’est ce qu’on y met ? Un contrat, un avenant, pour quoi faire ? Et puis après, l’étape suivante c’est quoi ?
Stéphanie Walter, Bien préparer son projet numérique
Stéphanie Walter met en ligne le support de la présentation qu’elle a réalisé avec Damien Senger autour de l’approche d’un projet “numérique” (mais il s’agit essentiellement de web) : c’est clair, concis, avec des rappels justes (la question des budgets pourrait être débattue).
Plus un instant de nos vies ne peut rester nôtre et si cela complique bien sûr, et tant mieux, la tâche des malfaiteurs, des corrompus et des terroristes, cela facilite tout autant celle des polices dans un monde où les dictatures et autres régimes autoritaires sont autrement plus nombreux que les démocraties.
[…]
Il est réjouissant de voir des potentats éclaboussés, tant de turpitudes dénoncées et un nouveau coup porté aux paradis fiscaux mais, à terme, ce n’est pas aux plus faibles mais aux plus forts, pas à la liberté mais à la dictature, que profitera la disparition, l’impossibilité du secret.
Bernard Guetta, La transparence et ses revers
Voici la vision de Bernard Guetta, d’une justesse hallucinante. Let’s encrypt (mais ça ne suffira peut-être pas).
Sanctuarisez vos contenus, respectez-vous et ça va payer.
Élie Sloïm, Chers producteurs de contenus, voici les bonnes pratiques qui pourraient peut-être conduire vos utilisateurs à désactiver adblock
Quelques bonnes pratiques qui pourraient – peut-être – permettre aux sites de contenus d’être plus respectueux envers leurs lecteurs.
Il faut également lire les commentaires, et notamment ce projet intéressant et intriguant : Obop.
C’est avec émotion que nous avons le plaisir de vous annoncer le lancement d’un site relayant les actualités de la communauté Jekyll en Français.
Bertrand Keller, Lancement de la communauté Jekyll France
Les intéressés et passionnés par les générateurs de site statique peuvent désormais se retrouver autour de cette jeune et belle initiave !
In a world where online connectivity is always expected but often spotty, it’s time we start looking to offline solutions. Check out this quick introduction to the “Offline First” web paradigm.
Siva Prasad Rao Janapati, Let’s Welcome Offline First
Une très bonne introduction au concept Offline First.
POSSE is an abbreviation for Publish (on your) Own Site, Syndicate Elsewhere, a content publishing model that starts with posting content on your own domain first, then syndicating out copies to 3rd party services with permashortlinks back to the original on your site.
IndieWebCamp, POSSE
Gràce à Sacha Goerg je découvre un concept que je défendais déjà en partie, mais dont je n’avais pas imaginé les potentialités, et que je n’avais pas aussi bien formulé !
If you can start posting notes (tweets) to your own site and POSSEing to Twitter, instead of posting directly to Twitter, you have taken a big step towards owning your data.
Même si les problématiques d’accessibilité du SVG qui peuvent exister devraient être traitées dans les temps à venir, il n’en reste pas moins que les polices d’icônes resteront la solution la plus pertinente à mes yeux pour l’intégration de petits éléments iconographiques.
Que ce soit en terme de maintenance, de lisibilité du code ou encore récupération d’un projet par des développeurs tiers, les polices d’icônes gagnent de loin la bataille.
Damien Senger, Police d’icônes vs. SVG : l’exigence d’accessibilité au cœur du combat.
Pour faire court :
On a tendance à l’oublier mais le code que nous produisons peut être amené à être vu, maintenu ou réutilisé par d’autres développeurs.
I need the source code to my blogging system. That’s part of my blogging experience, being able to evolve the software.
Dave Winer, Blogging like it’s 1999
Dave Winer explique en quelques lignes, dans cet article d’octobre 2015, comment son blog de 1999 était bien plus efficient, résilient, modulable et évolutif qu’aujourd’hui, comparé notamment à des outils de diffusion comme Facebook ou Twitter.
Entre la volonté de maîtrise, la puissance de la diffusion et les potentielles évolutions.
So in a way, my “better blogging system” would just be what I already had working 15 years ago.
Via Karl (si je me souviens bien).
Bref, ne faites pas un site, offrez un service unique, nouveau, tellement captivant et vraiment utile.
Fuuuuuuuuuu, Vous n’avez pas besoin d’un site web.
Réflexion drôle et provocatrice, et pourtant très juste : disposer d’un site web ne veut pas dire grand chose, et ce n’est pas une bonne approche pour un besoin qui peut potentiellement prendre la forme d’un site web.
Outil de recherche d’un produit, service de réservation, expérience, instrument de suivi ou de mesure d’audience, dispositif de gestion de comptes clients, etc. Il ne s’agit plus de “présence en ligne” mais de services et applications.
“C’est bien sympa de faire de la 3D sur le web mais quand je vois la tronche de javascript ça donne pas envie de se lancer dans un truc aussi risqué.”
Pas de problème camarade développeur-web-râleur. Je vais te montrer le chemin pour faire du joli code bien solide. Tu vas voir, la 3D sera au final bien plus simple à gérer que si tu devais t’atteler à le faire en natif par exemple.
Alexis Bouhet, WebGL : Workflow
Description d’un workflow – complet ! – pour utiliser la technologie WebGL, ici avec le cas du site web de l’agence grenobloise La Haute Société.
Finally, I can only advice you to consider migrating as soon as possible to HTTPs.
Damien Jubeau, Passer au HTTPs est nécessaire, et pas uniquement pour le SEO
Les arguments en faveur d’HTTPs commencent à être nombreux :
System fonts can be beautiful.
Webfonts are not a requirement for great typography.
Adam Morse, Webfonts
Adam Morse présente ses arguments pour modérer l’usage des web fonts, j’ajoute quelques éléments :
Il y a deux ans, nous publiions un petit guide des magazines et revues incontournables dédiées aux technologies numériques. Maintenant que certaines de ces revues sont devenues davantage mainstream, à l’instar de dis magazine invité cette saison à commissionner l’exposition Co-Workers au MAM, il est temps de revenir à la charge avec un florilège de nouvelles publications suaves et exotiques.
Loup Cellard, Suaves et exotiques revues des internets
Des ressources fortement intéressantes !
Lorsqu’un nouveau média emprunte à un média préexistant, une partie de cet emprunt est sensée, mais le reste n’est pas réfléchi, il est « rituel », et limite souvent le nouveau support. Avec le temps, le dernier-né développe ses propres conventions, rejetant celles qui ne veulent plus rien dire.
[…]
Il est temps de reléguer aux oubliettes les rites de l’imprimé, et de s’engager à fond dans le média virtuel et sa nature propre.
[…]
En tant que designers, nous devons repenser ce rôle déifié, abandonner l’idée du contrôle, et explorer un nouveau mode relationnel avec la page.
John Allsopp, Le tao du design Web
Cet article a été publié en février 2003 – et en avril 2000 pour le texte original en anglais – et pourtant il est intéressant de se (re)plonger dans ces enjeux et relations entre imprimé et numérique, qui sont encore bien présents aujourd’hui – même 16 ans plus tard. Quelques extraits :
Construisez des pages qui sont accessibles, indifféremment de la plateforme ou de l’écran que votre lecteur a choisi ou qu’il doit utiliser pour parvenir jusqu’à vos pages. Cela signifie faire des pages qui sont lisibles indépendamment de la résolution ou de la taille de l’écran, du nombre de couleurs (et rappelez-vous aussi que certaines pages doivent être imprimées ou lues par des logiciels de synthèse vocale, ou encore lues via des navigateurs braille). Cela signifie des pages qui s’adaptent aux besoins d’un lecteur dont la vue est tout sauf parfaite et qui désire lire des pages avec des polices de caractères de très grande taille.
Concevoir des pages que l’on peut adapter, c’est concevoir des pages accessibles.
Laissez la forme emboîter le pas à la fonction, plutôt que de tenter de prendre un design spécifique et de le faire “fonctionner”.
Divers périphériques (webtélé, moniteurs à haute résolution, assistants numériques personnels) ont des tailles de fenêtre minimales et maximales fort différentes.
Le temps est venu pour le média Web de se redéfinir au-delà de ses origines, au-delà de l’imprimé. Non pour le simple plaisir d’abandonner autant d’érudition et d’expérience, mais pour tracer, lui aussi, sa propre voie, lorsque cela est indiqué.
Je crois que la plus grande force du Web est souvent perçue comme une limite, comme un défaut. La flexibilité fait partie intégrante de la nature du Web et c’est notre rôle à nous, concepteurs et développeurs, d’épouser cette souplesse, et de créer des pages qui, fortes de cette adaptabilité, deviendront accessibles à tous.
At the end I asked the room, “who is happy with their solution?”. Only one person put their hand up. She had tried every nerdy backup tool imaginable, and abandoned them all.
Instead, she keeps files on her computer and her relative’s computer. If she’s making a document she cares about, she transfers it by USB stick between the computers, to make sure there are multiple copies in different places. And that’s it.
Unsophisticated? Not at all. Way easier than backing up paper. Understandable by anyone. Full control. Cheap.
Francis Irving, Sync/Backup workshop at Redecentralize Conference
J’ai moi aussi testé nombre de services de stockage et de synchronisation, la meilleure solution est la plus simple, et la plus résiliente.
Défendre sa vie privée passe par deux réactions principales :
Primo, partagez avec vos proches ces arguments pour la défense de l’intimité et son importance dans notre monde hyper connecté. Faites-en un sujet de nombreuses discussions et défendez-la comme un droit fondamental, à l’aide des armes dont vous disposez désormais.
Secundo, protégez-vous, formez-vous peu à peu à la compréhension des enjeux du numérique, puisqu’il est désormais omniprésent dans nos vies.
Benjamin Sonntag, De l’intimité et de sa nécessité
Un beau texte qui défend la vie privée, il est temps de considérer l’intimité numérique et ses implications, pour nous permettre de vivre ensemble dans les meilleures conditions.
Depuis plusieurs mois, ce blog est propulsé par Jekyll et Codeship. Une page explicative existe, mais elle est « vivante » et si je change quelque chose demain, elle évoluera. J’utilise donc un article daté pour figer un peu les choses, et tant pis pour le contenu dupliqué.
Boris Schapira, Un blog avec Jekyll et Codeship
Boris Schapira explique tous les outils qu’il utilise pour son carnet statique, du générateur (Jekyll) à la publication (via Codeship) en passant par un peu de technologies front (CSS, accessibilité et chargement des polices).
Empowering designers with beautiful and accessible color palettes based on WCAG Guidelines of text and background contrast ratios.
Color Safe
La question du contraste entre la couleur du fond d’une page et la couleur du texte est déterminante ! Un texte en gris clair sur du blanc ? Le ratio ne sera pas suffisant pour une lecture par toutes et tous.
Calculer ce ratio n’est pas si simple à calculer (d’ailleurs Sébastien Delorme d’Atalan avait publié des outils d’analyse des contraste d’une charte), ColorSafe facilite la recherche de couleurs avec un outil en ligne très simple d’utilisation.
Ce que nous aimerions voir plus souvent, ce sont des sites mieux conçus, qui inspirent confiance, qui facilitent la vie et qui ne jouent pas l’esbroufe.
Douglas & Douglas, Communiquer par la qualité: les bonnes pratiques Opquast
Arguments en faveur de la mise en qualité des sites web, pour des questions de performance, de stratégie, et de confiance. Intéressant.
Revenir à des choses simples et performantes, c’est la philosophie du gestionnaire de contenu statique. Beaucoup plus rapides par défaut, plus sécurisés, et donc moins onéreux. Ils connaissent une popularité grandissante, due en partie à leur simplicité d’utilisation et à la facilité avec laquelle ils permettent de faire du déploiement continu, à savoir plusieurs dizaines de mises en production par jour. Cette philosophie qui a toujours animé la communauté open-source anime aujourd’hui celle des startups et des organisation agiles.
Frank Taillandier, La mouvance statique
Frank Taillandier parle de gestionnaires de contenu statique, et il en parle bien ! J’avais écrit un article à ce sujet, bien moins documenté, et moins axé sur la performance.
Frank aborde des arguments de poids pour comprendre et adopter cette voie !
Non décidément le statique n’est pas qu’une mode destinée à rester confidentielle parmi les hackers. C’est une solution qui vous devriez sérieusement considérée si vous souhaiter atteindre des objectifs de qualité à moindre coût pour des sites de contenus (landing page, documentation, blogs, etc.) ou des single page app. Son écosystème est lui aussi en plein essor et va continuer de se développer.
Millimetre is a series of fonts constructed on a grid based on the metric system. It follows the decimal logic of the latter.
VTF, Millimetre
Nouvelle font créée par Jérémy Landes-Nones et publiée par Velvetyne Type Foundry, sous licence SIL Open Font License, Version 1.1.
72 règles destinées aux producteurs de données ouvertes.
Opquast Check-Lists, OpenData
Les référentiels et check-lists d’Opquast concernent aussi l’open data, et pas uniquement la qualité web.
API, animation, format, licence, nommage, vie privée, autant de catégories pour les 72 règles à travers ce projet animé par Temesis.
Back Office est une revue annuelle entre design graphique et pratiques numériques co-éditée par les Éditions B42 et Fork Éditions. Elle explore les processus de création en jeu dans la diversité des médias et des pratiques numériques contemporaines. En traitant de thématiques telles que le rapport code/forme, les enjeux des outils de création ou la perméabilité des médias, elle constitue un espace de réflexion unique en langue française et un vecteur de visibilité à l’international pour la communauté francophone.
Back Office
En référence à Back Cover des éditions B42, la revue Back Office aborde les questions de design numérique. À suivre de près !
Sud Web est la conférence itinérante des travailleurs du web pour apprendre, comprendre et partager nos expériences.
Sud Web 2016
Le programme de Sud Web 2016 est révélé, et les inscriptions ouvertes !
Parler métier à travers des conférences originales, dans un format à taille humaine (environ 120 participants), Sud Web c’est un peu les Rencontres de Lure du web en plus court !
(Et le sujet que j’ai proposé, Le fanzinat des gens du web, a été accepté !)
We identify a set of properties desirable in a concrete implementation of data citations, considering the full publishing pipeline as well as the needs of landing pages for datasets. Building on top of these properties, we describe the specific implementation approach that we take, built completely on top of Web standards. Web technology is found once again to be awesome and more versatile than people expect.
Robin Berjon, Web-First Data Citations
Notre vision de designer nous pousse à soigner tant le résultat que le processus de création.
Rezo Zero
Le studio/agence Rezo Zero a mis en ligne son nouveau site web, graphique et dynamique : beaucoup d’effets, de belles références bien présentées, un positionnement plus axé design et contenu que web, et le tout avec leur CMS Roadiz.
Beaucoup de choses à dire sur ce site, qui mériterait un article assez long.
Les raccourcisseurs d’URL sont devenus incontournables sur le Web depuis quelques années, mais initialement pensés comme outils de facilitation de partage, ils ont beaucoup évolué et sont surtout devenus des outils de tracking.
[…]
Le cumul des temps passés pour chaque redirection avant d’arriver à la “vraie” requête pour la page voulue est de 1 300 millisecondes, presque une seconde et demi de perdue !
Nicolas Hoizey, Le gros impact des raccourcisseurs d’URL sur la performance
Le coût du tracking est aujourd’hui celui de la performance, ce qui n’est pas forcément une bonne stratégie sur le long terme (rapidité de chargement et sentiment associé de l’utilisateur, sécurité, et référencement).
“Hé Monsieur, voici notre première itération, un pneu avant. Qu’en pensez-vous ?”
Le client réagit de la sorte : “Mais qu’est-ce que vous fichez à me livrer un pneu ? J’ai commandé une VOITURE ! Qu’est-ce que je suis supposé faire avec ça ?”
Frank Taillandier, Comprendre le MVP (Produit Minimal Valable ) - et pourquoi je lui préfère un produit rapidement testable, utilisable et adorable
Frank traduit un article d’Henrik Kniberg qui vise à mieux expliquer le concept de MVP (Produit minimal valable), et lui préférer l’expression produit rapidement testable, utilisable et adorable.
Article qui contient beaucoup d’exemples très instructifs !
AMP (pour Accelerated Mobile Pages) est un projet open source initié par Google qui a pour objectif d’accélérer significativement le temps de chargement d’une page. Il s’agit notamment d’améliorer la vitesse d’affichage des pages articles sur mobile, mais rien n’empêche de le déployer sur d’autres supports comme les tablettes, ou bien de viser d’autres types de contenu.
Olivier Keul, AMP Project booste le chargement des pages web
Une définition et un aperçu de ce que permet AMP.
Cela se traduit par une version de la page article « standard » et une version AMP. Cette dernière doit respecter les spécifications techniques imposées et être poussée sur un CDN appartenant à Google afin d’optimiser le temps de chargement.
- Use the correct semantic structure for headings
Rebecca Topps, 10 ways you can consider web accessibility in design
Rebecca Topps propose 10 façons de prendre en compte l’accessibilité en design. Il s’agit plutôt de 10 points importants – de la structuration des contenus aux formulaires en passant par le repérage dans le site – à intégrer à chaque conception.
Dans cet article j’essaye de comprendre et d’expliquer, en m’appuyant sur de nombreuses sources, le fonctionnement global du navigateur lorsqu’un utilisateur requiert une page web en tapant son nom dans une barre d’adresse.
Thibault Mahé, Optimiser le frontend (2) : comprendre le navigateur, de la requête à l’affichage
Billet très détaillé et très documenté sur le fonctionnement complet d’un navigateur. Très utile de revenir à des bases pour comprendre comment intégrer, et comment travailler avec le web.
I personally think that people who are skilled at frontend design are in a great position to help bridge the divide between the design and development worlds.
Brad Frost, Frontend Design
L’éternel questionnement sur la définition du webdesigner ou frontend designer, avec le regard très juste de Brad Frost.
Pour rappel, lire également le billet de STPo : Je ne suis pas développeur.
As web developers, we are responsible for shaping the experiences of user’s online lives. By making choices that are ethical and user-centered, we create a better web for everyone.
Ethical Web Development
Un manifeste en quatre points, des articles et un livre en cours de rédaction ouvert aux participations.
Un beau projet d’Adam Scott.
Progressive enhancement is a term that often insights intense debate. For many, progressive enhancement can be summed up as “make your site work without JavaScript.” While, developing a site that works without JavaScript often does fall under the web of progressive enhancement, it can define a much more nuanced experience.
EPUB as it exists today is not directly usable by a web browser. The web-friendly content files are inside a zip package, which also contains container and package files expressed in a custom XML vocabulary.
The goal of a browser-friendly format (henceforth EPUB-BFF) is to make it easier for web developers to display EPUB content by [1] allowing an unzipped (“exploded”) publication, and [2] by providing an alternative serialization of the information in container.xml and the package document(s).
Dave Cramer, Browser-friendly format for EPUB 3.1
Des pistes intéressantes pour passer facilement du format EPUB à un format lisible dans un navigateur.
The process, which started seven years ago, means Netflix no longer uses its own data centres to host its video service and will now use Amazon Web Services, which is run by Amazon. The company will also use some Google services for its archives.
Max Slater-Robins, Netflix has completed its move to the cloud — and it’s a big win for Amazon
Ce n’est pas un détail, Netflix n’utilise désormais que les services d’Amazon – Amazon Web Services – ou de Google pour son infrastucture technique. Même si c’est Netflix cela pose beaucoup de questions, est-ce un réel changement de paradigme ?
Swiss in CSS is a homage to the International Typographic Style and the designers that pioneered the ideas behind the influential design movement.
swiss in css
Magnifique travail de design graphique, suisse et en CSS – et un peu de JavaScript pour les affiches en mouvement.
Dans le dépouillement, l’absence de substance se révèle.
Karl, Le dépouillement Web
Le web mis à nu, en quelque sorte. Et l’absence de mise en forme – CSS + JS – modifie notre appréhension des contenus, notre façon de lire.
L’importance de s’interroger sur nos pratiques par rapport à un web omniprésent – pour reprendre l’expression de David – et omnimouvant.
Recently, Service Workers made quite some noise and people encourage to use this very newest technology on every website. But when I looked at the implementation and specification, I ended up having more questions than answers to it.
Anselm Hannemann, Open Service Worker Questions
Retours et questions – et quelques réponses – sur Service Workers, le protocole qui permet de gérer le hors connexion pour le web.
Devenir un auteur local sur internet, c’est pour moi essayer de prouver qu’on n’est pas obligé de chercher la starification dans la création, qu’on n’est pas obligé de souffrir du syndrome du bestseller. Qu’on peut chercher des voies modestes sans en éprouver ni gêne ni honte — simplement un puissant sentiment partagé d’ancrage dans une réalité ; un immense enthousiasme aussi. Et me donner une chance, à ma mesure et à mon rythme, de faire l’expérience du longseller.
Neil Jomunsi, Contre le bestseller, créer local
Neil Jomunsi entrevoit la possibilité de créer une communauté, des communautés, autour de créatifs et de créations. Beau projet à taille humaine et pourtant numérique – en tout cas diffusé via le web –, qui est déjà en place dans une certaine mesure, et notamment via les carnets web.
Le HTTPS est une excellente chose sur le fond. Le principe même de rendre la navigation plus sécurisée est forcément louable. Une migration peut très bien se passer en étant bien gérée.
Mais ce type de migration qui va vous coûter du travail ou des sous, vous faire prendre des risques sur le plan SEO, ne la faites pas en espérant un quelconque bonus de Google.
Sylvain, Ne passez pas au HTTPS pour de mauvaises raisons…SEO
Article bien documenté et très clair sur l’intérêt, ou non, de passer en HTTPS pour des questions de référencement.
Si vous implémentez le HTTPS, faites-le pour vos visiteurs !
En observant les ePubs produits de manière industrielle dans les pays à bas coût, il apparaît clairement que la qualité du code produit – un ePub n’est rien d’autre que du code HTML et des CSS, à l’égal d’un site Internet – va empêcher une maintenance aisée au fur et à mesure des années, même pour effectuer des modifications mineures.
Lekti, Production de livres numériques (ePub) et dette technique
J’y avais songé en lisant La dette technique de Bastien Jaillot, Joël Faucilhon l’exprime très bien en quelques paragraphes, comme Jiminy Panoz l’évoque régulièrement sur les réseaux. Il est temps de prendre conscience de problème.
Peut-être un changement de tendance. À vous de juger.
15marches, Ras-le-bol des startups
15marches déroule un certain nombre de critiques argumentées contre le modèle des startups. Il manque des propositions et des exemples d’expériences humaines et de projets qui vont à contre courant.
Peut-être que ce discours de bon sens nous permettra de mettre d’accord tout le monde autour d’un postulat simple : entreprendre est une aventure magnifique, qu’il faut encourager. Il n’a jamais été aussi simple d’innover à l’ère d’internet, et chacun doit prendre son destin entre ses mains. Changer le monde, mais chacun à sa mesure et à son rythme.
Cher ami, la rédaction des spécifications fonctionnelles & techniques détaillées, permet de définir de manière précise le fonctionnement de votre application. Cela permet à l’ensemble des membres du projet d’avoir une vision précise du projet. Cela évite, par exemple, des phrases comme : “Mais c’est logique”, “Mais tout site e-commerce a un zoom” et bien d’autres, qui ont la fâcheuse tendance à perturber la bonne marche de votre merveilleux projet.
Alors toi aussi tu veux un site web ?
Un peu d’humour pour aborder la relation et la communication entre un client et un prestataire dans le domaine du web. Un dialogue – peut-être pas si fictif – qui lève des fantasmes et appuie sur des réalités souvent occultées. C’est drôle et juste !
Lorsqu’une action est réalisée par l’utilisateur :
- soit elle est interceptée par JavaScript côté client, l’action est alors traitée par la partie Redux de l’application pour mettre à jour les données, puis la vue est rendue grâce à React ;
- soit elle est envoyée sous forme d’URL au serveur, l’action est alors traitée par la partie Redux de l’application pour mettre à jour les données, puis la vue est rendue grâce à React côté serveur avant d’être envoyée en pur HTML au client.
Samuel Bouchet, « Full-js » et « no-js » avec React + Redux
Samuel Bouchet explique de façon très pédagogique l’association de deux composants pour la construction d’une application web pouvant répondre à la fois à une volonté de réactivité ou à une contrainte contextuelle – sans JavaScript.
Depuis sa naissance dans les années 1990, le Web a connu un essor considérable, qui a notamment fait apparaître de nouveaux métiers, qui n’existaient pas auparavant. Parmi eux, nous pouvons citer les webmestres1, les édimestres2, les développeurs et programmeurs, ou encore, plus récemment, les architectes de l’information.
Marine Mayon, Fiche de lecture : Architecture de l’information : méthodes, outils, enjeux, J.-M. Salaün et B. Habert
Résumé contextualisé du livre de Jean-Michel Salaün et Benoît Haber sur l’architecture de l’information.
Les architectes de l’information sont donc les spécialistes de l’organisation et de la repérabilité de l’information.
Un des soucis avec un site statique tel que celui-ci, c’est que par définition il rend compliquée la mise en œuvre de fonctionnalités habituellement dynamiques. Les commentaires viennent immédiatement à l’esprit, et seront évoqués ultérieurement, mais la mise en place d’un moteur de recherche interne n’est pas plus simple. Heureusement, Algolia est là.
Nicolas Hoizey, Un moteur de recherche sur un site statique ? Facile avec Algolia !
Nicolas propose des solutions pour intégrer un moteur de recherche dans un site statique, Algolia semble être une solution intéressante et facile à implémenter !
Il y a 9 mois, toute l’équipe de Paris Numérique s’est lancée dans la refonte de Paris.fr. Flash-back en coulisses.
Comment Paris Numérique a refait Paris.fr.
Le nouveau site de la Ville de Paris – sorti en juin 2015 – est remarquable pour de nombreuses raisons – accès, arborescence, structuration, ergonomie, architecture, accessibilité, etc. –, l’équipe de Paris Numérique raconte un peu comment ils ont procédé. Un beau projet avec une équipe intégrée et non une prestation extérieure.
Je me demande, dans ma difficulté à les lire, ce qui vient des textes (leur style, leur sujet, les cheminements de l’auteur, du traducteur, que sais-je encore) et ce qui vient du support. Vue la variété de mes lectures d’une façon générale, je tends pour le support.
Stéphane, Livre numérique : pas encore probant pour moi
Le regard de Stéphane est plein de spontanéité. À lire avec attention, en prenant en compte les commentaires qui complètent certains points.
Lecture et écriture, lecture passive et lecture active ; effectivement le sujet est plus vaste et ne se résume pas au support. Il faudrait que je creuse les types de lecture et leur adéquation pour moi à un support ou à l’autre.
J’attends un deuxième billet pour mieux comprendre les pratiques de Stéphane !
Le point essentiel est donc de savoir gérer l’échec dans un projet. Ne pas le préparer revient à le garantir, car – Loi de Murphy (http://fr.wikipedia.org/wiki/Loi_de_Murphy) aidant – vous pouvez être certain que le pire scénario finira par se produire. Évitez de ne compter que sur votre bonne étoile.
Bastien Jaillot, La dette technique, page 63
Le livre de Bastien Jaillot publié par Le train de 13h37 est concis, clair, utile. Ce passage – et sa suite – en est un bon exemple.
Ça va faire près de vingt ans que j’ai accès au Web. Et quasiment autant de temps que j’écris, partage, et publie gratuitement du contenu en ligne. Je n’ai pas vraiment de modèle économique dans tout ça. Je le fais parce que ça me plaît. Je le fais parce que j’apprends du retour des autres. Je m’enrichis, mais pas financièrement. Et ça vaut largement la quarantaine d’euros annuelle en hébergement que me coûte ce présent blog.
HTeuMeuLeu, La publicité n’est pas le modèle économique du Web
Le grand débat du modèle économique du web revient régulièrement, et ce d’autant plus depuis quelques mois. HTeuMeuLeu offre une vision très intéressante.
Je suis pratiquement sûr que si on enlevait toute la publicité du Web, il resterait plein de sites très bien.
Sur le web, consultable sur des périphériques de tailles variées, avec des préférences utilisateurs diverses, c’est d’autant plus important qu’on ne peut savoir où se feront les retours à la ligne.
Vincent Valentin, L’espace insécable
Qu’est-ce qu’un espace insécable ? Comment le gérer sur le web ? Vincent Valentin répond à ces questions de façon très pédagogique, avec des exemples concrets et des astuces – et quelques interrogations, aussi.
Jamais, pourtant, n’ai-je entendu parler de linguistique dans cette quantité monumentale d’articles sur le design. Et ce même dans les articles traitant par exemple des messages système auxquels l’utilisateur a souvent fort à faire…
Le fait est que je crois sincèrement que nous devrions intégrer la linguistique dans nos approches de conception. Et je vais tenter de vous expliquer pourquoi.
Jiminy Panoz, La linguistique comme outil de design
Pour ceux qui l’ignoraient, 6/5 représentera une révélation, en plus de s’avérer un passionnant document sur l’histoire de la Finance et des marchés financiers. Les lecteurs les moins naïfs ne seront pas étonnés de trouver dans les deux récits qui se succèdent (du chapitre 6 de 6 au chapitre -5 de 5) toutes les raisons de s’inquiéter. On sait, en effet, que l’économie des pays développés (voire l’économie mondiale), est corrélée à l’état de santé des bourses. De là à dire que les vies de milliards de gens dépendent du fonctionnement de quelques ordinateurs, il n’y a qu’un pas…
Hard Cover, 6/5
Un ouvrage à découvrir, tant pour sa forme – graphique, documentaire et littéraire –, que pour l’histoire des techniques de communication qui y est très justement racontée.
6/5, un livre incontournable pour quiconque est doté d’un peu de curiosité intellectuelle, fait donc œuvre de salubrité publique en en dévoilant au lecteur quelques secrets.
Internet est-il trop centralisé ? Sommes-nous au bord de la congestion du réseau des réseaux ?… Ces alarmes reviennent régulièrement.
Hubert Guillaud, Avons-nous besoin d’une vitesse limitée sur l’internet ?
Un article d’Hubert Guillaud, bien documenté, sur la supposée congestion des réseaux. À noter que la façon dont sont conçus les sites web est un point important à ne pas négliger.
Nous construisons de petits mondes isolés, pour nous séparer de la société. Nous avons mis un casque sur nos yeux et nous marchons parmi la foule. Nous pourrions tout aussi bien être des zombies, personne ne s’en soucierait. (…) Nous avons la capacité, mais elle n’est pas distribuée. Nous centralisons tout. La nourriture, l’argent, le pouvoir, les décisions.
À lire ailleurs, Peter Sunde : “J’ai abandonné” - Motherboard
Constat sombre sur l’internet et le web, avec toutefois des pistes de résistance. Il nous appartient de changer les choses.
Malgré la présence de nombreuses normes, le WCAG ou le RGAA en France, les développeurs web en charge des sites et de la mise à disposition de ressources numériques intègrent encore peu ces normes et ces logiques informationnelles.
Vincent Liquète, L’accessibilité web comme porte et enjeu de médiation des savoirs
Intéressante approche de l’accessibilité web, vue par un universitaire.
Early this year, the Internet Archive put out a call for a distributed web. We heard them loud and clear.
kyledrake, HTTP is obsolete. It’s time for the distributed, permanent web
Stéphane m’avait signalé ce protocole il y a déjà plusieurs mois, IPFS – InterPlanetary File System – est un moyen de contourner les contraintes du protocole HTTP et les phénomènes de centralisation :
IPFS is a distributed file system that seeks to connect all computing devices with the same system of files. In some ways, this is similar to the original aims of the Web, but IPFS is actually more similar to a single bittorrent swarm exchanging git objects. IPFS could become a new major subsystem of the internet. If built right, it could complement or replace HTTP. It could complement or replace even more. It sounds crazy. It is crazy.
L’article résume très clairement les objectifs de IPFS, The Permanent Web.
I want to share with you my simple two-step secret to improving the performance of any website.
- Make sure that the most important elements of the page download and render first.
- Stop there.
You don’t need all that other crap. Have courage in your minimalism.
Maciej Cegłowski, The Website Obesity Crisis
Il s’agit de la transcription d’une intervention de Maciej Cegłowski : le web a un problème, les pages web sont trop lourdes, et ça ne va pas en s’améliorant. Maciej Cegłowski décortique ces questions de chargement, de poids, de performance, de choix techniques et technologiques. Comment et pourquoi le problème n’a-t-il pas été résolu pour le moment ? Quelles solutions envisager ?
Let’s preserve the web as the hypertext medium it is, the only thing of its kind in the world, and not turn it into another medium for consumption, like we have so many examples of already.
Let’s commit to the idea that as computers get faster, and as networks get faster, the web should also get faster.
Keeping the Web simple keeps it awesome.
Les Nouveaux Loup du Web est un documentaire, et plus précisément la version française du documentaire Terms and Conditions May Apply, qui démontre ce que les entreprises et les gouvernements peuvent apprendre sur vous au travers de votre vie numérique, le plus souvent à partir d’informations confiées volontairement à des services en ligne.
Framasoft, Les Nouveaux Loups du Web
Rien à voir avec Citizen Four de Laura Poitras, extraordinaire tant sur le fond que sur la forme, Les nouveaux loups du web est une bonne entrée en matière pour découvrir ce qui se passe derrière le web d’aujourd’hui, et en prendre conscience.
Quand nous décidons d’écrire, c’est parce que nous pensons avoir modestement quelque chose à apporter, peu importe la taille de l’audience. Nous écrivons parfois pour nos collègues, pour nos clients, pour nos amis des communautés open source auxquelles nous appartenons, par jeu entre collègues, pour surprendre…
Simon Georges, Bien commencer à écrire un article de blog
L’idée, la recherche, le plan, le fond, la forme, etc., Simon Georges de Makina Corpus explique très clairement les différentes étapes de rédaction d’un article de blog ou carnet.
Notre cerveau est formidable mais il a ses limites. Surtout le mien.
J’ai remarqué que l’utiliser comme une mémoire induisait un stress, celui d’oublier, et empiétait sur ma créativité et mon humeur. Sans compter que j’oubliais malgré tout certaines choses. J’ai donc graduellement confié tout ce qui concernait le fait de “se rappeler” à un outil externe. Mon cerveau est donc entièrement consacré à la créativité. Une véritable source de bonheur et d’apaisement !
Lionel Dricot, Comment j’ai étendu les capacités de mon cerveau
Étranges conceptions, et notamment celle du bonheur – possible uniquement sans stress d’après Lionel – ou celle de la créativité – sans contrainte. Une créativité sans contrainte, lisse, je me demande à quoi ça ressemble.
Je ne pense pas que je pourrais être apaisé ou plus créatif si je déléguais ma mémoire à des machines. Vouloir limiter le travail du cerveau ne va pas étendre ses possibilités, bien au contraire. Plutôt que de mettre en place un workflow – complexe et reposant sur des services tiers dont j’espère que Lionel a bien lu les conditions générales d’utilisation – pour tout enregistrer, peut-être qu’il faut se poser la question de l’exhaustivité, et de son utilité.
Dissocier la mémoire de la créativité, vraiment je ne comprends pas.
Le transhumanisme n’est donc pour moi pas de l’anticipation mais bel et bien une réalité que nous vivons tous au quotidien, à des niveaux différents.
Static websites today are just like vinyl LPs: they’re coming back.
Brian Rinaldi, Static site generators: the latest tools for building static websites
Un livre, gratuit et en anglais, sur les générateurs de site statique, idéal pour celles et ceux qui veulent découvrir Jekyll et autres static site generators – j’en ai parlé ici et là.
Ce qu’il faut bien comprendre, c’est qu’au-delà de ce que griffonne le designer dans son carnet à dessins, un cahier des charges ouvert, ça n’existe pas. Il y aura toujours des restrictions imposées par le contexte, si elles ne le sont pas déjà par le contrat, ainsi que des contraintes financières, matérielles et d’autres relatives aux conditions de production.
Norman Potter, Qu’est-ce qu’un designer, page 67
Le logiciel ne dévore pas le monde, nous l’alimentons. Quotidiennement, nous envoyons des données sur le réseau qui se nourrit de nos relations, de nos textes, de nos media, de nos réactions et de nos parcours. En échange de quoi nous obtenons des recommandations.
David Larlet, Web
Après l’exercice de publier une réflexion par jour, David lance un lexique qu’il alimente régulièrement. Nouvelle contrainte, nouvelles idées, à suivre.
Plutôt que d’y chercher un changement d’état d’esprit, on n’y prend que la méthodologie.
Eric Brehault, Bien démarrer avec Scrum
Description très claire, et vision très réaliste d’une méthode agile : Scrum.
Le contrat implicite de Scrum est simple, il ne contient qu’une seule clause: cette démo doit être bien.
Cette démonstration va tout conditionner : la perception que le client a de notre travail, la confiance qu’il va avoir en nous, et partant, le degré de liberté qu’on aura sur les sprints suivants.
En informatique de réseau, l’erreur 451 (“Unavailable For Legal Reasons”) est un code d’erreur du protocole de communication HTTP, renvoyé par un serveur HTTP pour indiquer que la ressource demandée (généralement une page web) est inaccessible pour des raisons d’ordre légal.
Il s’agit donc d’une erreur similaire à l’erreur 403 (“Forbidden”) (avec laquelle elle partage le premier “4” indiquant l’indisponibilité de la ressource), apportant à celle-ci la précision du motif de l’indisponibilité. L’erreur pourrait servir à indiquer qu’une page est censurée sur un réseau par un gouvernement ou une décision de justice. Une éventuelle page d’erreur permettrait de donner des informations quant à la décision de justice rendant la page inaccessible légalement, décision pouvant toucher à la sécurité nationale, au droit d’auteur, à la vie privée, au blasphème…
Wikipédia, Erreur HTTP 451
Fascinant et perturbant, impossible de ne pas penser au “code is law” de Lawrence Lessig.
So, let’s talk about websites—but not the way I’d talk about furniture, if you gave me half a chance. This is about the user that just wants to keep their coffee off the floor. They don’t care about the website. They don’t care about frameworks; they don’t care about browsers. They want their information and they want to get out. A website, to them, is its purpose.
Mat “Wilto” Marquis, Smaller, Faster Websites
Après une introduction à base de généralités percutantes et de chiffres précis – notamment sur les usages desktop et mobiles, ou sur les qualités des connexions–, Mat “Wilto” Marquis propose beaucoup de méthodes – très concrètes – pour gagner en légèreté et en rapidité.
We build a connection between every single person in the world and all the information in the world. We do more than just build websites—I don’t care about websites. I care about purpose.
Git et plus largement les systèmes de gestion de versions qui sont largement utilisés par les développeurs pour versionner, comparer, archiver, sont plus que des programmes : je les considère comme des outils méthodologiques. Si leur apprentissage nécessite du temps et certains acquis, ils sont très inspirants et provoquent de bons réflexes, notamment pour la documentation et l’archivage, et posent frontalement la question des licences : quelles libertés laisser au public du projet ? Accès au code ? Modification ? Redistribution ?
Entretien avec Raphaël Bastide avec Sarah Discours, Matière code
Sur la revue From—To de l’ÉSAD Grenoble Valence – j’en ai parlé ici –, Sarah Discours interroge Raphaël Bastide sur son travail d’artiste, de designer, de développeur, d’enseignant. Passionnant pour plusieurs raisons : le rôle que joue la documention dans le travail de Raphaël Bastide ; son utilisation des logiciels, programmes et applications en lien avec l’art ; et son usage du libre.
Travailler avec du libre devient pour tous plus captivant, cela permet notamment de découvrir tout un écosystème autour du design. Le design libre a aussi l’énorme potentiel de nous faire découvrir de nouvelles choses et de faire émerger de nouvelles formes, c’est pour moi un avantage majeur. […]
Le choix du libre configure mon espace de travail, harmonise mes projets, il devient un repère et une contrainte féconde. Ce choix est naturel pour moi et chaque jour j’en mesure les bénéfices.
Je n’utilise pour ainsi dire plus Google (ou occasionnellement, par la bande), et je constate qu’utiliser une gamme plus large de moteurs me permet de tomber sur des informations que Google ne m’aurait très probablement pas remonté dès la première page.
Emmanuel Clément, Autopsie d’une recherche
Emmanuel cartographie ses méthodes de recherche, avec deux objectifs : être plus précis, et se passer de Google ou d’autres moteurs de recherche qui pistent. Très intéressant d’envisager une application plus ou moins libre de cette méthode dans un cadre professionnel.
Unilist, or ⋃nilist, is a simple and light page that list Unicode characters.
⋃nilist
Raphaël Bastide vient de lancer ⋃nilist, une application web qui permet tout simplement de copier des caractères Unicode d’habitude compliqués à trouver. C’est simple, c’est beau, et ça fonctionne à merveille.
World Brain traite de l’architecture des data centers, de l’intelligence collective des chatons, du trading à haute fréquence, de la survie dans la forêt à l’ère de Wikipédia, du bricolage de rats transhumanistes…
Arte Creative, World Brain
World Brain, le documentaire Stéphane Degoutin et Gwenola Wagon diffusé sur Arte Creative, est à regarder ! On y découvre le fonctionnement du réseau Internet, des recherches prospectives sur les connexions et l’intelligence artificielle, des démarches disruptives, etc.
I’ve been asked again and again over the years what the absolute basics of web accessibility are. And while I always thought that it is not so difficult to find resources about these basics, the recurrence of that question prompted me to finally write my own take on this topic. So here it is, my list of absolute web accessibility basics every web developer should know about.
Marco, The web accessibility basics
Les basiques de l’accessibilité web : de l’alternative pour les images aux listes, en passant par les contrastes texte-fond et les structures sémantiques. Un incontournable !
If there’s one wish I have for Christmas from the web developer community at large, it is this: Be good citizens of the web, and learn proper HTML before you even so much as touch any JavaScript framework. Those frameworks are great and offer a lot of features, no doubt. But before you use hundreds of kilobytes of JavaScript to make something clickable, you may want to try if a simple button element doesn’t do the trick just as fine!
Le déroulé varie d’un client à l’autre en fonction de la maturité du projet et des objectifs souhaités en termes de livrable à la fin de l’atelier. Voici les grandes étapes :
- Co-construction d’une vision commune pour le projet ;
- Analyse des cibles ;
- Définition du besoin par cible ;
- Écriture des messages clés ;
- Storytelling de la page d’accueil ;
- Atelier de prototypage ;
- Debrief et plan d’action.
Maëlle Gaultier, Rédiger et valider un cahier des charges web en une journée
Sur 24 jours de web – “le calendrier de l’avent des gens qui font le web d’après” –, Maëlle Gaultier propose une méthode pour établir un cahier des charges avec un client. Quelques règles simples qui permettent d’intégrer plus concrètement le commanditaire dans l’établissement d’un projet, et de mieux cerner les contraintes et l’organisation globale. La méthode semble éprouvée, mais je me demande si certains freins ne rentrent pas en jeu, notamment lors de l’implication des équipes graphiques ou techniques.
Some inspiration for effects on text inputs using CSS transitions, animations and pseudo-elements.
Mary Lou, Inspiration for Text Input Effects
Quelques exemples très originaux de champs ou zones de texte interactifs, pour transformer des formulaires en des objets web bien plus attirants – tout est dans le détail.
En divorçant de sa messagerie Thunderbird et en arrêtant la commercialisation des smartphones sous Firefox OS, la fondation Mozilla se recentre sur le cœur de son métier : le navigateur Firefox, le Web ouvert et la protection de la vie privée.
Camille Gévaudan, Mozilla se concentre sur l’essentiel
Mozilla abandonne – ou presque – deux projets que – personnellement – j’utilise au quotidien. Je suis peut-être isolé pour Firefox OS, mais je ne le suis certainement pas pour Thunderbird. Je m’interroge sur ma faculté de geek à soutenir la fondation Mozilla suite à ces choix stratégiques, tout en étant conscient des contraintes économiques – appelons cela comme ça. Je ne suis pas certain que le navigateur Firefox sera le seul moyen d’innover, même si ce recentrage paraît nécessaire…
When Quartz first launched in September, 2012, the digital-only business publication made a bold gamble. With the future of traffic coming directly to articles from social media streams, they decided they didn’t need a homepage.
Traditional Homepages Are Obsolete, Says Quartz. Here’s What They Built Instead. John Brownlee
Intéressante vision du fondateur de Quartz : le design éditorial ne passe pas nécessairement par une page d’accueil. Il ne s’agit donc plus d’imaginer une page type, censée représenter l’identité globale, mais plutôt agencer des éléments cohérents, hybrides et flexibles, qui répondent à une demande de contenus.
For the new homepage, Seward says the goal was to make sure that someone coming to QZ.com got a really strong sense of what Quartz was about, immediately.
Il donne les ordres, il répartit les tâches, comme un sergent avant d’entamer le franchissement de la colline 235, le bout de cigare mâchonné au coin de la bouche : « Toi, le designer, tu attaques de front, et toi l’inté, tu marches exactement dans ses pas derrière lui, je veux voir la même chose. Allez, en avant ! » Ensuite, le casque juché de guingois sur le crâne, il se tourne vers le client et le rassure : « Vous inquiétez pas, mes gars savent ce qu’ils font, on va vous sécuriser tout ça dans le délai prévu. »
Stéphane Deschamps, Le manager, ce gendre idéal méconnu
Stéphane Deschamps raconte de façon très claire à quoi peut ressembler le travail de manager, en partant de sa propre expérience. Positif, pédagogue, drôle, et interrogateur, Stéphane décrit cela avec beaucoup de brio !
Today, I’m pleased to be able to announce the immediate availability of Raspberry Pi Zero, made in Wales and priced at just $5. Zero is a full-fledged member of the Raspberry Pi family […].
Eben Upton, Raspberry Pi Zero: the $5 computer
Un ordinateur à moins de 5 euros ? Le nouveau modèle de Raspberry Pi, le Raspberry Pi Zero, permet d’imaginer des usages encore plus massifs. Il reste encore les questions de l’apprentissage, de la fracture numérique, de la volonté et du temps disponibles pour utiliser un matériel peu coûteux en argent mais pas en temps. Un mouvement à accompagner.
Chacun fixera lui-même la limite entre compromis et compromission, et je ne me risquerai certainement pas à juger la position du curseur des uns et des autres. Le tout étant de le faire avec honnêteté, et surtout avec logique.
STPo, L’éthique dans le travail
Entre la recherche d’une certaine ligne éthique, et la stratégie économique inhérente à toute activité professionnelle, STPo décrit avec beaucoup de justesse le difficile parcours dans les choix des projets – autant en indépendant qu’en tant que salarié.
[…] si j’ai conscience de mes contradictions, je tente de tenir un discours cohérent et de ne pas changer d’avis avec le sens du vent ou de faire tout et son contraire.
Le calendrier de l’avent des gens qui font le web d’après.
24 jours de web
C’est reparti pour la quatrième édition du calendrier de l’avent autour du web : 24 articles pendant le mois de décembre.
Dans un stimulant billet publié sur le The Atlantic, le développeur de jeux, Ian Bogost s’est encore fait des amis. Pour lui, les programmeurs ne sont pas des ingénieurs. Pourquoi ? Parce que les ingénieurs ont, eux, une longue tradition de conception et de construction d’infrastructures d’intérêt public ! Les ingénieurs ont une responsabilité de sécurité publique et de fiabilité (même si elle fait parfois défaut). Ce n’est pas le cas de ceux qui font des logiciels explique-t-il en pointant le piratage massif de données personnelles, les logiciels tricheurs…
À lire ailleurs, Programmeurs : vous n’êtes pas des ingénieurs !
La qualité Web est à la fois subjective puisque chacun en a sa perception et partiellement mesurable, car il existe des outils qui permettent de la rendre un peu plus objective. Je préfère souvent parler d’amélioration continue ou de professionnalisme. En contexte professionnel, plutôt que parler de qualité Web, il vaut mieux se poser la question du management de la qualité Web qui est une approche nettement moins subjective, qui rapporte, qui améliore l’image, qui renforce le positionnement sur le numérique… Bref, il faut y aller, et oui, ça n’a pas de fin et c’est pour ça que c’est bien.
Rashel Réguigne, Elie Sloïm, l’engagement pour la qualité web
Un long entretien avec Elie Sloïm de Temesis, autour de la qualité web et de l’accessibilité.
Au-delà de l’aspect offline décrit par le Guardian et CSS Tricks, on peut aller plus loin comme faire du chargement dynamique d’images en fonction du support par le navigateur ! Même si c’est peu supporté pour l’instant, ça donne envie d’essayer pour ceux qui en ont la capacité (sans effets de bords pour les autres).
David, Service Workers
Un pas de plus vers un web offline, mais également vers un chargement des contenus en mode responsive.
Le web grossit. Les pages s’alourdissent, le nombre de ressources (images, scripts, css, etc) nécessaires pour afficher une page web ne cesse de croître.
Pourquoi ? Parce qu’aujourd’hui les sites web sont des applications à part entière, avec des fonctionnalités qui peuvent être très riches, et offrant de nombreux contenus multimédias.
Damien Jubeau, Budget de performance : un indispensable à la rapidité des sites web
Quelques grands principes autour de la performance web, et de pourquoi il est important de s’en inquiéter – pour des raisons directement ou indirectement économiques. Une déclinaison de la qualité web, autour de l’outil Dareboost.
This book will help type designers understand Vietnamese’s unique typographic features so they can design their typefaces to support the Vietnamese language. It will also guide web and graphic designers in using correct Vietnamese typography in a project.
Donny Truong, Vietnamese Typography
Après Professional Web Typography – j’en parlais ici –, Donny Truong a écrit un livre complet sur la typographie vietnamienne. Encore un livre web à la forme très intéressante, et aux contenus précis.
Est-ce que le code que je vois dans DevTools est le DOM ? Oui, d’une certaine façon ! Quand vous regardez l’affichage de n’importe quel DevTool (Chrome DevTool, Firefox developer tools,…) vous voyez une représentation visuelle du DOM. On y est !
Chris Coyier, Qu’est-ce que le DOM ?
Différencier le DOM – Document Object Model – et le HTML, c’est différencier le code originel, le code affiché dans le navigateur – le code source –, et le code interprété.
Contrairement à ce que laisse penser la définition erronée du HTML (« langage de description de contenu »), la page affichée n’est qu’un sous-produit du DOM, qui est le véritable résultat du HTML.
Et cette nuance change tout.
[…]
Une soupe de<div>, ce n’est pas juste quelques octets en trop dans le HTML. C’est une structure pesante, inutile, qui va alourdir toutes les opérations de reflow et repaint.
[…]
Comprendre le DOM et son fonctionnement est donc un prérequis essentiel pour créer des pages performantes et économes en ressources.
Olivier Nourry, Le DOM, le coté lumineux du HTML
À la source du web, donc.
Up-to-date data on support for type and typographic features on the web. Search or choose from the features below to get started.
The State of Web Type
Can I use dédié uniquement à la typographie sur le web !
Responsive sites and adaptive sites are the same in that they both change appearance based on the browser environment they are being viewed on (the most common thing: the browser’s width).
Responsive websites respond to the size of the browser at any given point. No matter what the browser width may be, the site adjusts its layout (and perhaps functionality) in a way that is optimized to the screen. Is the browser300pxwide or30000pxwide? It doesn’t matter because the layout will respond accordingly. Well, at least if it’s done correctly!
Adaptive websitesadaptto the width of the browser at a specific points. In other words, the website is only concerned about the browser being a specific width, at which point it adapts the layout.
Geoff Graham, The Difference Between Responsive and Adaptive Design
Une définition, et des explications techniques plus poussées. Quelques points essentiels à retenir :
Pourquoi vouloir faire à ce point la différence ? Parce qu’en terme de conception, cela a beaucoup d’implications !
We’ve generally been rather optimistic about the whole problem, often thinking that coverage and bandwidth are sure to increase continually, but our recent experiences have made this attitude appear increasingly naïve. Capacity problems, varying coverage and zones with zero reception, unreliable connections (both wifi and telco) and problems incurred through travelling will likely persist for quite a while.
Alex, Say Hello to Offline First
Imaginer des solutions pour les applications web dans des cas d’absence ou de manque de réseau, c’est l’objectif d’Offline First !, une mine d’informations dans ce domaine.
It’s cool to show beautiful things to make a good impression, but if we want to be closer to the user interaction, we should probably test UIs in different contexts. Be site which are not mobile friendly, sites which are ugly, sites with Web compatibility issues. I have the feeling that would help to design not only beautiful UIs but also UIs more resilient in a frustration or uncomfortable mood of the user.
Karl Dubost, Interface Mockup and User Reality
Les mockups – ou maquettes d’interfaces – sont parfois loin, très loin de la réalité. Il est bon de rappeler la majeure partie du web n’a pas de design épuré !
Certes, la dimension « business » et l’ambiance « start-up » de l’évènement peut faire un peu peur aux non-initiés (c’était mon cas) ; mais une fois sur place, la diversité des sujets proposés permet sans mal de s’en sortir en échappant au jargon franglais et aux (rares) discours marketing à papa.
Toutefois, l’intérêt du Blend, c’est justement ce mélange des genres un peu improbable entre designers, développeurs, entrepreneurs, investisseurs et chercheurs. La diversité des conférenciers et des participants crée une alchimie très originale.
Cela aide à sortir un peu de son pré carré et à s’ouvrir à des sujets qui ne nous sont pas forcément familiers.
Marie Guillaumet, BlendWebMix 2015 : l’expérience utilisateur à l’honneur (2)
Deuxième partie du compte rendu de Marie Guillaumet concernant les deux jours de conférences de BlendWebMix, au programme : typographie, chargement et performances ; design de produit dans le cas d’un service qui touche beaucoup de personnes ; et conception d’une navigation sur mobile.
Si la diversité des conférences du Blend et l’étendue des locaux ont pu me faire tourner la tête, je me suis finalement concocté un programme mêlant web design, mobilité et expérience utilisateur (UX).
Marie Guillaumet, BlendWebMix 2015 : l’expérience utilisateur à l’honneur (1)
Ayant suivi deux des trois conférences présentées dans ce compte rendu, je ne peux que noter les qualités de synthèse de Marie Guillaumet ! À lire !
Mais Edge considère désormais les préfixes
-webkit-comme des aliases, et les mange tout crus. Ça aurait pu être un problème dans ce cas précis, puisque théoriquement la pairebackground-clip: text;nʼest reconnue que par les navigateurs basés sur WebKit. Là encore : surprise ! Edge lʼapplique sans rechigner.
Gaël Poupard, Le web en kit
Microsoft revient sur le devant de la scène web – après la longue agonie d’Internet Explorer –, mais cela semble plutôt positif. À suivre.
De nombreuses techniques ont vu le jour et nʼont vécu que pour WebKit. Je mʼinterroge donc : parmi ces techniques que nous pensons réservées à WebKit, combien dʼautres encore ont atterri dans Edge discrètement ?
Ever notice how people texting at night have that eerie blue glow?
Or wake up ready to write down the Next Great Idea, and get blinded by your computer screen?
During the day, computer screens look good—they’re designed to look like the sun. But, at 9PM, 10PM, or 3AM, you probably shouldn’t be looking at the sun.
f.lux
Sur les conseils de Nicolas, je découvre et installe f.lux, un petit utilitaire disponible pour Mac-Linux-Windows qui permet de modifier les teintes de son écran selon l’heure du jour.
Les écrans rétro-éclairés à LED – ordinateurs, smartphones, tablettes – dégagent une lumière bleue qui peut avoir pour conséquence de bouleverser les rythmes du sommeil (un article sur le sujet). Avec f.lux, en pleine journée l’écran reste blanc, puis en fin de journée il prend une tonalité jaune voir orange, afin de respecter les cycles naturels.
Après quelques heures (en soirée) puis plusieurs jours d’usage, le confort gagné est très important !
Plutôt que de tâtonner pendant des heures, prenez deux secondes pour créer un système. Quelque chose de très direct, qui repose sur 2 ou 3 réglages/variations et est susceptible de vous amener à un résultat intéressant.
Sans forcément vous en rendre compte, vous créez des systèmes en permanence. Il y a juste que vous ne les réutilisez et remixez pas. Pourtant, un tout petit changement peut vous amener sur un résultat totalement différent.
Jiminy Panoz, Développez des systèmes
Vivifiant billet de Jiminy Panoz, ebook designer, qui propose une méthode pour résoudre des problèmes récurrents de design – mais qui peuvent être également techniques. Je me rends compte que j’ai une pratique similaire lors de la phase de conception d’un projet.
Ces systèmes sont à envisager comme des aides, des bases sur lesquelles construire quelque chose de solide.
[…]
Alors créez des systèmes, soyez totalement obnubilés par l’idée de les développer, n’imaginez pas concevoir autrement un seul instant et ensuite seulement, ajoutez-y votre touche personnelle.
Il y a tout à (re)construire, et c’est exitant, vivifiant. Écrire et lancer les fichiers par FTP, comme des petits avions en papier. C’est tellement simple au fond ! Et la métaphore change. Je ne rubrique plus rien, je ne content manage plus rien. Une idée, un fichier, ou comme je veux, je casse et je recommence.
Emmanuel, Tout à construire
Emmanuel souhaite changer de CMS – quitter Dotclear pour un système sans base de données – et explique le plaisir d’utiliser uniquement des fichiers HTML et CSS sans dépendre de bases de données ou de dépendances.
Reste une morale à ne pas oublier : la publicité est une problématique créée de toute pièce par le refus de considérer que les contenus ont un coût. Nous arrivons aux limites du système, et nous arriverons aussi un jour aux limites des autres systèmes pseudo-gratuits, comme les réseaux sociaux.
Si vous le pouvez, préférez toujours des business model basés sur la plus-value de vos contenus plutôt que sur leur proposition à bas coût, ou sans frais : vous envoyez un mauvais signal et il est dur d’en sortir a posteriori.
Boris Schapira, Publicité en ligne : un point sur la situation
Une bonne synthèse de la situation concernant la publicité en ligne : un historique nécessaire, un avenir possiblement centralisé peu réjouissant, quelques pistes innovantes explorées, et un bon conseil sur la stratégie.
La semaine dernière, je donnais une conférence intitulée : alerte rouge sur la qualité du Web chez BlendWebMix, à Lyon. Bien entendu, dans le tour d’horizon que j’ai fait sur les nombreuses dégradations actuelles de l’expérience utilisateur, je ne pouvais pas passer sous silence les problèmes liés à la publicité en ligne. Et ils sont énormes et graves, ces problèmes.
Élie Sloïm, Publicité Web : y’a des limites ?
Les problèmes liés à la qualité web posés par les publicités en ligne sont nombreux et complexes (Élie Sloïm en a parlé avec panache à Blend Web Mix), les réponses sont encore timides, et peu convaincantes pour ceux qui utilisent la publicité. Mais il y a des pistes et il faudra bien réagir – modification ou suppression partielle ou totale de la publicité sur le Web – face à l’utilisation massive des bloqueurs de publicité.
Articulant théorie et pratique, cet ouvrage présente 30 fiches méthodologiques couvrant l’essentiel du design UX et de l’ergonomie des interactions homme-machine (IHM).
Carine Lallemand et Guillaume Gronier, Méthodes de design UX
Le livre de Carine Lallemand et Guillaume Gronier vient de sortir. Après avoir écouté la formidable conférence de Carine Lallemand à Blend Web Mix, je pense que cet ouvrage vaut vraiment la peine d’être lu !
Cool front-end developers are always pushing the envelope, jumping out of their seat to use the latest and greatest and shiniest of UI frameworks and libraries. They are often found bridging the gap between native apps and web and so will strive to make the UI look and behave like an app. Which app? you may ask. iPhone? Android? What version? All good questions, alas another topic altogether. However, there is another kind of front-end developer, the boring front-end developer. Here is an ode to the boring front-end developer, BFED if you will.
Adam Silver, The boring front-end developer
Je découvre ce manifeste via Vincent Valentin. Adam Silver y défend la simplicité, l’accessibilité, la résilience ou encore la robustesse, face aux gadgets, aux dépendances techniques et aux interfaces pas ou peu accessibles.
Je crois par exemple en l’enrichissement progressif, à la sémantique HTML et au bon usage des standards web. J’aime le web ouvert et interopérable, et je m’efforce de comprendre et d’embrasser au mieux ce média et ses spécificités.
Vincent Valentin, Mon manifeste pour un travail différent
Vincent cherche de nouvelles aventures d’intégrateur web, et expose ses idéaux pour travailler dans un cadre ou contexte qui lui conviendrait mieux. Accessibilité, éthique, partage d’expérience, apprentissage, qualité, autant d’idéaux que je partage, sans pour autant être un intégrateur.
ACUMIN by Robert Slimbach is a new type family from Adobe that does for book (and ebook) designers what Helvetica has always done for graphic designers. Namely, it provides a robust yet water-neutral sans-serif, in a full suite of weights and widths. And unlike the classic pressing of Helvetica that comes on everyone’s computers—but like Helvetica Neue—Acumin contains real italics for every weight and width.
L. Jeffrey Zeldman, A Helvetica For Readers
Jeffrey Zeldman présente rapidement cette nouvelle fonte, et décrit comment le site de démonstration, créé par Nick Sherman, a été pensé et développé. Un cas pratique et complexe d’un site web responsive qui affiche plusieurs dizaines de fontes – la gestion de la performance est quelque peu délicate –, et qui utilise des colonnes en CSS3.
Alors, non, je ne sais pas ce qui se passe dans le cerveau de tel ou tel utilisateur, pas plus que je ne vois l’activité bactériologique dans le levain. Les chercheurs le peuvent, dans les deux cas, avec des outils adaptés. Moi, je ne peux qu’observer de l’extérieur, les comportements. Par contre, je connais le fonctionnement cognitif théorique de l’être humain. J’ai donc des méta-connaissances qui me permettent d’expliquer ce que j’observe, d’en tirer des conclusions et de trouver des solutions.
Raphaël Yharrassarry, Tout le monde peut être UX designer ? Et autres réflexions.
Quelques arguments bien pensés pour défendre le rôle de l’UX designer, dans un contexte d’industrualisation du développement web.
In the past few months weighing the pros and cons, I have decided to separate my personal blog from my professional work. The decision is hard to make because Visualgui has become both my personal and professional presence on the web for so many years.
Donny Truong, Introducing ON Designs
Donny Truong, l’auteur de Professionnal Web Typography, lance le site web de son activité de designer indépendant, l’occasion d’aborder la question de la séparation d’un carnet personnel et d’un site portfolio reflétant uniquement une activité professionnelle.
Si on les aborde correctement, les audits de contenu sont des outils d’une puissance exceptionnelle. Au delà de l’évaluation de la quantité et de la qualité du contenu, ils aident les concepteurs à comprendre l’environnement informationnel, facilitent les discussions stratégiques et permettent la découverte d’informations qui ont directement influencés la direction du design et la stratégie. En résumé, nous avons augmenté les chances de succès de notre redesign en approchant les audits en gardant ces buts à l’esprit.
Christopher Detzi, De l’audit de contenu aux idées de design
Une tâche classique qu’est l’audit de contenus peut aussi permettre de repenser un design en adéquation avec les contenus qu’il met en forme. Un article très complet qui reprend les différentes étapes d’un cas concret.
Quelle est ma valeur ajoutée, qu’attendent de moi mes clients, qu’est-ce que je dois faire pour bien faire mon boulot ? Avoir une bonne vision de l’écosystème numérique, et proposer des solutions pertinentes en fonction du contexte. Je n’ai pas besoin de tout savoir pour être un bon professionnel.
Thibault Jouannic, La veille techno pour les vieux croûtons
Superbe, drôle, réaliste et déculpabilisant, ce billet déclenche une prise de conscience saine sur les enjeux de la veille en général et plus particulièrement dans le domaine du développement web.
Résumé : trouver l’équilibre entre faire de la veille pour rester au courant, et savoir décrocher pour ne pas être écœuré.
Pourtant on sait que c’est comme ça que nait l’innovation : en combinant des idées qui à la base n’ont pas de lien direct entre elles. Donc plus on s’ouvre à des idées et concepts divers et variés, plus on va s’enrichir et plus on va s’ouvrir des portes pour trouver des solutions innovantes aux problèmes du quotidien.
Une fois votre nom de domaine en main et votre espace d’hébergement, vous êtes libre de publier dans le format, dans la forme et le style de votre choix.
Karl, Un Web à sa mesure
Le web peut permettre une certaine liberté, il ne faut pas oublier ce qu’implique les silos.
Pour favoriser un Web ouvert, nous devons continuer à promouvoir les techniques qui rendent indépendantes les individus.
Yet this is largely unknown outside of software development. All sorts of industries would benefit from this approach, from farming to law.
Daniel Pope, Get a Kanban! (or Scrum board)
Une méthode assez simple à mettre en place, dans tous les domaines qui peuvent intégrer un travail par itérations.
À noter que le service Framaboard de Framasoft est basé sur Kanban.
The Digital Publishing Interest Group has published a Working Draft of Portable Web Publications for the Open Web Platform. This document introduces Portable Web Publications, a vision for the future of digital publishing that is based on a fully native representation of documents within the Open Web Platform. Portable Web Publications achieve full convergence between online and offline/portable document publishing: publishers and users won’t need to choose one or the other, but can switch between them dynamically, at will.
W3C, First Public Working Draft: Portable Web Publications for the Open Web Platform
Une grande avancée pour la publication numérique, enfin la possibilité de travailler avec des standards pour du en ligne et du hors ligne. Il s’agit là des prémisses de la rencontre entre le web et le livre numérique – le format EPUB.
Paris Web, ce sont des dizaines de conférences très enrichissantes animées par des professionnels passionnés. C’est aussi l’occasion de rencontrer des gens que l’on suit sur Twitter ou dont on lit les blogs, en vrai. C’est un peu une cure de santé annuelle.
Mylène Chandelier, Paris Web 10e édition
Une synthèse de toutes les conférences de Paris Web 2015 ! C’est parfois très succint, mais cet article de Mylène Chandelier semble donner une bonne vision de l’ensemble de l’événement.
C’est tous les ans un moment attendu avec une grande impatience : Paris Web. Cette conférence francophone des gens qui font le Web abordent des sujets qui nous tiennent à coeur : l’accessibilité du Web, le design numérique et les standards ouverts.
Olivier Keul, Paris Web 2015 : 10 ans déjà !
Olivier Keul propose le résumé de quatre conférences de Paris Web 2015.
Over the past months there have been a few articles taking care of different font loading optimization techniques. Reading all of them, I ran into a few other issues that are not covered there. Finally, I wanted to have one resource combining the information of the others. Some code snippets are borrowed or adapted from the articles I linked here.
Anselm Hannemann, Using Web Fonts The Best Way (in 2015).
Liste des bonnes pratiques pour l’utilisation des web fonts : chargement asynchrone, perfectionnement du temps de chargement des fontes, gestion du cache, etc.
je pense que nous devons pousser pour le développement du Web mais vers une démarche d’amélioration sur la résilience, résistance, stabilité. Le Web est fragile, la complexification est un concept bien différent que celui du progrès. […] Comment développer le futur du Web afin qu’il soit plus performant dans sa résistance au temps, dans sa facilité d’utilisation ?
Karl, Arrêtez le Web
De nouveaux métiers émergent, les formations autour du web sont toujours plus nombreuses et le média s’industrialise à vitesse accélérée. Les jeunes profils qui-en-veulent retournent le web à la recherche d’informations, écrivent cinq nouveaux frameworks Javascript par semaine et font leurs nuits blanches sur du code comme je le faisais il y a dix ans. Ma valeur ajoutée n’est plus là, et je capitalise davantage sur mon expérience du terrain, ma capacité à mener un projet proprement à son terme et la valeur de mon conseil. C’est peut-être ça, vieillir ?
STPo, Dix ans de freelance
STPo raconte ses 10 années d’indépendant dans le web, avec beaucoup de sincérité, de pragmatisme et d’humour.
Nous ne voulons pas remplacer Google, ni GAFAM, pour « Framasoftiser Internet ». Bien entendu, nous n’en avons pas les moyens… ni l’envie : devenir une asso avec plus d’employés que de bénévoles, très peu pour nous ! Notre but est simplement de sensibiliser les gens, de démontrer que le Libre offre des solutions et alternatives viables, et qu’un maximum de gens y goûtent.
Framasoft, Dégooglisons saison 2 : ils ne savaient pas que c’était impossible, alors ils l’ont fait !
Les démarches de Framasoft prennent beaucoup d’ampleur en terme d’outils disponibles (pads, tableur, réseau social, raccourcisseur d’URL, Gitlab, etc.) !
Le web francophone est devenu passif. Quelques uns publient des contenus, mais beaucoup les consomment de manière passive.
Or, on est tous en attente de contenus intéressants, riches et originaux.
Aussi, si chacun d’entre nous se met à publier, ne serait-ce qu’un petit peu, cela provoquera un effet boule de neige, et tout le monde y gagnera.
Ce n’est pas une question de “se vendre”, mais juste d’apporter quelque chose à la communauté en échange de ce qu’elle vous a déjà appris ou donné.
Marie Guillaumet, Design de soi : valoriser son identité et son expertise sur le web
Le design de soi c’est aussi le design de sa communauté : ce que l’on souhaite partager et construire avec les autres !
The book is a program.
Matthew Butterick, Pollen
Je découvre tardivement que Practical Typography est un livre web construit avec Pollen, un outil permettant de structurer et de mettre en ligne des contenus sous forme de livre (web).
This is a bold claim, but i stand behind it: if you learn and follow these five typography rules, you will be a better typographer than 95% of professional writers and 70% of professional designers. (The rest of this book will raise you to the 99th percentile in both categories.)
Matthew Butterick, Practical Typography
Un classique à ne pas oublier.
Cette étude détaille les points forts et faibles de quatre CMS largement répandus et résume leur aptitude à produire et gérer des sites Web accessibles. Ces résultats seront utiles aux développeurs, aux chefs de projet, et à tout responsable amené à s’interroger sur la stratégie à mettre en œuvre pour améliorer l’accessibilité d’un service en ligne et le choix d’outils appropriés. Cette étude propose aussi une méthode qui permettra de faire évoluer cette base de connaissances sur l’accessibilité.
Dominique Burger, Choisir et utiliser un CMS pour créer des contenus accessibles
Un document qui résulte de plusieurs années de travail, et notamment suite à une journée du groupe de travail ATAG2 en France.
Le document est construit en quatre parties :
Pour la première fois, après déjà une première phase consultative réalisée l’an dernier par le Conseil national du numérique (CNNum), le texte est publié sur une plateforme participative qui permet à tous les citoyens de donner leur avis sur chacun des articles, d’en proposer des modifications soumises aux avis, ou même de proposer de nouveaux articles dans les différents chapitres du projet de loi.
Guillaume Champeau, Loi sur la République Numérique : un bon texte, et une méthode innovante
Un projet de loi qui inclue les remarques, critiques et propositions des citoyens. Une nouveauté, qui le sera réellement lorsque ce mode de fonctionnement concernera aussi des lois qui n’ont rien à voir avec le numérique.
Pour un résumé très rapide de la loi c’est par ici.
Un projet qu’il faut donc commenter et augmenter.
Ever since the inception of Cascading Style Sheets (CSS), elements have been rectangular and firmly oriented on the horizontal and vertical axes. A number of tricks arose to make elements look like they were tilted and so on, but underneath it all was a rigid grid. In the late 2000s, an interest grew in being able to break the shackles of that grid and transform objects in interesting ways—and not just in two dimensions.
Eric A. Meyer, Transforms in CSS
Petit guide, “gratuit”, pour manipuler, en 3D et en CSS, les images.
Les plus importants des nouveaux utilisateurs du Web dans les années à venir ne seront pas les possesseurs de montres connectées, des derniers smartphones haut de gamme, ou des tablettes professionnelles, mais bien ceux d’appareils d’entrée de gamme, n’ayant aucun autre moyen de connexion, et ayant pour autant les mêmes besoins que nous aujourd’hui. Les enjeux de performance et sobriété des services Web n’ont jamais été autant importants, et nécessitent une prise de conscience générale. C’est un paramètre supplémentaire dans le souci permanent pour l’accessibilité universelle des services Web.
Paris Web : les coulisses, Interview Partenaire : Clever Age
Yes, the old Web was ugly and insane, but it was also much more fun than a sea of sites that look weirdly similar. Now it feels like everywhere you go online looks strangely similar to every other site. […]
Websites from small businesses to startups and giant companies have all started to use similar layouts and frankly, it’s boring. […]
Let’s start again, ignore the rules and stop building websites that look the same. We should start tinkering and breaking rules. Let’s not lose the magic of the early Web.
Owen Williams, Web design is now completely boring
La créativité serait mise à mal à cause de frameworks comme Bootstrap, et pourtant les possibilités techniques sont grandes pour imaginer des sites web originaux. Il faut sortir du cadre que des outils récents ont créés.
Owen Williams ne parle pas de design responsif ou adaptatif, et c’est là aussi l’une des raisons de cette homogénéisation.
Les conférences de Sud Web 2015 – apparemment toutes – sont disponibles en vidéo, en ligne et téléchargeables : de “Voir le web comme un espace” à “Ma pédale c’est HTML5” en passant par “Le design d’expérience utilisateur n’est pas un métier”, à voir !
Peu importe le document, il faut toujours essayer de garder un formatage commun. Cela signifie une cohérence des commentaires, de la syntaxe et des règles de nommage.
Harry Roberts, traduit par David Leuliette, Guide CSS)
Je découvre, via David, ce Guide CSS, conçu essentiellement pour développer à plusieurs, en 18 points clairs et concis.
Je découvre pour la première fois – sauf erreur de ma part – qu’un article sur Medium.com peut être commenté en fin, et non plus dans les marges. Je ne trouve pas d’information sur ce changement, qui date peut-être depuis plusieurs mois. C’est dommage qu’une telle fonctionnalité disparaisse, c’est ce qui faisait – à mon sens – une des forces et une des originalités de cette plateforme.
Voici un exemple d’article avec les commentaires en fin de page, et voici comment fonctionnait Medium.com.
Side note to journalists: if you lot are this incompetent at stories that directly impact your own bottom line, why should we trust what you write on anything else?
Baldur Bjarnason, The discussion about ad blocking is very dumb (but not in the way you think)
Encore un article sur le Web financé par la publicité, en rapport avec iOS9 et la possibilité de bloquer la publicité.
Peut-être que je me pose trop de questions et qu’il faille embracer l’impermanence de nos outils car d’autres seront là répondant aux besoins du moment, mais pendant ce temps nous aurons créé quelque chose au dessus de ce substrat. Les constructions culturelles, les conversations et l’histoire qui les accompagnent auront elles pris une réalité tangible.
Karl Dubost, IRC. Slack. Clash
Ne pas s’enfermer dans des pratiques guidées par des outils, et à l’inverse ne pas oublier que nous développons des pratiques, une culture, autour de certains outils. Changer d’outils c’est abandonner une certaine culture – pour une autre, peut-être.
He was one of the few typographers whose worked with hot metal, photographic and digital typesetting during his long career.
swissinfo.ch
Je connais mal le travail d’Adrian Frutiger, mais les quelques images du maître aperçues sur des vidéos à l’occasion des Rencontres de Lure m’ont permis d’entrevoir un typographe aux méthodes originales, un homme plein de créativité.
J’encourage pour ma part tou·te·s les internautes à bloquer par tous les moyens les publicités qui envahissent certains sites.
Clochix, Faut-il bloquer les publicités ?
Clochix prend le temps de présenter des contre arguments en faveur d’un modèle majoritairement publicitaire des sites Web. Cela fait du bien de lire une liste détaillée qui remet en cause beaucoup de principes perdus depuis les débuts du Web.
Edit : Clochix a publié le lendemain un billet de mise à jour.
Débloquer la publicité sur certains sites, c’est accepter d’être traqué, c’est abaisser la sécurité de son ordinateur, c’est entretenir l’illusion que la publicité est un modèle économique acceptable…
Cependant, s’il y a de réels dangers à prendre la méthodologie et la résolution de problèmes trop au sérieux, les prétendus libertés qu’offrent certaines approches aléatoirement “intuitives” sont, comme chacun sait, tout aussi périlleuses lorsque la tâche s’avère complexe ou demande un gros effort du point de vue technique ou fonctionnel.
Norman Potter, Qu’est-ce qu’un designer, page 53
Trouver l’équilibre.
Ceci pour vous montrer que la lettre a, consciemment à mon sens, peut-être plus inconsciemment au sens d’autres personnes, une valeur expressive, que souvent on néglige de lui donner, tout au moins dans trop d’œuvres de mon pays.
Charles Peignot, Esthétique et typographie
Peut-être pouvons-nous espérer que l’on néglige beaucoup moins la valeur expressive de la lettre, aujourd’hui, dans le pays de Charles Peignot.
En sécurité, un aspect intéressant est que les mesures prises ont pour objectifs de rendre acceptable le niveau de risque — et pas plus. Pour chaque risque identifié, on évalue sa vraisemblance et sa gravité, avant de prendre une mesure pour diminuer son impact. A la fin, il reste des vulnérabilités résiduelles, qu’il suffit d’expliciter et de justifier : certes, quelqu’un avec un accès physique au système, une porte dérobée déjà en place et un supercalculateur de poche pourrait opérer une brèche. Mais c’est un risque acceptable.
Ce n’est pas très différent d’une démarche ergo, dans laquelle on identifie certains déterminants de l’activité (par exemple, l’utilisateur est forcé d’utiliser sa tablette avec des moufles), auxquels on répond par des solutions (doubler la taille des boutons) ou des recommandations (ne pas utiliser la tablette dans un contexte nécessitant ces moufles).
Baptiste, De quelques similitudes entre utilisabilité et sécurité
Ce rapprochement entre sécurité et utilisabilité est un moyen simple de casser le mythe de l’interface ou du système parfaitement ergonomique ou sécurisé. Un article très éclairant.
Il suffit d’en revenir à l’utilisateur.
Digital design is a human assembly line.
Travis Gertz, Design machines
Un long article qui démontre avec succès combien le webdesign est actuellement répétitif et peu original. Travis Gertz explique comment nous sommes arrivés à une telle uniformité, et esquisse quelques solutions.
Une petite claque qui nous rappelle que pour résoudre ce défi, il faut aller chercher du côté de l’humain, des pratiques et des outils.
Without the logos, could you tell which companies own which screenshots? Does it matter? The pattern’s become its own trademark. Just one of the popular yet mediocre ones plaguing modern screen-based design.
What’s wrong?
The best and worst thing about the information age is the ability and our penchant for sharing every damn thought that enters our minds. When designing, testing, and marketing our digital products, we feel compelled to blog our findings, tweet our opinions, and speak about the shit that works and doesn’t work. It doesn’t take long for opinions to morph from one organization’s experience, to industry-wide opinion, to black and white standards and best practices.
Designing better systems and treating our content with respect are two wonderful ideals to strive for, but they can’t happen without institutional change. If we want to design with more expression and variation, we need to change how we work together, build design teams, and forge our tools.
Effectively letterspacing text can make the difference between good typography and great typography.
John D. Jameson, Guidelines for Letterspacing Type
Une bonne introduction en ce qui concerne l’espacement des lettres pour les sites web, à prolonger.
Sur les cinq sites d’Arte, revendique sa présidente, “la recommandation n’est pas automatique mais éditoriale et réfléchie”.
Alexis Delcambre, “Quand Arte veut ‘résister’ aux géants du Web”
Une démarche, sur le web, à contre courant des autres chaînes. La page de présentation des cookies utilisés par Arte démontre cette volonté de transparence. Reste qu’Arte joue sur le même terrain que les “géants du Web”, et qu’il semble donc difficile de gagner à moins de changer les règles.
This is not a book is a series of observations on writing in a digital age written by Baldur Bjarnason and Tom Abba. It is our attempt to boil down into a manageable website our combined experience in creating, developing, and teaching interactive media. It’s a deliberately opinionated guide to the current landscape of digital media storytelling and writing.
Baldur Bjarnason, Launching “This is not a book” – what it is and why you should be interested
Sous-titrée “Writing in the age of the web”, This is not a book est une synthèse, une reformulation et une remise en contexte des connaissances et des expériences de Baldur Bjarnason et Tom Abba dans le domaine du livre numérique et des médias interactifs. Une lecture, semble-t-il, à ne pas rater !
an old-fashioned hypertext about writing for digital
Par ailleurs le site web est simplissime mais très bien fait.
After two actions required to visit the website (close the app install banner, click ‘no thanks’), you still think I might not want to read the content in my browser?
Peter Gasston, Feeling Like An Unwelcome Guest on medium.com
Une histoire assez banale – la récurrence d’une invitation à télécharger une application plutôt qu’à consulter directement un site web mobile –, mais qui a le mérite de rappeler que les plateformes font bien ce qu’elles veulent en terme d’accès à l’information.
Questionner notre regard, c’est questionner notre rapport au réel.
François Chevret, lors des Rencontres internationales de Lure 2015
Un essai est une tentative, Jim. Rien d’autres. Et fondamentalement, depuis des siècles, ça n’a jamais été autre chose. Même par son étymologie, “essai” veut dire “tentative”. Et donc, en tant qu’auteur d’essais, mon interprétation de ce qui m’incombe, c’est de tenter – d’essayer – d’avoir prise sur une chose avant qu’elle ne soit perdue à jamais en retournant au chaos.
John D’Agata, Que faire de ce corps qui tombe ?, page 109
L’une des premières publications de la nouvelle maison d’édition Vies Parallèles, un autre projet d’Alexandre Laumonier, Que faire de ce corps qui tombe ?, est passionnante. La forme permet de servir le fond – un texte original au centre et une discussion entre son auteur et un fact-checker dans les marges.
La forme des lettres n’est plus gravée, ni dessinée mais (d)écrite.
[…]
Le code devient ici une méthode, un modèle de pensée pour le design.
David Vallance, “Décrire des modèles”, .TXT 2
Cet article de David Vallance fait le point sur ses recherches sur MetaFont, un texte passionnant.
Pour le designer, le bon design correspond à la réponse généreuse et pertinente apportée au contexte global d’une opportunité de design bien précise, quelle que soit son échelle, alors que la qualité du design réside pour sa part dans une corrélation étroite et fidèle entre la forme et le sens.
Norman Potter, Qu’est-ce qu’un designer, page 35
Une définition du design très réaliste.
Il [le designer] doit pouvoir évaluer avec objectivité les difficultés tout comme les opportunités d’après leurs caractéristiques (et selon sa propre expérience), mais également faire des choix, ajuster et arrêter ses décisions en conséquence.
Norman Potter, Qu’est-ce qu’un designer, page 21
Une définition du designer très concise.
Alors pourquoi ne pas rechercher passionnément ce qui pourrait permettre de rendre le monde moins difficile ?
[…]
Notre seule clôture qui est aussi notre seule certitude est celle de notre finitude.
Annick Lantenois, Le vertige du funambule, page 85
La conclusion de l’ouvrage d’Annick Lantenois, Le vertige du funambule, sonne comme une invitation aux Rencontres de Lure – qui auront lieu du 23 au 29 août –, une recherche passionnée, et collective.
Multiplier la conception et la production de livres peut se constituer aussi comme une réponse à la pression exercée par l’extension de nouvelles pratiques suscitée par les médias numériques.
Annick Lantenois, Le vertige du funambule, page 70
Le mouvement de surproduction de livres, observés depuis plusieurs années, pourrait être une tentative de s’opposer à une culture numérique naissante mal comprise ou vue comme néfaste.
Some people spend a lot of time on messaging and social apps on mobile. And it is perfectly fine. I personally do not want to use a Web browser for accessing my mail or messaging my friend. I do want a Web browser for reading, linking, sharing links.
Karl Dubost, The Wrong Debate About Native And Web
L’usage des applications natives correspond à des pratiques particulières, comme la communication (mails, réseaux sociaux) ou le jeu, alors que le web est plutôt destiné à la consultation d’informations et à la lecture. Il faut donc plutôt analyser l’évolution des usages – ouvrir une application comme on allume la télé – plutôt que conclure que les applications natives doivent être préférées au web.
You can’t make a decision on how to simplify your approach to web development—how to make it saner—without understanding the compromises, which by definition means that you already have to be a web development expert. Beginners are screwed.
Baldur Bjarnason, Iterating the web away: losing the next generation
Les articles qui pointent la complexification du développement web sont nombreux, mais Baldur Bjarnason aborde des questions intéressantes, notamment celle de l’intérêt de s’amuser et de créer.
Web development will (or even has) become the boring thing you learn because your work needs you to.
Chaque mot, chaque phrase composée dans un caractère plus fort que celui du texte instaure un balisage, constitue une constellation parallèle à l’intérieur de paragraphes foisonnants, complexes, invitant ainsi à une lecture a priori plus superficielle mais souvent orientée vers une synthèse claire de l’ensemble.
Sébastien Morlighem, Le gras, une force visuelle moderne
L’évolution de la typographie est une histoire de structuration.
So what did we learn? First of all, the user is always right… but sometimes it’s not what they say, but what they do. Of course you need to take user feedback into consideration, but remember that actions speak louder than words.
Gillian Morris, Don’t Listen to Your Users
Have designers lost that pioneer spirit? Has creativity been sacrificed on the altar of convenience?
Joshua Johnson, Beyond The Boring: The Hunt For The Web’s Lost Soul
Quelques exemples d’un design web ennuyeux, répétitif et uniformisé, et à l’inverse de grilles originales qui se jouent des modes actuelles. Quelques chemins de traverse en architecture de l’information.
Il ne s’agit pas de substituer une formule par une autre mais de remplacer ce qui se constitue comme une réponse – le graphisme d’utilité publique – par des questions – quelle utilité ? comment ? pourquoi ? Autrement dit, il faudrait parvenir à quitter un cadre de pensée qui fit la force, l’efficacité et la légitimité du design historique, pour revenir aux questions à l’origine même du design.
Annick Lantenois, Le vertige du funambule, page 39
Le designer graphique se donne la mission de remplir l’une des conditions de la perfectibilité de l’homme : la maîtrise des systèmes de traitement et de régulation des informations et des savoirs. Le design graphique fut donc l’un des instruments de ce savoir salvateur avec lequel se construisent des syntaxes scripto-visuelles fonctionnelles, efficaces. Éliminer le maximum d’obstacles, de bruits visuels, susceptibles de freiner la lecteur et l’identification fut l’objectif visant à la clarification, la structuration, la hiérarchisation du texte du monde écrit par les occidentaux.
Annick Lantenois, Le vertige du funambule, page 34
Ces notions de perfection et de maîtrise – ultime – ne sont pas rassurantes. Il y a quelque chose de très – trop ? – rationnel ici. Même si je reconnais que cette définition peut être rassurante, il faut savoir sortir de sa zone de confort, en tant que designer et en tant que lecteur.
En dialogue avec le commanditaire, le designer graphique anticipe et projette dans l’espace et le temps les conditions d’accès aux informations, aux savoirs et aux fictions, et celles de leur appropriation. […] Le design est avant tout une prise de position que le designer affirme par les choix de ses commanditaires et dans les diverses solutions d’un même problème.
Annick Lantenois, Le vertige du funambule, page 12
Une définition très intéressante du designer et du design, dans le passionnant ouvrage d’Annick Lantenois, Le vertige du funambule, paru en 2010 aux éditions B42.
L’attention s’est déplacée des intentions de l’auteur aux fonctionnements internes de l’écriture : c’est-à-dire non pas ce que cela signifie mais comment cela signifie.
Michael Rock, Le designer comme auteur, in n+1, page 41
I believe to become a better developer you MUST get a better understanding of the underlying software systems you use on a daily basis and that includes programming languages, compilers and interpreters, databases and operating systems, web servers and web frameworks. And, to get a better and deeper understanding of those systems you MUST re-build them from scratch, brick by brick, wall by wall.
Ruslan, Let’s Build A Web Server. Part 1.
Expérimenter et comprendre ne veut pas forcément dire savoir administrer un serveur web dans un cadre professionnel. Mais essayer avec ses propres moyens, rencontrer des difficultés et des échecs, réussir, comprendre les enjeux et les compétences, voilà ce que vous apprendre de gérer un serveur ou une machine virtuelle.
Il faudrait que je remette en place mon Raspberry Pi, c’était une expérience enrichissante.
Via le carnet de Karl.
Mais il n’y a rien de mieux qu’un large groupe de geeks dans une conférence, une réunion d’entreprises pour noter combien nous cultivons notre propre uniformité avec exactement les mêmes codes de valeur d’identification.
Karl, Uniformité
Je profite encore d’un statut à part dans le milieu professionnel dans lequel j’évolue actuellement – le monde du livre ou l’univers du numérique dans le domaine culturel. Cela me permet d’avoir la possibilité d’être dans l’alternative : utiliser d’autres outils que ceux dont disposent habituellement les personnes que je fréquente. Quelques exemples :
Mais le plus important n’est pas tant dans les outils que dans les pratiques qui y sont liées.
Déchiffrer le monde, c’est faire le pari permanent d’une lecture qui précède la pensée, le langage, le graphisme, l’écriture. Nous “lisons” depuis l’éveil de la conscience, “parlons” depuis plus de deux millions d’années, “dessinons” depuis plus de 40 000 ans et “écrivons” depuis plus de 5 000 ans.
Sébastien Morlighem, Ouvrir l’Infini
En théorie, l’Infini est une bien belle création. J’attends encore avant de l’utiliser.
En ce sens, ce modèle est un départ, la première borne d’une route ponctuée de rencontres, de retrouvailles, de surprises, une traversée de la lettre latine ; un recommencement, comme chaque nouvelle création typographique s’évertue – ou devrait s’évertuer – à le faire. L’Infini en est le songe, le récit, la somme.
In this brilliant guide, Lea Verou unveils the rare power of CSS that lets designers create stunning visual effects beyond the popular elements. With her extensive knowledge of CSS and her clarity in technical explanation, Verou provides practical solutions that are easy to achieve with just a few lines of CSS.
Donny Truong, Lea Verou: CSS Secrets
Il semble que cet ouvrage soit de plus en plus recommandé. L’enthousiasme de Donny Truong – et de Willy en dehors des réseaux – suscite en moi un intérêt qui dépasse la curiosité.
There’s one thing that’s very different this time around for RSS and Atom and it’s the reason why this time it might be different. Back then ‘just the HTML, no CSS, JS, or Flash’ meant nothing more than rich text with images.
Now, ‘just the HTML’ means rich text, video, audio, SVG, and more.
Baldur Bjarnason, The rules of the game have changed for RSS
Serait-ce le retour du flux RSS/Atom dans les usages ? La progression des standards des technologies du Web – HTML, CSS, SVG, no-Flash, évolution des navigateurs – semble porter ses fruits ! Désormais un flux RSS/Atom peut être riche – images, SVG, vidéo et audio – et pas seulement limiter à du texte et des images.
But hyperlinks aren’t just the skeleton of the web: They are its eyes, a path to its soul.
Hossein Derakhshan, The Web We Have to Save
Une réflexion très pertinente d’un blogueur iranien qui sort de six ans de prison : le Web a complètement changé, ou plutôt la manière dont nous accédons à l’information a été totalement bouleversée. Que reste-t-il de la puissance des liens hypertextes et du potentiel de création dans un écosystème où l’usage des réseaux sociaux domine ?
Étrange sensation de découvrir ce texte sur Medium via Twitter… Mais j’aurais aussi bien pu découvrir cet article via la veille de David, ou les nombreux sites et carnets que je suis via leur flux RSS.
C’est aussi le sens de cette veille, proposer un autre circuit de l’information. Cette tribune de Hossein Derakhshan est plus salvatrice que déprimante, il y a de belles alternatives à construire.
The centralization of information also worries me because it makes it easier for things to disappear.
Le cloud travaille à l’aveugle sur les données que vous avez chiffrées avant de vous retourner le résultat final que vous seul êtes capable de déchiffrer, car vous seul possédez la clé de déchiffrement.
Julien Bourdet, Un cryptage révolutionnaire pour sécuriser le cloud
Une solution – ou un principe – de cryptage qui offre des applications intéressantes, le problème étant que pour le moment cela demande trop de puissance de calculs – avec le risque d’une fracture cryptographique.
Robustness and adaptability are a direct consequence of simplicity and loose coupling. Lose those two features and things start breaking.
Baldur Bjarnason
Baldur Bjarnason rappelle en quelques tweets ce que nous devrions envisager lorsque nous fabriquons des sites web, et que nous souhaitons les fabriquer pour qu’ils soient robustes.
The web we are creating is just as impermanent as old apps or docs. Robustness wasn’t a feature of HTML but of what we were doing with HTML.
When we examine accessibility through the lens of user experience, we see that accessibility is:
- A core value, not an item on a checklist
- A shared concern, not a delegated task
- A creative challenge, not a challenge to creativity
- An intrinsic quality, not a bolted-on fix
- About people, not technology
AccessibleUX.org, Manifesto for Accessible User Experience
Un manifeste en quatre parties :
Unfortunately, some designers misinterpret minimalism as a purely visual-design strategy. They cut or hide important elements in pursuit of a minimalist design for its own sake—not for the benefits that strategy might have for users. They’re missing the core philosophy and the historical context of minimalism, and they risk increasing complexity rather than reducing it.
Kate Meyer, The Roots of Minimalism in Web Design
Le minimalisme, s’il est pris comme un style et non comme un principe, et particulièrement dans le domaine du web design, peut créer des interfaces mal pensées et complexes à utiliser. Ce n’est pas forcément le meilleur choix, tout dépend du projet.
Ouverts, A4, jésus, oubliés, libres, courts, dynamiques, pdf, propriétaires, jpg, raisin… Les formats engagent notre rapport au monde et aux autres. Loin d’être une mécanique passive, ils sont un principe moteur : ils transforment en même temps qu’ils véhiculent.
Rencontres de Lure 2015 : Portrait/paysage, un monde de formats
C’est parti pour une nouvelle édition des Rencontres de Lure, avec un sujet qui me tient particulièrement à cœur ! Programme en cours de finalisation, mais les premiers intervenants sont visibles par ici.
CSS is the abstraction of style away from anything else.
Chris Coyier, The Debate Around “Do We Even Need CSS Anymore?”
Une question issue d’un problème pratique – “Smart people on great teams cede to the fact that they are afraid of their own CSS” – qui a des incidences techniques fortes, et qui touche au principe même du web tel que nous le connaissons encore. L’utilisation de JavaScript – c’est ici une alternative au CSS pour faire de la mise en forme en inlines et non dans un fichier CSS – dans tant de domaines m’inquiète quelque peu, peut-être à tort.
Le problème de départ est peut-être un faux problème, qui pourrait être résolu avec des bonnes pratiques et des outils – Sass a semble-t-il été conçu dans ce sens.
We, VTF, dauntless offspring of the Postscript generation, we chase at the speed of the electron, the course of typography and its attendant of wrestling writing warriors. Like Spartacus, we unchain glyphs from unfair laws and arbitrary conventions, like Ben Hur on a gigantic tank, we welcome script horsewomen and type charioteers and all tremendous, armed with bulletpoint pen and bold crossbows, wearing draw hats, we challenge here and now the tantalizing palimpsest of today.
VTF, www.velvetyne.fr
VTF – Velvetyne Type Foundry – dispose d’un nouveau site web ! Raphaël Bastide et Étienne Ozeray l’ont réalisé avec ofont. On notera quelques éléments remarquables – parmi d’autres :
Without a Trace
The Wetsuitman, Anders Fjellberg
Outre le sujet de l’article, ce qui est intéressant c’est le format/forme : simple, sur une seule page, très lisible, avec une navigation très identifiable – découpage de l’article en trois parties et non trois pages. Tout cela correspond bien au format/fond de l’enquête ou du récit documenté.
Si vous ne connaissez pas Opquast (pour OPen QUAlity STandards), ce sont des référentiels de bonnes pratiques créées collaborativement, le tout sous l’égide de la société Temesis.
Mise en chantier d’Opquast V3, Le collectif Openweb
Un projet colossal mais ouvert et très documenté, à tel point que l’on peut suivre les discussions à propos de bonnes pratiques axées structuration (HTML), mise en forme (CSS), UX, navigation, etc. Des débats souvent passionnants, à suivre en ligne.
websites are in permanent beta.
ILT 2015, John Boardley citant Edo van Dijk
I Love Typography vient de refondre son site, John Boardley explique ses choix et surtout le changement de paradigme : ne plus faire de grands boulversements en terme de structure et de design, mais modifier continuellement le site.
À noter que I Love Typography est un bon exemple de site thématique géré (articles, éditorialisation, développement, correspondances, etc) par une seule personne (du boulot, donc).
Dire non à quelque chose, c’est dire oui à plein d’autres choses.
Travail en transition, David Larlet
David Larlet expose et analyse les bouleversements subit par le travail – principalement le travail salarié – au contact du numérique, à travers l’expérience de Scopyleft. Une des questions principales que je me pose, est l’application de ces propositions dans d’autres champs que le développement web, l’informatique ou le design.
Monitor the accessibility of your websites with pa11y-dashboard, and protect against accessibility errors creeping into your codebase.
pa11y, pa11y.org
Des outils pour automatiser – en partie – la vérification du respect des critères d’accessibilité web. pa11y peut être installer sur votre propre serveur, un point intéressant.
Atom started as a side project of GitHub founder @defunkt (Chris Wanstrath) way back in mid 2008, almost exactly seven years ago. He called it Atomicity. His dream was to use web technologies to build something as customizable as Emacs and give a new generation of developers total control over their editor.
Atom 1.0, benogle
Atom est un éditeur de texte produit par GitHub, qui repose principalement sur un concept : (re)donner un outil très personnalisable aux développeurs. Une alternative intéressante à Sublime Text ? Un projet encore jeune mais plein de promesses.
Peut-être qu’un développeur (Web) sage est celui qui a enfin compris qu’il ne faut pas avoir peur de l’abondance et du chaos, car on aura su trouver son chemin.
Par la fenêtre de la cuisine, Karl
Karl relaie un billet d’Andy McKay, de nombreuses réactions surgissent face à l’imposante palette de compétences et d’outils – et leurs évolutions très rapides – que doivent intégrer et gérer les développeurs Web. Et pourtant le Web repose sur des principes – relativement – simples. Peut-être que cela deviendra un choix éthique ou politique d’utiliser un workflow basé sur quelques briques et en partie pérenne et maitrisable. Et accepter de ne pas tout maîtriser, surtout.
L’interception systématique et la collecte des données techniques des communications sont avant tout une mesure pour dissuader les gens de communiquer.
Métadonnées, Clochix
La solution pour rendre des échanges réellement privés n’est pas tant dans la technique que dans les pratiques adoptées, par exemple en supprimant un peu de numérique – courriers papiers, discussions hors réseaux, etc – de la chaîne numérique complète, lorsque cela est possible.
La volonté très — trop — courante de maîtriser complètement la façon dont les contenus s’affichent sur les écrans, à tel point qu’on parle de « Pixel Perfect », va complètement à l’encontre de cette diversité de supports et de préférences des utilisateurs.
Lâchez prise sans perdre le contrôle grâce à l’unité CSS em, Nicolas Hoizey
Retour sur cet article publié en décembre 2013 à l’occasion des 24 jours de web, dont le fond est de promouvoir une certaine façon de concevoir des interfaces web : il faut penser adaptatif et non responsif. Même s’il est intéressant d’imaginer des points de ruptures dans le design de pages web (selon la taille de l’écran ou le device), il faut plutôt designer des interfaces réellement liquides.
Baseline : The invisible line where letters sit.
Anatomy of a Typeface, Typedia
Une ressource classique mais bien pratique pour ne oublier les classiques !
Do you know that you are being watched?
ihavesomethingtohi.de
Ce qui est intéressant dans ce projet, ce n’est pas tant les outils qui sont présentés que la façon dont cela est proposé : temps estimé pour l’installation et la configuration, niveau de difficulté, apport, inconvénients.
I signed up for their trial and they sent me a link to their mobile app. But instead of talking about themselves or explaining the features, they’re helping me get right to it. They say, “Why are you still reading this email? Download the app and dive into your first book!” I love that.
Interface Writing: Code for Humans, Nicole Fenton
Il s’agit du contenu d’une présentation de Nicole Fenton, à propos des instructions et de leurs différentes formes sur le web. “The web and the world are full of instructions. Everywhere you go, signs and people are telling you what to do.” En lisant ce que Nicole Fenton explique très clairement, on comprend pourquoi des services comme Capitaine Train ont réussi leur design de service. Un bon rappel des mauvais exemples et des bonnes pratiques.
Source : le numéro 94 de l’excellente veille Web Development Reading List.
KNACSS, c’est un peu comme une feuille de style CSS « reset » sur-vitaminée qui permet de commencer un projet à partir de zéro tout en tenant compte de bonnes pratiques générales (accessibilité, performance, responsive webdesign).
KNACSS, un micro framework CSS qui a du goût ! knacss.com
Je découvre très tardivement KNACSS, une bonne base pour intégrer proprement, un fork de normalize.css. Et pourquoi pas utiliser Schnaps.it, un générateur de template HTML5, dans le même temps ?
En résumé, les sites Web ne doivent pas seulement être configurés pour être délivrés rapidement, ils doivent être légers, tout simplement.
Performance Web : 1 Méga, c’est beaucoup, Élie Sloïm
Est-ce que la question du poids et du chargement des pages Web doit se limiter à l’expérience utilisateur ? Il s’agit d’un problème plus global :
A modern edition of the 19th century classic, with a digital library of shapes and dimensions.
Flatland - Ep1, Epilogue
Un projet d’édition contemporaine : un livre physique bien conçu, un enrichissement parallèle au livre papier, un texte du domaine public. Un beau projet.
As a mobile designer, perhaps I should feel satisfaction that I’ve created such engaging experiences. But I can’t help but think: maybe we mobile designers have done our jobs a little too well. And maybe “engagement” was the wrong goal to chase in the first place.
Connected // Disconnected, Josh Clark
Penser des interfaces et des applications ne veut plus dire prendre toute l’attention de l’utilisateur, mais répondre au besoin et disparaître. Cela me fait également penser au marketing de l’interstice qu’a mis en place Capitaine train – voir la conférence de Jean-Daniel Guyot à l’occasion de Web2day – peut-être que l’on pourrait travailler beaucoup plus autour du design de l’interstice.
People consume websites through apps like Pocket or Instapaper, which try to use the structured information of a web page to extract its relevant content. A browser on a smartwatch might ignore your layout and present your information in a way that’s more suitable for a one-inch screen.
Let Links Be Links, Ross Penman
Depuis plusieurs mois/semaines, les articles qui font l’éloge d’un web structuré, standard, accessible, sont de plus en plus nombreux. Contenus pas ou peu structurés ? Sites web trop gourmands en JavaScript ? C’est l’assurance d’être moins visible, et moins lisible.
an accessibility visualization toolkit
tota11y
tota11y est un outil – un fichier Javascript qui prend la forme d’un script à intégrer dans une page ou un bookmarklet à ajouter dans son navigateur – permettant de vérifier certains points précis de l’accessibilité web :
100% accessible n’existe pas
Autant attaquer un moulin à vent sur une licorne Le w3c lui-même — au travers de la wai et des wcag — recommande de ne pas chercher à atteindre la conformité maximale.
Il faut privilégier une démarche de mise en accessibilité.
Accessibilité et efficience, Gaël Poupard
Il s’agit du support d’une intervention de Gaël Poupard lors du WPMX Day 2015, sous-titré “Ce que vous faites et ce dont vous êtes capables”. Une présentation très claire sur ce qu’il est possible de faire en terme d’accessibilité web, à différents niveaux (responsabilité, conception, réalisation, etc), et avec quelques ressources très riches.
À noter que les slides sont réalisés avec l’outil AccesSlide, une sorte de fork de reveal.js, en version accessible.
The rule and goal [of this project] are to annotate a web typeface each day, pointing out the beautiful details of the typefaces that one often takes for granted. This project is going to last for 100 days between May 18 and Aug 26 [2015].
About Type Detail, Wenting Zhang
Un beau projet pour découvrir des typographies. À noter également quelques éléments de l’interface du site (le détail dans le détail) :
hover des flèches pour passer d’une typeface à une autre, le fonctionnement par étiquettes, la navigation au clavier pour passer d’une présentation à une autre, etc.[…] nous ne ressentons pas forcément le besoin d’avoir plus de réglages, nous acceptons le « compromis » parce qu’il est suffisamment bon.
Jiminy Panoz
Jiminy Panoz décortique Medium et Pocket : ces deux plateformes – ou plutôt ce média et ce service – ont fait le choix de la lisibilité et de la simplicité. Deux questions sous-jacentes :
brief.me explique ce qui est complexe, résume ce qui est long, analyse ce qui est important.
brief.me
Recontextualiser l’information, designer un flux qui n’est pas celui des réseaux, remettre le travail de sélection au centre du service. En plus brief.me est graphiquement surperbement réalisé.
Une démarche à rapprocher de Fortuitement Trivial ?
Is your browser configuration rare or unique? If so, web sites may be able to track you, even if you limit or disable cookies.
Panopticlick
L’utilisation des cookies n’est donc pas forcément la technique utilisée pour tracker les internautes, le simple fait de savoir quelle est la configuration de votre navigateur web y suffit.
Et si dans notre recherche de performances nous restions simples que ce soit dans notre pratique, dans notre recherche créative, ainsi que dans le code que nous développons.
Les performances du Web, Karl Dubost
Optimiser n’est peut-être pas le meilleur choix pour obtenir un site web performant. Penser un site web – dès sa conception – avec autant de simplicité que possible.
Atomic design is methodology for creating design systems. There are five distinct levels in atomic design:
- Atoms
- Molecules
- Organisms
- Templates
- Pages
Atomic Design, Brad Frost
Cet article a été publié en octobre 2013, depuis plusieurs mois Brad Frost écrit un livre sur le design atomique – encore un livre web. Il s’agit plutôt d’une approche métier du design web, très intéressante en terme de conception.
À lire également, l’article de Thibault Mahé, Design atomique et design de styleguides.
Put down the jQuery, step away from the non-relational database: we have more important things to talk about.
Only 90s Web Developers Remember This, Zach Holman
Une plongée dans l’intégration web des années 1990 : du bricolage ? Non, plutôt des moyens ingénieux de contourner les limites des navigateurs.
Outils Libres Alternatifs est une initiative centrée sur la pratique, dont l’objectif est la promotion et la diffusion d’outils libres pour la création. Pour cela nous organisons des workshops durant lesquels un artiste, designer ou praticien se propose de partager sa pratique libre.
OLA #0 Expérimente l’édition libre
OLA lance un événement de deux jours autour de l’édition libre, un workshop ouvert, centré sur Scribus, une belle initiative. Du 29 au 31 mai 2015 à Paris.
This Is Responsive.
Patterns, resources and news for creating responsive web experiences.
This Is Responsive
Outils et ressources sur le RWD, beaucoup d’informations, et semble-t-il très pertinentes, proposées notamment par Brad Frost.
What we really need is a great Markdown tutorial and reference page, one that we can refer anyone to, anywhere in the world, from someone who barely touches computers to the hardest of hard-core coders. I don’t want to build another one for these kinds of help pages for Discourse, I want to build one for everyone. Since it is for everyone, I want to involve everyone. And by everyone, I mean you.
Toward a Better Markdown Tutorial, Jeff Atwood
L’enjeu autour de Markdown est bien d’expliquer simplement comment il fonctionne et surtout qu’est-ce qu’il peut apporter. Et il ne faut pas l’expliquer qu’aux connaisseurs.
Put simply, responsive is fluid and adapts to the size of the screen no matter what the target device. Responsive uses CSS media queries to change styles based on the target device such as display type, width, height etc., and only one of these is necessary for the site to adapt to different screens.
Adaptive design, on the other hand, uses static layouts based on breakpoints which don’t respond once they’re initially loaded. Adaptive works to detect the screen size and load the appropriate layout for it – generally you would design an adaptive site for six common screen widths […].
Responsive vs. Adaptive Design: What’s the Best Choice for Designers?, Jerry Cao sur UXPin
La différence essentielle entre les designs responsif et adaptatif réside donc dans les points de rupture. Le design responsif est donc ce qui a de plus liquide.
Condensé de connaissances hebdomadaires et mélangées
Fortuitement Trivial
Une démarche originale : diffuser trois informations, une fois par semaine, sur des sujets aussi divers que variés. Un beau concept porté par Marie et Julien.
A Modern Flat-File CMS
Grav
Un énième gestionnaire de contenus sans base de données, mais qui nécessite PHP. Je ne sais pas s’il vaut la peine par rapport à Jekyll par exemple.
- Accessibility is not a barrier to innovation.
- Don’t use color as the only visual means of conveying information.
- Ensure sufficient contrast between text and its background.
- Provide visual focus indication for keyboard focus.
- Be careful with forms.
- Avoid component identity crises.
- Don’t make people hover to find things. Jesse Hausler, Medium
La plupart de ces principes peuvent être appliqués en dehors de toute considération accessible, pour tout projet inclusif.
Mise à jour : une traduction, en français, de cet article sur Medium France.