| 5th | 10th | 15th | 20th | 25th | 30th | |||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 12am | ||||||||||||||||||||||||||||||
| 4am | ||||||||||||||||||||||||||||||
| 8am | ||||||||||||||||||||||||||||||
| 12pm | ||||||||||||||||||||||||||||||
| 4pm | ||||||||||||||||||||||||||||||
| 8pm |
Jason describes the next big thing in web typography: streaming fonts!
…to enable the ability for only the required part of the font be downloaded on any given page, and for subsequent requests for that font to dynamically ‘patch’ the original download with additional sets of glyphs as required on successive page views—even if they occur on separate sites.
What makes a startup ecosystem thrive?
What do people plan to do once they’re over 35?
Is an income of $160K enough to survive?
What kind of car does Mark Zuckerberg drive?
Some good advice from Hidde, based on his recent talk Six ways to make your site more accessible.
What would Wiener think of the current human use of human beings? He would be amazed by the power of computers and the internet. He would be happy that the early neural nets in which he played a role have spawned powerful deep-learning systems that exhibit the perceptual ability he demanded of them—although he might not be impressed that one of the most prominent examples of such computerized Gestalt is the ability to recognize photos of kittens on the World Wide Web.
Thorough (and grim) research from Chris.
I think the situation that Remy outlines here is quite common (in client-rehydrated server-rendered pages), but what’s less common is Remy’s questioning and iteration.
So I now have a simple rule of thumb: if there’s an onClick, there’s got to be an anchor around the component.
Following on from Harry’s slides, here’s another round-up of thoserel attribute values that begin with pre.
Slides from Harry’s deep dive into rel values: preconnect, prefetch, and preload.
A terrific six-part series of short articles looking at the people behind the history of Artificial Intelligence, from Babbage to Turing to JCR Licklider.
The history of AI is often told as the story of machines getting smarter over time. What’s lost is the human element in the narrative, how intelligent machines are designed, trained, and powered by human minds and bodies.
Chris ponders the motivations behind companies sharing their design systems publicly. Personally, I’ve always seen it as a nice way of sharing work and saying “here’s what worked for us” without necessarily saying that anyone else should use the same system.
That said, I think Chris makes a good poin here:
My parting advice is actually to the makers of public design systems: clearly identify who this design system is for and what they are able to do with it.
I missed this when it was first posted three years ago, but now I think I’ll be revisiting this 12 minute interview every few months.
Everything that Kyle says here is spot on, nuanced, and thoughtful. He talks about abstraction, maintainability, learning, and complexity.
I want a transcript of the whole thing.
The 2019 edition of Cody Lindley’s book is a good jumping-off point with lots of links to handy resources.
Isn’t this just lovely?
Cassie made a visualisation of the power we’re getting from the solar panels we installed on the roof of the Clearleft building.
I highly recommend reading her blog post about the process too. She does such a great job of explaining how she made API calls, created SVGs, and calculated animations.
There’s a new reissue of the twenty year old documentary on Justin Hall’s links.net and the early days of the web.
Well, the clever CSS techniques just keep on comin’ from Trys—I’m learning so much from him!
Cassie’s terrific talk from Bytes Conf, featuring some wild CSS experiments.
(Conference organisers—you want Cassie on your stage!)
![Limitation Breeds Creativity - Cassie Evans [Bytes Conf 2019]](https://i.ytimg.com/vi/cgDBFldyJdM/mqdefault.jpg)
Inspired by Charlie, here’s a straightforward bit of code for starting or joining your own webring.
Scott writes up that super smart transclusion trick of his.
James has a new four part series on Radio 4. Episodes will be available for huffduffing shortly after broadcast.
New Ways of Seeing considers the impact of digital technologies on the way we see, understand, and interact with the world. Building on John Berger’s seminal Ways of Seeing from 1972, the show explores network infrastructures, digital images, systemic bias, education and the environment, in conversation with a number of contemporary art practitioners.
Three short films set in the near future from the suitably ominous-sounding Surveillance Studies Centre. The Black Mirrorlets are:
Paul describes a fairly straightforward service worker recipe: a custom offline page for failed requests.
Dave stops feeding his site’s visitors data to Google. I wish more people (and companies) would join him.
There’s also an empowering #indieweb feeling about owning your analytics too. I pay for the server my analytics collector runs on. It’s on my own subdomain. It’s mine.
Woah! This is one smart hack!
Scott has figured out a way to get all the benefits of pointing to an external SVG file …that then gets embedded. This means you can get all the styling and scripting benefits that only apply to embedded SVGs (like using fill).
The fallback is very graceful indeed: you still get the SVG (just not embedded).
Now imagine using this technique for chunks of HTML too …transclusion, baby!
Trys has made YASSG—Yet Another Static Site Generator. It’s called Sergey (like SSG, see?) and it does just one thing: it allows you to include chunks of markup. It’s Apache Server Side Includes all over again!
Kick the tyres and see what you think.
Charlie muses on ol’ fashioned web rings …and the cultural needs they fulfilled.
We suffer from homogenous dirge in most of our contemporary web presences. Having a personal website has become a rarer and rarer thing in this time of social media profile pages.
However, recent months have seen a surge in personal websites and blogging amongst some members of the web tech community. This is something that we urgently need to encourage!
What happens when you’re AMP pages are slower than your regular pages …but you’re forced to use AMP anyway if you want to appear in the top stories carousel.
AMP isn’t about speed. It’s about control.
The elephant in the room here is pre-rendering: that’s why Google aren’t using page speed alone as a determining factor for what goes in the carousel.
I would urge front-end developers to take a step back, breathe, and reassess. Let’s stop over engineering for the sake of it. Let’s think what we can do with the basic tools, progressive enhancement and a simpler approach to building websites. There are absolutely valid usecases for SPAs, React, et al. and I’ll continue to use these tools reguarly and when it’s necessary, I’m just not sure that’s 100% of the time.
If you’re using Apple’s VoiceOver, both your phone and your computer will broadcast your assumed disability to the entire internet, unless and until you specifically tell it to stop.
On an individual and small collective basis, the IndieWeb already works. But does an IndieWeb approach scale to the general public? If it doesn’t scale yet, can we, who envision and design and build, create a new generation of tools that will help give birth to a flourishing, independent web? One that is as accessible to ordinary internet users as Twitter and Facebook and Instagram?
Wouldn’t it be great if every component in your design system had accessibility acceptance criteria? Paul has some good advice for putting those together:
- Start with accessibility needs
- Don’t be too generic
- Don’t define the solution
- Iterate criteria
I’ve often said that the goal of a good library should be to make itself redundant. jQuery is the poster child for that, and this article points to web components as the way to standardise what’s already happening in JavaScript frameworks:
Remember when
document.querySelectorfirst got wide browser support and started to end jQuery’s ubiquity? It finally gave us a way to do natively what jQuery had been providing for years: easy selection of DOM elements. I believe the same is about to happen to frontend frameworks like Angular and React.
The article goes on to give a good technical overview of custom elements, templates, and the Shadow DOM, but I was surprised to see it making reference to the is syntax for extending existing HTML elements—I’m pretty sure that that is, sadly, dead in the water.
In some cases, it’s entirely valid to explore new products and technologies, but in others, our striving for novelty becomes the driving factor for abandoning perfectly suitable solutions under the umbrella of technical debt.
Just because a technology is a few years old and possibly frustrating in some cases doesn’t mean you’re in technical debt. We need to stop projecting our annoyances as pitfalls of technological or design choices.
When you greet a stranger, look at his shoes.
Keep your money in your shoes.
Put your trouble behind.
When you greet a stranger, look at her hands.
Keep your money in your hands.
Put your travel behind.
We have a tendency in our line of work to assume that what benefits us as developers translates to a benefit for those who use what we make. This is an unsafe assumption.
A free and open source neutral sans-serif typeface, released as part of version two of the design system for the US federal government.
- Morality is not always relative.
- You’re a web professional.
- The web is accessible out-of-the-box. We break it.
- It’s not on people with disabilities to tell you how you screwed up.
- It should be easier. This is our job.
Oodles and oodles of data on cities, including gorgeous animations of urban growth over time.
200 discarded objects from a dump in San Francisco, meticulously catalogued, researched, and documented by Jenny Odell. The result is something more revealing than most pre-planned time capsule projects …although this project may be somewhat short-lived as it’s hosted on Tumblr.
An online documentary series featuring interviews with smart people about the changing role of design.
As technology becomes more complex and opaque, how will we as designers understand its potential, do hands-on work, translate it into forms people can understand and use, and lead meaningful conversations with manufacturers and policymakers about its downstream implications? We are entering a new technology landscape shaped by artificial intelligence, advanced robotics and synthetic biology.
So far there’s Kevin Slavin, Molly Wright Steenson, and Alexandra Daisy Ginsberg, with more to come from the likes of Matt Jones, Anab Jain, Dan Hill, and many, many more.
A very handy collection of design exercises as used by 18F. There’s a lot of crossover here with the Clearleft toolbox.
A collection of tools to bring human-centered design into your project.
These methods are categorised by:
- Discover
- Decide
- Make
- Validate
- Fundamentals
Frameworks (arguably) make building complex applications easier, but they make doing simple stuff more complex.
And that’s why I think people should learn vanilla JS first. I’ve had many students who tried to learn frameworks get frustated, quit, and focus on vanilla JS.
Some of them have gone back to frameworks later, and told me that knowing vanilla JS made it a lot easier for them to pick up frameworks afterwards.
When we hide content, there’s a greater risk the user won’t see it. There’s a higher reliance on digital literacy and it’s generally more labour intensive for the user.
Worse still, sometimes we kill off essential content.
The loading attribute for images and iframes is coming to Chrome. The best part:
You can also use
loadingas a progressive enhancement. Browsers that support the attribute can get the new lazy-loading behavior withloading=lazyand those that don’t will still have images load.
So much of my echo chamber is consumed by people, including myself, who have a very dim view of JavaScript frameworks being thrown at everything, arguing with the people who are in the process of throwing JavaScript frameworks at everything. We forget one very important thing, though: we represent the minority of the web community and our arguments probably look very pointless and silly to the majority.
This is a fascinating insight into what it’s like to use the web if you’ve got vertigo (which is way more common than you might think):
Really, there are no words to describe just how bad a simple parallax effect, scrolljacking, or even
background-attachment: fixedwould make me feel. I would rather jump on one of those 20-G centrifuges astronauts use than look at a website with parallax scrolling.Every time I encountered it, I would put the bucket beside me to good use and be forced to lie in bed for hours as I felt the room spinning around me, and no meds could get me out of it. It was THAT bad.
Ignore the ludicrously clickbaity title. This is a well-considered look at thirty years of linking on the World Wide Web.
After two decades in tech, I realise phones and social media won’t be going away, so we work with them. My take is that I now need to seek positive digital tools that connect more of us to the non-digital world and really benefit our lives.
This article by Ian Bogost from a few years back touches on one of the themes in the talk I gave at New Adventures:
“Engineer” conjures the image of the hard-hat-topped designer-builder, carefully crafting tomorrow. But such an aspiration is rarely realized by computing. The respectability of engineering, a feature built over many decades of closely controlled, education- and apprenticeship-oriented certification, becomes reinterpreted as a fast-and-loose commitment to craftwork as business.
This is a bit ranty but it resonates with what I’ve been noticing lately:
I’ve discovered how many others have felt similarly, overwhelmed by the choices we have as modern developers, always feeling like there’s something we should be doing better.
I’m so, so happy that Trys has joined us at Clearleft!
Here, he recounts his first day, which just happened to coincide with an introductory UX workshop that went really well.
I also discussed this accessibility events feature with my friend who is a screen reader user herself. She said it feels like it’s a first step towards a well-meant digital apartheid.
This is a really nice write-up of creating an accessible progressive disclosure widget (a show/hide toggle).
Where it gets really interesting is when Andy shows how it could all be encapsulated into a web component with a progressive enhancement mindset
This is such a well-written piece! Jay Hoffman—author of the excellent History Of The Web newsletter—talks us through the JavaScript library battles of the late 2000’s …and the consequences that arose just last year.
The closing line is perfect.
This might just be the most nerdily specific book I’ve read and enjoyed. Even if you’re not planning to build a web browser any time soon, it’s kind of fascinating to see how HTML is parsed—and how much of an achievement the HTML spec is, for specifying consistent error-handling, if nothing else.
The last few chapters are still in progress, but you can read the whole thing online or buy an ePub version.
