Archive: June, 2019

169

sparkline
                    5th                     10th                     15th                     20th                     25th                     30th
12am      
4am        
8am                                    
12pm                                              
4pm                                      
8pm                  

Sunday, June 30th, 2019

Lights at sea

Lighthouses of the world, mapped.

Replying to a tweet from @shauninman

Congratulations!!!

Get off of Twitter | Read the Tea Leaves

You can’t criticize Twitter on Twitter. It just doesn’t work. The medium is the message.

Nolan’s plea for sanity.

Write blog posts. Use RSS. Use micro.blog. Use Mastodon. Use Pleroma. Use whatever you want, as long as it isn’t manipulating you with algorithms or selling access to your data to advertisers.

The Patterns Day Edition | Amy Hupe, content designer.

Amy’s talk at Patterns Day was absolutely brilliant! Here’s an account of the day from her perspective.

The evident care Jeremy put into assembling the lineup meant an incredible mix of talks, covering the big picture stuff right down to the nitty gritty, and plenty in between.

Her observation about pre-talk nerves is spot-on:

I say all of this because it’s important for me and I think anyone who suffers with anxiety about public speaking, or in general, to recognise that having a sense of impending doom doesn’t mean that doom is actually impending.

Patterns Day

Here’s a nice little round-up of Friday’s Patterns Day.

Checked in at Free Haus. Souvlaki — with Jessica map

Checked in at Free Haus. Souvlaki — with Jessica

Weeknotes #16 | Trys Mudford

Just look at these fantastic pictures that Trys took (very unobstrusively) at Patterns Day—so rock’n’roll!

The audience and the stage.

Closing remarks.

The Clearleft crew.

Patterns Day notes

Stuart took copious notes during every single talk at Patterns Day—what a star!

Nick Cave - The Red Hand Files - Issue #33 - Did you ever want to simply give up and quit, because of your inner voice? : The Red Hand Files

Nick Cave, like Ana, is blogging about the inner critic:

The truth is that virtually anybody who is trying to do anything worthwhile at all, especially creatively, has seated in his or her brain, a horrible homunculus that blows a dreadful little trumpet, and only knows one song – a song that goes, “You are not good enough. Why bother?” This evil little gnome is full of bad jazz, and is, in the words of author Sam Harris, “an asshole.” The enemy of aspiration, this atrocious inner voice demands you turn away from whatever your higher calling may be and become a second-rate, cut-price version of yourself. As your very own personal detractor it is deeply persuasive in its dark business.

Saturday, June 29th, 2019

Replying to a tweet from @zachleat

Oh, good to know—thank you!

Checked in at Brighton Dome. An evening with Nick Cave — with Jessica map

Checked in at Brighton Dome. An evening with Nick Cave — with Jessica

Checked in at Royal Pavilion Gardens. with Jessica map

Checked in at Royal Pavilion Gardens. with Jessica

Replying to a tweet from @joemccann

Because—given the environmental impact of proof of work—it is morally indefuckingfensible to invest in Bitcoin.

Replying to a tweet from @heydonworks

To everyone who came to #PatternsDay yesterday—thank you so, so much for being part of it! I had a blast and I hope you did too. Thank you!

Checked in at Holler Brewery And Tap Room. Post Patterns Day — with Jessica, Inayaili, Emil, Paul map

Checked in at Holler Brewery And Tap Room. Post Patterns Day — with Jessica, Inayaili, Emil, Paul

Friday, June 28th, 2019

Replying to a tweet from @obiwankimberly

W00t! So happy you could be there!

Replying to a tweet from @hereinthehive

Thank you so much, Dan—so glad you could be here for it!

Replying to a tweet from @daveymackintosh

Cheers, Dave! Thanks for being part of it!

Replying to a tweet from @freezydorito

Thank you so much for coming—it was lovely to meet you!

Replying to a tweet from @roessli

Thank you for coming! (also: chocolates!)

@NikkitaFTW

@NikkitaFTW

Thanks @HollerBrewery!

Thanks @HollerBrewery!

Replying to a tweet from @brad_frost

You’re a bad person and you should feel bad.

Naming things is hard. #PatternsDay

Naming things is hard. #PatternsDay

Tech checking for #PatternsDay. Here we go…

Tech checking for #PatternsDay. Here we go…

Thursday, June 27th, 2019

A great turnout for Homebrew Website Club Brighton in the @Clearleft studio!

A great turnout for Homebrew Website Club Brighton in the @Clearleft studio!

If you’re already in Brighton for tomorrow’s #PatternsDay, there isn’t an official pre-party or anything, but might I suggest gathering at the twin watering holes of The Eagle and The Basketmakers on Gloucester Road this evening? ☀️🍻

Brightonians (and visitors!) with websites: remember that this evening’s Homebrew Website Club Brighton is at the earlier time of 5pm in the @Clearleft studio.

Replying to a tweet from @arielwaldman

Oh, wow! Amazing!!!

Replying to a tweet from @simplebits

What I Learned Co-Founding Dribbble – SimpleBits

Twenty hard-won lessons from Dan from ten years of Dribbble.

We sent 50 shirts along with a card to friends and colleagues announcing Dribbble’s beta back in 2008. This first batch of members played a pivotal role in the foundation of the community and how it would develop. The shirt helped guilt them into actually checking out the site.

I think I still have my T-shirt somewhere!

Clarity and Style · Matthias Ott – User Experience Designer

Styling something is easy. Making something crystal clear is hard.

Checked in at Jolly Brewer. Session — with Jessica map

Checked in at Jolly Brewer. Session — with Jessica

Wednesday, June 26th, 2019

Checked in at Duke of York's Picturehouse for Apollo 11. Apollo 11 — with Jessica map

Checked in at Duke of York’s Picturehouse for Apollo 11. Apollo 11 — with Jessica

Phenological Mismatch - e-flux Architecture - e-flux

Over the last fifty years, we have come to recognize that the fuel of our civilizational expansion has become the main driver of our extinction, and that of many of the species we share the planet with. We are now coming to realize that is as true of our cognitive infrastructure. Something is out of sync, felt everywhere: something amiss in the temporal order, and it is as related to political and technological shifts, shifts in our own cognition and attention, as it is to climatic ones. To think clearly in such times requires an intersectional understanding of time itself, a way of thinking that escapes the cognitive traps, ancient and modern, into which we too easily fall. Because our technologies, the infrastructures we have built to escape our past, have turned instead to cancelling our future.

James writes beautifully about rates of change.

The greatest trick our utility-directed technologies have performed is to constantly pull us out of time: to distract us from the here and now, to treat time as a kind of fossil fuel which can be endlessly extracted in the service of a utopian future which never quite arrives. If information is the new oil, we are already, in the hyper-accelerated way of present things, well into the fracking age, with tremors shuddering through the landscape and the tap water on fire. But this is not enough; it will never be enough. We must be displaced utterly in time, caught up in endless imaginings of the future while endlessly neglecting the lessons and potential actions of the present moment.

Dark Patterns at Scale: Findings from a Crawl of 11K Shopping Websites

1,841 instances of dark patterns on ecommerce sites, in the categories of sneaking, urgency, misdirection, social proof, scarcity, obstruction, and forced action. You can browse this overview, read the paper, or look at the raw data.

We conducted a large-scale study, analyzing ~53K product pages from ~11K shopping websites to characterize and quantify the prevalence of dark patterns.

Replying to a tweet from @ptg

That’s a superb line-up!

Good to have you back in the conference-organising game, Patrick.

Finch Front-End · Edinburgh · 23rd-25th September 2019

This looks like an excellent conference line-up! Alas, I won’t be able to make it (I’m out of the country when it’s on) but you should definitely go if you can.

Tuesday, June 25th, 2019

Replying to a tweet from @_ovlb

Vielen Dank, Oscar—that’s very kind of you.

In defence of graceful degradation and where progressive enhancement comes in by Adam Silver

This does a really good job of describing the difference between progressive enhancement and graceful degradation …but I don’t buy the conclusion: I don’t think that feature detection equates to graceful degradation. I do agree though that, when it comes to JavaScript, the result of progressive enhancement is that the language degrades gracefully.

This is progressive enhancement. An approach to making interfaces that ensures JavaScript degrades gracefully—something that HTML and CSS do automatically.

But there’s a difference between something degrading gracefully (the result) and graceful degradation (the approach).

Replying to a tweet from @rem

As well as ourincrediblejourney.tumblr.com, there’s https://indieweb.org/site-deaths and https://www.archiveteam.org/index.php?title=Deathwatch

Replying to a tweet from @colly

I think I’ve still got mine somewhere too!

(Dan, I would very much like to link to your post: will you be posting it on your blog?)

(Remember your blog?)

(Remember your blog!)

If you’re in town for Patterns Day, note that Homebrew Website Club Brighton will start a bit earlier this Thursday: 5pm to 6:30pm at the @Clearleft studio.

cc. @AndyBellDesign @OhHelloAna

Monday, June 24th, 2019

Replying to a tweet from @ottomancer

Yes, indeed! Thanks to a recommendation from @Lloydi.

https://adactio.com/links/15375

Replying to a tweet from @simonrjones

Oh, that’s gonna be good! James Burke and Helen Sharman!!

Frank Chimero on causing ‘good trouble’ and re-imagining the status quo to combat achievement culture | Creative Boom

It’s really easy to think that not working full bore is somehow failing your teammates or that withholding effort is poor work ethic and moral weakness. That thought is worth interrogating, though, and it all seems kind of ridiculous once you get it out in the open. There should be no guilt for refusing to work hysterically.

It isn’t even July yet, and I’ve already got Apollo fever:

https://adactio.com/links/tags/apollo11

Next up: the new Apollo 11 documentary @DukeOfYorks this Wednesday:

https://twitter.com/DukeofYorks/status/1143082599604203521

Reading Other Minds: The Octopus, the Sea, and the Deep Origins of Consciousness by Peter Godfrey-Smith.

Replying to a tweet from @brucel

Thanks, thanks, thanks, Armitage Shanks:

https://www.youtube.com/watch?v=DBgHDSzd6BI

Am I cached or not?

When I was writing about the lie-fi strategy I’ve added to adactio.com, I finished with this thought:

What I’d really like is some way to know—on the client side—whether or not the currently-loaded page came from a cache or from a network. Then I could add some kind of interface element that says, “Hey, this page might be stale—click here if you want to check for a fresher version.”

Trys heard my plea, and came up with a very clever technique to alter the HTML of a page when it’s put into a cache.

It’s a function that reads the response body stream in, returning a new stream. Whilst reading the stream, it searches for the character codes that make up: <html. If it finds them, it tacks on a data-cached attribute.

Nice!

But then I was discussing this issue with Tantek and Aaron late one night after Indie Web Camp Düsseldorf. I realised that I might have another potential solution that doesn’t involve the service worker at all.

Caveat: this will only work for pages that have some kind of server-side generation. This won’t work for static sites.

In my case, pages are generated by PHP. I’m not doing a database lookup every time you request a page—I’ve got a server-side cache of posts, for example—but there is a little bit of assembly done for every request: get the header from here; get the main content from over there; get the footer; put them all together into a single page and serve that up.

This means I can add a timestamp to the page (using PHP). I can mark the moment that it was served up. Then I can use JavaScript on the client side to compare that timestamp to the current time.

I’ve published the code as a gist.

In a script element on each page, I have this bit of coducken:

var serverTimestamp = <?php echo time(); ?>;

Now the JavaScript variable serverTimestamp holds the timestamp that the page was generated. When the page is put in the cache, this won’t change. This number should be the number of seconds since January 1st, 1970 in the UTC timezone (that’s what my server’s timezone is set to).

Starting with JavaScript’s Date object, I use a caravan of methods like toUTCString() and getTime() to end up with a variable called clientTimestamp. This will give the current number of seconds since January 1st, 1970, regardless of whether the page is coming from the server or from the cache.

var localDate = new Date();
var localUTCString = localDate.toUTCString();
var UTCDate = new Date(localUTCString);
var clientTimestamp = UTCDate.getTime() / 1000;

Then I compare the two and see if there’s a discrepency greater than five minutes:

if (clientTimestamp - serverTimestamp > (60 * 5))

If there is, then I inject some markup into the page, telling the reader that this page might be stale:

document.querySelector('main').insertAdjacentHTML('afterbegin',`
  <p class="feedback">
    <button onclick="this.parentNode.remove()">dismiss</button>
    This page might be out of date. You can try <a href="javascript:window.location=window.location.href">refreshing</a>.
  </p>
`);

The reader has the option to refresh the page or dismiss the message.

This page might be out of date. You can try refreshing.

It’s not foolproof by any means. If the visitor’s computer has their clock set weirdly, then the comparison might return a false positive every time. Still, I thought that using UTC might be a safer bet.

All in all, I think this is a pretty good method for detecting if a page is being served from a cache. Remember, the goal here is not to determine if the user is offline—for that, there’s navigator.onLine.

The upshot is this: if you visit my site with a crappy internet connection (lie-fi), then after three seconds you may be served with a cached version of the page you’re requesting (if you visited that page previously). If that happens, you’ll now also be presented with a little message telling you that the page isn’t fresh. Then it’s up to you whether you want to have another go.

I like the way that this puts control back into the hands of the user.

Sunday, June 23rd, 2019

Replying to a tweet from @sil

To take selfies with. Duh!

Julio Biason .Net 4.0 - Things I Learnt The Hard Way (in 30 Years of Software Development)

Lots and lots of programming advice. I can’t attest to the veracity and efficacy of all of it, but this really rang true:

If you have no idea how to start, describe the flow of the application in high level, pure English/your language first. Then fill the spaces between comments with the code.

And this:

Blogging about your stupid solution is still better than being quiet.

You may feel “I’m not start enough to talk about this” or “This must be so stupid I shouldn’t talk about it”.

Create a blog. Post about your stupid solutions.

Picture 1 Picture 2

Prime meridian.

Picture 1 Picture 2

A field in England.

Picture 1 Picture 2

Hamsey.

BBC World Service - 13 Minutes to the Moon

I’ve been huffduffing every episode of this terrific podcast from Kevin Fong. It features plenty of my favourite Apollo people: Mike Collins, Margaret Hamilton, and Charlie Duke.

Rotating Space Station Numbers

Ever wondered what would happen if you threw a ball inside an orbital habitat? Well, wonder no more!

You can adjust the parameters of the space station, or choose from some pre-prepared examples: an O’Neill cylinder, a Stanford torus, a Bernal sphere, Rama, a Culture orbital

Saturday, June 22nd, 2019

BBC Shows and Tours - Shows - James Burke: Our Man on the Moon

I wish I were here for this (I’m going to be over in Ireland that week)—an evening with James Burke, Britain’s voice of Apollo 11.

Here is your chance to find out what went on behind the scenes as James revisits the final moments of the Apollo mission. He’ll recreate the drama, struggling to make sense of flickering images from NASA and working with the limitations of 1960s technology. We’ll hear what went wrong as well as what went right on the night! Illustrated with amazing archive material from both the BBC and NASA, this will be the story of the moon landings brought to you by the man who became a broadcasting legend.

Apollo 11 in Real-time

What a magnificent website! You can watch, read, and listen to the entire Apollo 11 mission! Do it now, or wait until until July 16th when you can follow along in real time …time-shifted by half a century.

Replying to a tweet from @carolstran

Thank you both for helping make my dream a reality.

Replying to a tweet from @otakuchick

Yes!  💯

Friday, June 21st, 2019

Replying to a tweet from @gablaxian

Oh, wow! That looks great! …But I’m going to be out of the country. 😢

Replying to a tweet from @smashingmag

Replying to a tweet from @philnash

I feel like we need a word or phrase to encapsulate SSR + rehydration; just saying SSR doesn’t cover it, in my opinion—it puts the emphasis on the part that isn’t causing the problem.

Replying to a tweet from @slightlylate

For clarity: is the problem with server-side rendering or is the problem with rehydration?

(e.g. if I serve up HTML+CSS and then don’t subsequently dump a bucket of JS on everything, is it fair to say that’s good for performance?)

Thursday, June 20th, 2019

Berliners—don’t miss this evening’s @BerlinJS; I’ve had a sneak peek of the talk that @CassieCodes is giving, and it is excellent!

Replying to a tweet from @girlie_mac

On Wall Street, no one can tell that @iamcal is wearing shorts.

A simple starter kit for Eleventy - Hylia Starter Kit

Andy has made this very handy pre-configured starter kit for anyone who wants to get a blog up and running on Netlify with Eleventy.

Hack the Moon

The history of Apollo’s hardware and software—the technology, the missions, and the people; people like Elaine Denniston and Margaret Hamilton.

(The site is made by Draper, the company founded by Doc Draper, father of inertial navigation.)

Replying to a tweet from @jamesernator

Web standards aren’t like software development. When something lands in a browser, it’s forever. That should not be taken lightly.

Replying to a tweet from @discodavey

Whoops! Looks like an unencoded ampersand slipped in there. Should be all fixed now. (Thanks for letting me know!)

Replying to a tweet from @nekrtemplar

I 100% agree that Apple are the worst at making up proprietary crap behind closed doors.

That in no way absolves other browser vendors from being held to account (especially the browser with the largest market share).

Wednesday, June 19th, 2019

Replying to a tweet from @aardrian

Doh! Fixed.

Toast

Shockwaves rippled across the web standards community recently when it appeared that Google Chrome was unilaterally implementing a new element called toast. It turns out that’s not the case, but the confusion is understandable.

First off, this all kicked off with the announcement of “intent to implement”. That makes it sounds like Google are intending to, well, …implement this. In fact “intent to implement” really means “intend to mess around with this behind a flag”. The language is definitely confusing and this is something that will hopefully be addressed.

Secondly, Chrome isn’t going to ship a toast element. Instead, this is a proposal for a custom element currently called std-toast. I’m assuming that should the experiment prove successful, it’s not a foregone conclusion that the final element name will be called toast (minus the sexually-transmitted-disease prefix). If this turns out to be a useful feature, there will surely be a discussion between implementators about the naming of the finished element.

This is the ideal candidate for a web component. It makes total sense to create a custom element along the lines of std-toast. At first I was confused about why this was happening inside of a browser instead of first being created as a standalone web component, but it turns out that there’s been a fair bit of research looking at existing implementations in libraries and web components. So this actually looks like a good example of paving an existing cowpath.

But it didn’t come across that way. The timing of announcements felt like this was something that was happening without prior discussion. Terence Eden writes:

It feels like a Google-designed, Google-approved, Google-benefiting idea which has been dumped onto the Web without any consideration for others.

I know that isn’t the case. And I know how many dedicated people have worked hard on this proposal.

Adrian Roselli also remarks on the optics of this situation:

To be clear, while I think there is value in minting a native HTML element to fill a defined gap, I am wary of the approach Google has taken. A repo from a new-to-the-industry Googler getting a lot of promotion from Googlers, with Googlers on social media doing damage control for the blowback, WHATWG Googlers handling questions on the repo, and Google AMP strongly supporting it (to reduce its own footprint), all add up to raise alarm bells with those who advocated for a community-driven, needs-based, accessible web.

Dave Cramer made a similar point:

But my concern wasn’t so much about the nature of the new elements, but of how we learned about them and what that says about how web standardization works.

So there’s a general feeling (outside of Google) that there’s something screwy here about the order of events. A lot discussion and research seems to have happened in isolation before announcing the intent to implement:

It does not appear that any discussions happened with other browser vendors or standards bodies before the intent to implement.

Why is this a problem? Google is seeking feedback on a solution, not on how to solve the problem.

Going back to my early confusion about putting a web component directly into a browser, this question on Discourse echoes my initial reaction:

Why not release std-toast (and other elements in development) as libraries first?

It turns out that std-toast and other in-browser web components are part of an idea called layered APIs. In theory this is an initiative in the spirit of the extensible web manifesto.

The extensible web movement focused on exposing low-level APIs to developers: the fetch API, the cache API, custom elements, Houdini, and all of those other building blocks. Layered APIs, on the other hand, focuses on high-level features …like, say, an HTML element for displaying “toast” notifications.

Layered APIs is an interesting idea, but I’m worried that it could be used to circumvent discussion between implementers. It’s a route to unilaterally creating new browser features first and standardising after the fact. I know that’s how many features already end up in browsers, but I think that the sooner that authors, implementers, and standards bodies get a say, the better.

I certainly don’t think this is a good look for Google given the debacle of AMP’s “my way or the highway” rollout. I know that’s a completely different team, but the external perception of Google amongst developers has been damaged by the AMP project’s anti-competitive abuse of Google’s power in search.

Right now, a lot of people are jumpy about Microsoft’s move to Chromium for Edge. My friends at Microsoft have been reassuring me that while it’s always a shame to reduce browser engine diversity, this could actually be a good thing for the standards process: Microsoft could theoretically keep Google in check when it comes to what features are introduced to the Chromium engine.

But that only works if there is some kind of standards process. Layered APIs in general—and std-toast in particular—hint at a future where a single browser vendor can plough ahead on their own. I sincerely hope that’s a misreading of the situation and that this has all been an exercise in miscommunication and misunderstanding.

Like Dave Cramer says:

I hear a lot about how anyone can contribute to the web platform. We’ve all heard the preaching about incubation, the Extensible Web, working in public, paving the cowpaths, and so on. But to an outside observer this feels like Google making all the decisions, in private, and then asking for public comment after the feature has been designed.

Using Hamburger Menus? Try Sausage Links · Bradley Taunt

Another take on the scrolling navigation pattern. However you feel about the implementation details, it’s got to better than the “teenage tidying” method of shoving everything behind a hamburger icon.

Tuesday, June 18th, 2019

A song of AIs and fire

The televisual adaption of Game of Thrones wrapped up a few weeks ago, so I hope I can safely share some thoughts with spoilering. That said, if you haven’t seen the final season, and you plan to, please read no further!

There has been much wailing and gnashing of teeth about the style of the final series or two. To many people, it felt weirdly …off. Zeynep’s superb article absolutely nails why the storytelling diverged from its previous style:

For Benioff and Weiss, trying to continue what Game of Thrones had set out to do, tell a compelling sociological story, would be like trying to eat melting ice cream with a fork. Hollywood mostly knows how to tell psychological, individualized stories. They do not have the right tools for sociological stories, nor do they even seem to understand the job.

Let’s leave aside the clumsiness of the execution for now and focus on the outcomes.

The story finishes with Bran as the “winner”, in that he now rules the seve— six kingdoms. I have to admit, I quite like the optics of replacing an iron throne with a wheelchair. Swords into ploughshares, and all that.

By this point, Bran is effectively a non-human character. He’s the Dr. Manhattan of the story. As the three-eyed raven, he has taken on the role of being an emotionless database of historical events. He is Big Data personified. Or, if you squint just right, he’s an Artificial Intelligence.

There’s another AI in the world of Game of Thrones. The commonly accepted reading of the Night King is that he represents climate change: an unstoppable force that’s going to dramatically impact human affairs, but everyone is too busy squabbling in their own politics to pay attention to it. I buy that. But there’s another interpretation. The Night King is rogue AI. He’s a paperclip maximiser.

Clearly, a world ruled by an Artificial Intelligence like that would be a nightmare scenario. But we’re also shown that a world ruled purely by human emotion would be just as bad. That would be the tyrannical reign of the mad queen Daenerys. Both extremes are undesirable.

So why is Bran any better? Well, technically, he isn’t ruling alone. He has a board of (very human) advisors. The emotionless logic of a pure AI is kept in check by a council of people. And the extremes of human nature are kept in check by the impartial AI. To put in another way, humanity is augmented by Artificial Intelligence: Man-computer symbiosis.

Whether it’s the game of chess or the game of thrones, a centaur is your best bet.

Oh Hello Ana - Six talks later

I really admire Ana’s honesty here in confronting her inner critic (who she calls “side B Ana”).

Admiring the care and attention that @rem has put into the technology and the documentation for https://webmention.app/

So useful!

Automate your outgoing webmentions

I’ve been kicking the tyres on this great new tool from Remy. Give it a URL and it’ll find all the links in its h-entrys and automatically send webmentions to them. Very cool!

The documentation on the site is excellent, guiding you to the right solution for your particular needs. Read Remy’s announcement:

I’ve also tried very hard to get the documentation to be as welcoming as I can. I’ve tried to think about my dear visitor and what they want to do with the software, rather than type my typical developer approach to documentation - listing all the features and options.

How to Section Your HTML | CSS-Tricks

A deep dive with good advice on using—and labelling—sectioning content in HTML: nav, aside, section, and article.

Replying to a tweet from @backblaze

Just getting through to support was a trial: even though I was already logged in, I was made to complete multiple dehumanising CAPCHAs just to file an issue.

Replying to a tweet from @SaraSoueidan

I was using Backblaze but it slowed my Mac to a complete crawl (and their support is terrible) so I’m looking for a replacement now too.

The New Wilderness (Idle Words)

An excellent piece by Maciej on the crucial difference between individual privacy and ambient privacy (and what that means for regulation):

Ambient privacy is not a property of people, or of their data, but of the world around us. Just like you can’t drop out of the oil economy by refusing to drive a car, you can’t opt out of the surveillance economy by forswearing technology (and for many people, that choice is not an option). While there may be worthy reasons to take your life off the grid, the infrastructure will go up around you whether you use it or not.

Because our laws frame privacy as an individual right, we don’t have a mechanism for deciding whether we want to live in a surveillance society. Congress has remained silent on the matter, with both parties content to watch Silicon Valley make up its own rules. The large tech companies point to our willing use of their services as proof that people don’t really care about their privacy. But this is like arguing that inmates are happy to be in jail because they use the prison library. Confronted with the reality of a monitored world, people make the rational decision to make the best of it.

That is not consent.

For more detail, I highly recommend reading his testimony to the senate hearing on Privacy Rights and Data Collection in a Digital Economy.

Kicks Condor: The Web Finally Feels New Again

For me, I do find that Webmentions are really enhancing linking—by offering a type of bidirectional hyperlink. I think if they could see widespread use, we’d see a Renaissance of blogging on the Web. Webmentions are just so versatile—you can use them to commment, you an form ad-hoc directories with them, you can identify yourself to a wider community. I really feel like they are a useful modernization.

A wonky barter (Phil Gyford’s website)

I don’t know how we got to a point where chatting and sharing with friends means having to pick through adverts, and agreeing to being tracked and marketed at, and risk being exposed to, or abused by, terrible people. Our conversations and holiday snaps have become darkly marketed events. You could say this is a fair exchange but it feels wrong to me. The things being exchanged are too different, a kind of category error. It’s a wonky kind of barter in which I feel powerless and used. It’s not why I came here, to the internet.

Monday, June 17th, 2019

Drop caps & design systems - Vox Product Blog

Sit down and listen to a story from uncle Ethan.

First You Make the Maps

How cartography made early modern global trade possible.

Maps and legends. Beautiful!

Pasta!

Pasta!

How to land on the Moon

Take a tour of the Lunar Module.

The LM (or “LEM”, as it’s pronounced) has the appearance of an aeronautical joke, with not a trace of streamlining. Instead, it’s an insect-like asymmetrical collection of legs, angles, bulges, and surfaces that’s very hard to visualize. Frankly, it looks like it was thrown together on a Friday afternoon by someone in a hurry to go fishing.

A Complete Beginner’s Guide to React by Ali Spittel

This really is a most excellent introduction to React. Complete with cheat sheet!

The Problem With “Content”   – On my Om

My website has my words, my interviews, my photos, and my identity — what it doesn’t have, as far as I’m concerned, is “content.” Looking at it from the other side, for platforms like Facebook, Instagram, and YouTube, everything is “content” regardless of its provenance. Each creation is merely an object, only valuable for its ability to increase our time spent on their platforms, allowing them to sell more advertising.

Sunday, June 16th, 2019

The Crushing Weight of the Facepile—zachleat.com

Using IntersectionObserver to lazy load images—very handy for webmention avatars.

7 absolute truths I unlearned as junior developer

This is a wonderfully written post packed with hard-won wisdom.

This are the myths that Monica dispelled for herself:

  1. I’m a senior developer
  2. Everyone writes tests
  3. We’re so far behind everyone else (AKA “tech FOMO”)
  4. Code quality matters most
  5. Everything must be documented!!!!
  6. Technical debt is bad
  7. Seniority means being the best at programming

CURRENT FUTURES: A Sci-Fi Ocean Anthology—XPRIZE

A collection of sci-fi short stories about oceans, featuring contributions from Madeline Ashby, Lauren Beukes, Elizabeth Bear, and more.

BBC - Future - How to build something that lasts 10,000 years

As part of the BBC’s ongoing series on deep time, Alexander Rose describes the research he’s been doing for the clock of the long now—materials, locations, ideas …all the pieces that have historically combined to allow artifacts to survive.

When should you be using Web Workers? — DasSur.ma

Although this piece is ostensibly about why we should be using web workers more, there’s a much, much bigger point about the growing power gap between the devices we developers use and the typical device used by the rest of the planet.

While we are getting faster flagship phones every cycle, the vast majority of people can’t afford these. The more affordable phones are stuck in the past and have highly fluctuating performance metrics. These low-end phones will mostly likely be used by the massive number of people coming online in the next couple of years. The gap between the fastest and the slowest phone is getting wider, and the median is going down.

ffconf - Web development & JavaScript conference in Brighton, UK

All of the talks from ten years of FF Conf …including this pretentious one from five years ago.

Relearn CSS layout: Every Layout

A new site from Heydon and Andy that provides CSS algorithms for common layout patterns.

If you find yourself wrestling with CSS layout, it’s likely you’re making decisions for browsers they should be making themselves. Through a series of simple, composable layouts, Every Layout will teach you how to better harness the built-in algorithms that power browsers and CSS.

HTML is the Web ~ Pete Lambert

The lowest common denominator of the Web. The foundation. The rhythm section. The ladyfingers in the Web trifle. It’s the HTML. And it is becoming increasingly clear to me that there’s a whole swathe of Frontend Engineers who don’t know or understand the frontend-est of frontend technologies.

This page is a truly naked, brutalist html quine.

What you see really is what you get. I like this style!

Saturday, June 15th, 2019

Replying to a tweet from @discodavey

Looking forward to it! Say Hi to to the eLife crew for me!

Friday, June 14th, 2019

Hot ’Dam!

Hot ’Dam!

Trying to unsee the swastikas in the CSS Day logo.

Trying to unsee the swastikas in the CSS Day logo.

Picture 1 Picture 2

I met some of my CSS heroes at CSS Day: @LaraS126 and @Fantasai!

Replying to a tweet from @_bdbch

Please unfollow me.

Danke.

Listening to two titans of CSS: @fantasai and @tabatkins on the @CSSday stage.

Listening to two titans of CSS: @fantasai and @tabatkins on the @CSSday stage.

Thursday, June 13th, 2019

Glad to hear that this common use-case is getting “standardised”:

https://adactio.com/notes/toast

Replying to a tweet from @KatieELambert

whispers if you add the Instagram website to your home screen, it’s pretty much the same as the app …but without ads!

https://adactio.com/journal/14112

Wednesday, June 12th, 2019

Breaking the physical limits of fonts

This broke my brain.

The challenge: in the fewest resources possible, render meaningful text.

  • How small can a font really go?
  • How many bytes of memory would you need (to store it and run it?)
  • How much code would it take to express it?

Lets see just how far we can take this!

Replying to a post on daverupert.com

A big +1 to Lara’s Resilient Management!

Reading Binti Home by Nnedi Okorafor.

Going to Amsterdam. brb

Replying to a tweet from @andybudd

Hanlon’s Razor + Clarke’s Third Law of Technology =

Any sufficiently advanced incompetence is indistinguishable from malice.

Tuesday, June 11th, 2019

The Lost tags of HTML

I’ll be in my bunk.

Replying to a tweet from @lottejackson

It’s really good!

Mornington Crescent - Esolang

A (possibly) Turing complete language:

As the validity and the semantics of a program depend on the structure of the London underground system, which is administered by London Underground Ltd, a subsidiary of Transport for London, who are likely unaware of the existence of this programming language, its future compatibility is uncertain. Programs may become invalid or subtly wrong as the transport company expands or retires some of the network, reroutes lines or renames stations. Features may be removed with no prior consultation with the programming community. For all we know, Mornington Crescent itself may at some point be closed, at which point this programming language will cease to exist.

Replying to a tweet from @laurakalbag

Her book, Inferior, is really good!

https://adactio.com/notes/15130

Baking accessibility into components: how frameworks help

A very thoughtful post by Hidde that draws a useful distinction between the “internals” of a component (the inner workings of a React component, Vue component, or web component) and the code that wires those components together (the business logic):

I really like working on the detailed stuff that affects users: useful keyboard navigation, sensible focus management, good semantics. But I appreciate not every developer does. I have started to think this may be a helpful separation: some people work on good internals and user experience, others on code that just uses those components and deals with data and caching and solid architecture. Both are valid things, both need love. Maybe we can use the divide for good?

Monday, June 10th, 2019

The CSS Mindset | Max Böck - Frontend Web Developer

This post absolutely nails what’s special about CSS …and why supersmart programmers might have trouble wrapping their head around it:

Other programming languages often work in controlled environments, like servers. They expect certain conditions to be true at all times, and can therefore be understood as concrete instructions as to how a program should execute.

CSS on the other hand works in a place that can never be fully controlled, so it has to be flexible by default.

Max goes on to encapsulate years of valuable CSS learnings into some short and snappy pieces of advices:

No matter what your level of CSS knowledge, this post has something for you—highly recommended!

(Open) source of anxiety – Increment: Open Source

If we continue as we are, who will maintain the maintainers?

In the world of open source, we tend to give plaudits and respect to makers …but maintainers really need our support and understanding.

Users and new contributors often don’t see, much less think about, the nontechnical issues—like mental health, or work-life balance, or project governance—that maintainers face. And without adequate support, our digital infrastructure, as well as the people who make it run, suffer.

Making QR codes with cloud functions • tommorris.org

Tom makes an endpoint for generating QR codes so you don’t have to rely on the Google Charts API.

He also provides a good definition of “serverless”:

Now, serverless is a very silly buzzword dreamed up by someone from the consultant class who love coming up with terrible names, so I promise I won’t use it any further. Your code obviously run on a server. It just means it runs on a server someone else manages.

Amazon call it a ‘Lambda Function’. Google call it a ‘Cloud Function’. Microsoft Azure call it simply a ‘Function’. But none of those are very descriptive, because, well, anyone who writes any kind of programming language generally writes functions pretty much all the time in much the same way as anyone who writes English writes paragraphs, and we don’t call our blogging software “Cloud Paragraphs”. (Someone will now, I’m guessing.)

Replying to a tweet from @TatianaTMac

I recommend JavaScript for Web Designers by @wilto …but don’t tell him I said that.

https://abookapart.com/products/javascript-for-web-designers

The schedule for Patterns Day

Patterns Day is less than three weeks away—exciting!

We’re going to start the day at a nice civilised time. Registration is from 9am. There will be tea, coffee, and pastries, so get there in plenty of time to register and have a nice chat with your fellow attendees. There’ll be breaks throughout the day too.

Those yummy pastries and hot drinks are supplied courtesy of our sponsors Buildit @ Wipro Digital—many thanks to them!

Each talk will be 30 minutes long. There’ll be two talks back-to-back and then a break. That gives you plenty of breathing space to absorb all those knowledge bombs that the speakers will be dropping.

Lunch will be a good hour and a half. Lunch isn’t provided so you can explore the neighbourhood where there are plenty of treats on offer. And your Patterns Day badge will even get you some discounts…

The lovely Café Rust is offering these deals to attendees:

  • Cake and coffee for £5
  • Cake and cup of tea for £4
  • Sandwich and a drink for £7

The Joker (right across the street from the conference venue) is offering a 10% discount of food and drinks (but not cocktails) to Patterns Day attendees. I highly recommend their hot wings. Try the Rufio sauce—it’s awesome! Do not try the Shadow—it will kill you.

Here’s how the day is looking:

Registration
Opening remarks
Alla
Yaili
Break
Amy
Danielle
Lunch
Heydon
Varya
Break
Una
Emil
Closing remarks

We should be out of the Duke of York’s by 4:45pm after a fantastic day of talks. At that point, we can head around the corner (literally) to Holler Brewery. They are very kindly offering each attendee a free drink! Over to them:

Holler is a community based brewery, always at the centre of the local community. Here to make great beer, but also to help support community run pubs, carnival societies, mental health charities, children’s amateur dramatic groups, local arts groups and loads more, because these are what keep our communities healthy and together… the people in them!

Holler loves great beer and its way of bringing people together. They are excited to be welcoming the Patterns Day attendees and the design community to the taproom.

Terms and conditions:

  • One token entitles to you one Holler beer or one soft drink
  • Redeemable only on Friday 28th June 2019 between 4:45 and 20:00
  • You must hand your token over to the bar team

You’ll get your token when you register in the morning, along with your sticker. That’s right; sticker. Every expense has been spared so you won’t even have a name badge on a lanyard, just a nice discrete but recognisable sticker for the event.

I am so, so excited for Patterns Day! See you at the Duke of York’s on June 28th!

Render Snarky Comments in Comic Sans—zachleat.com

Sounds like Zach had a great time at Indie Web Camp Düsseldorf:

I can’t really express how meaningful this experience was to me. An antithesis to the rat race of social media, IndieWebCamp was a roomful of kindred spirits that care about the web and their own websites and hosting their own content. It felt like the Google Reader days again, when everyone was blogging and writing on their own sites. I dunno if you can tell but I loved it.

He also made a neat little plug-in that renders negative comments in Comic Sans with mixed cased writing:

This isn’t intended to be a hot-take on Comic Sans. Instead it’s meant to change the tone of the negativity to make it sound like a clown is yelling at a kid’s birthday party.

Sunday, June 9th, 2019

Checked in at Bison Beach Bar. with Jessica map

Checked in at Bison Beach Bar. with Jessica

Replying to a tweet from @niamhmccoo

Go raibh míle maith agat, Niamh!

Got up. Typed baconmethod.com into a browser. Getting the day off to a good start.

VOCAL

Each typeface highlights a piece of history from a specific underrepresented race, ethnicity, or gender—from the Women’s Suffrage Movement in Argentina to the Civil Rights Movement in America.

German Naming Convention

Don’t write fopen when you can write openFile. Write throwValidationError and not throwVE. Call that name function and not fct. That’s German naming convention. Do this and your readers will appreciate it.

Saturday, June 8th, 2019

Checked in at Kouzina. with Jessica map

Checked in at Kouzina. with Jessica

Friday, June 7th, 2019

Replying to a tweet from @andybudd

Equating anti-persona with anti-vaxxer is the very definition of bullshit.

Language and the Invention of Writing | Talking Points Memo

Language is not an invention. As best we can tell it is an evolved feature of the human brain. There have been almost countless languages humans have spoken. But they all follow certain rules that grow out of the wiring of the human brain and human cognition. Critically, it is something that is hardwired into us. Writing is an altogether different and artificial thing.

An Introduction to ARIA States | a11y with Lindsey

A very useful explanation of the ARIA attributes relating to state:

  1. aria-expanded,
  2. hidden,
  3. aria-hidden, and
  4. aria-current.

mathieudutour/medium-to-own-blog: Switch from Medium to your own blog in a few minutes

Following on from Stackbit’s tool, here’s another (more code-heavy) way of migrating from Ev’s blog to your own site.

Three conference talks

Conference talks are like buses. They take a long time and you constantly ask yourself why you chose to get on board.

I’ll start again.

Conference talks are like buses. You wait for ages and then three come along at once. Or at least, three conference videos have come along at once:

  1. The video of the talk I gave at State Of The Browser called The Web Is Agreement.
  2. The video of the talk I gave at New Adventures called Building.
  3. The video of the talk I gave at Frontend United called Going Offline.

That last one is quite practical. It’s very much in the style of the book I wrote on service workers. If you’d like to see this talk, you should come to An Event Apart in Chicago in August.

The other two are …less practical. They’re kind of pretentious really. That’s kinda my style.

The Web Is Agreement was a one-off talk for State Of The Browser. I like how it turned out, and I’d love to give it again if there were a suitable event.

I will be giving my New Adventures talk again in Vancouver next month at the Design & Content conference. You should come along—it looks like it’s going to be a great event.

I’ve added these latest three conference talk videos to my collection. I’m using Notist to document past talks. It’s a great service! I became a paying customer just over a year ago and it was money well spent. I really like how I’ve been able to set up a custom domain:

speaking.adactio.com

Jeremy Keith: Going offline - YouTube

Here’s the opening keynote I gave at Frontend United in Utrecht a few weeks back.

Building on Vimeo

Here’s the video of the opening talk I gave at New Adventures earlier this year. I think it’s pretty darn good!

Thursday, June 6th, 2019

Khoi Vinh on How His Blog Amplified His Work and Career – Own Your Content

It’s hard to overstate how important my blog has been, but if I were to try to distill it down into one word, it would be: “amplifier.”

Khoi talks about writing on his own website.

I personally can’t imagine handing over all of my labor to a centralized platform where it’s chopped up and shuffled together with content from countless other sources, only to be exploited at the current whims of the platform owners’ volatile business models.

An oral history of the hamburger icon (from the people who were there)

From the days of Xerox PARC:

In your garage organization, there’s always a bucket for miscellaneous. You’ve got nuts and bolts and screws and nails, and then, stuff, miscellaneous stuff. That’s kind of what the hamburger menu button was.

Same as it ever was.

I reckon Homebrew Website Club Brighton in the @Clearleft studio this evening will be quite short—then I’m going to pop downstairs to @UXCampBrighton 2019 Redux in @68MiddleSt.

Have we reached Peak Data?

Matt’s publishing a newsletter on the past, present, and future of tracking:

The last 100 years have been a journey to see how to measure ghosts - how to measure the invisible audiences at the end of technological distribution networks. With every decade, these ghosts have come more and more into focus, ending with a the last ten years of social media and digital advertising that has created unimaginable amounts of data about everything we see, read, click and like.

He sees the pendulum swinging the other way now …for those who can afford it:

If there’s one constant in the economics of audience data over the last 100 years, is that we only get free services if we pay for them with our attention. This has been true for commercial radio and television, free newspapers, mobile games and digital content. If we want privacy, we have to pay for it, and not everyone can afford this. Will the right to become a ghost only be for the people with money to buy premium products?

I may have gone off on a bit of a rant in the latest newsletter from @Clearleft:

https://tinyletter.com/clearleft/letters/clearletter-from-clearleft-privisight

You can sign up for more rantage here: https://tinyletter.com/clearleft

SOTB2018 - Jeremy Keith - The Web Is Agreement - YouTube

Here’s the video of the talk I gave at State Of The Browser last year. The audio is a bit out of sync with the video.

The talk is called The Web Is Agreement. It’s ostensibly about web standards, but I used that as a jumping off point for talking about life, the universe, and everything.

I enjoyed giving this talk, but I’ve only ever given it this one time. If you know of any events where this talk would be a good fit, let me know.

Patterns for Promoting PWA Installation (mobile)  |  Web Fundamentals  |  Google Developers

Some ideas for interface elements that prompt progressive web app users to add the website to their home screen.

Replying to a tweet from @dgsiegel

Whoops! Good catch—fixed.

Designing for actual performance by Adam Silver

This is something I’ve been thinking about a lot lately. The justification for single page apps feels like circular thinking to me. A JavaScript framework is needed to avoid full page refreshes because full page refreshes are expensive because that means assets will be reloaded …assets like the JavaScript framework that only exists to avoid the full page refresh.

This is how it goes. We put a load of shit into a single web page. This makes the page slow. Slow to load, slow to render. Slow.

Instead of getting rid of the shit, we blame the page refresh.

JAMstack? More like SHAMstack. | CSS-Tricks

Chris makes the very good point that the J in JAMstack isn’t nearly as important as the static hosting part.

I also pointed out to Phil recently that the M (markup) is far more important than the J (JavaScript), which is there to enhance the M. So I suggested that the acronym be updated accordingly:

MAJstack!

This is my maj.

Wednesday, June 5th, 2019

Picture 1 Picture 2 Picture 3 Picture 4

Barrafina feast.

Let’s Clarify some Misunderstandings around Sign In with Apple • Aaron Parecki

Aaron knows what he’s talking about when it comes to authentication, and Apple’s latest move with sign-in for native apps gets the thumbs up.

Sign In with Apple is a good thing for users! This means apps will no longer be able to force you to log in with your Facebook account to use them.

This does not mean that Apple is requiring every app to use Sign in with Apple.

Replying to a tweet from @Una

How about container quer—

https://adactio.com/journal/12585

Replying to a tweet from @StuRobson

Oh, that’s a good point about putting the link to the original near the top. I’m going to do that from now on.

Tuesday, June 4th, 2019

Got a preview of the talk that @CassieCodes is preparing for @CSScamp and, I gotta say, it’s going to be a treat!

Monday, June 3rd, 2019

Checked in at The Fiddler's Elbow. Session — with Jessica map

Checked in at The Fiddler’s Elbow. Session — with Jessica

Checked in at The Lord Nelson Inn. Listening to Lizzy Hardingham. — with Jessica map

Checked in at The Lord Nelson Inn. Listening to Lizzy Hardingham. — with Jessica

Behold! @Clearleft’s majestic rooftop guardian.

Behold! @Clearleft’s majestic rooftop guardian.

Today’s oyster.

Today’s oyster.

Self-Host Your Static Assets – CSS Wizardry

Trust no one! Harry enumerates the reason why you should be self-hosting your assets (and busts some myths along the way).

There really is very little reason to leave your static assets on anyone else’s infrastructure. The perceived benefits are often a myth, and even if they weren’t, the trade-offs simply aren’t worth it. Loading assets from multiple origins is demonstrably slower.

Resilient Management | A book for new managers in tech

I got a preview copy of this book and, my oh my, it is superb!

If your job involves dealing with humans (or if it might involve dealing with humans in the future), you’ll definitely want to read this.

Replying to a tweet from @andybudd

I would say Falcor from Neverending Story, the big flying dog.

Mackerel sandwich.

Mackerel sandwich.

Taking in the sea air.

Taking in the sea air.

Checked in at The Bugle Inn. with Jessica map

Checked in at The Bugle Inn. with Jessica

Sunday, June 2nd, 2019

Fantastic pop-up from @mestiza.filipina at @hollertap: ox tongue with pickle and banana ketchup!

Fantastic pop-up from @mestiza.filipina at @hollertap: ox tongue with pickle and banana ketchup!

Picture 1 Picture 2

Urban aliens.

Saturday, June 1st, 2019

Reading The Future Home Of The Living God by Louise Erdrich.

Checked in at Casa Azul Taqueria. Taco time! — with Jessica map

Checked in at Casa Azul Taqueria. Taco time! — with Jessica

Replying to a tweet from @andymcmillan

❤️