Saturday, May 19th, 2018
Thursday, May 10th, 2018
Saturday, February 25th, 2017
Hey @han, happy birthday!
Monday, June 13th, 2016
The challenge still stands:
Even better, so does the HTML.
Friday, July 31st, 2015
Thursday, July 30th, 2015
Wednesday, March 25th, 2015
Results of a survey of over 1000 people working on the web. It’s beautifully put together and the overall trajectory regarding responsive design looks pretty positive to me.
Sunday, March 22nd, 2015
Wednesday, December 31st, 2014
It’s the end of the year as we know it.
It’s the last day of the year. I won’t be going out tonight. I’m going to stay in with Jessica in our cosy home.
The general consensus is that 2014 was a crappy year for human beings on planet Earth. In actuality, and contrary to popular belief, the human race continued its upward trend of improvement in almost all areas. Less violence, less disease, fewer wars, a record-breaking minimum of air crashes, and while the disparity between the richest and the poorest has increased, the baseline level of what constitutes poverty continues to increase throughout the world.
This trend is often met with surprise, or even disbelief. Just ask Matt Ridley and Steven Pinker. We tend to over-inflate the negative and undervalue the positive. And we seem to do it more and more with each passing year (which, in itself, can be seen as part of the overall positive trend: the fact that violence and inequality outrages us now more than ever is, on balance, a good thing). It seems to be part of our modern human nature to allow the bad to overwhelm the good in its importance.
Take my past year, for example. There was so much that was good. It was a good year for Clearleft and I travelled to marvellous places (Tel Aviv, Munich, Seattle, Austin, San Diego, Riga, Freiburg, Bologna, Florida, and more). I ate wonderful food. I read. I wrote. I listened. I spoke. I attended some workshops. I ran some workshops. I learned. I taught. I went to some great events. I organised Responsive Day Out 2 and dConstruct. I even wrote the occasional bit of code.
But despite all of that, 2014 is a year that feels dominated by death.
It started at the beginning of the year with the death of Jessica’s beloved Oma. The only positive spin I can put on it is that she had a long life, and she died surrounded by her family (Jessica included). But it was still a horrible event.
For the first half of the year, the web community was united behind Eric as he went through the unimaginable. Then, in June, Rebecca died. And the web community was united in sorrow. It was such an outrage against all that is good in this world.
I visited Eric that day. I tried to convey how much the people of the web were feeling for him. I couldn’t possibly convey it, but I had to try. I offered what comfort I could, but some situations are so far beyond normalcy that literally nothing can be done.
That death, the death of a child …there’s something so wrong, so obscene about it.
One month later, Chloe killed herself.
I miss her. I miss her so much.
So I understand why, despite the upward trends in human achievement, despite all the positive events of the last twelve months, 2014 feels like a year of dread and grief. I understand why so many people are happy to see the back of 2014. Good riddance, right?
But I still don’t want to let the bad—and boy, was it ever bad—crush the good. I’m seeing out the year as I mean to go on: eating good food, drinking good wine, reading, writing, and being alive.
It’s the last day of the year. I won’t be going out tonight. I’m going to stay in with Jessica in our cosy home.
Tuesday, October 21st, 2014
Indie web building blocks
I was back in Nürnberg last week for the second border:none. Joschi tried an interesting format for this year’s event. The first day was a small conference-like gathering with an interesting mix of speakers, but the second day was much more collaborative, with people working together in “creator units”—part workshop, part round-table discussion.
I teamed up with Aaron to lead the session on all things indie web. It turned out to be a lot of fun. Throughout the day, we introduced the little building blocks, one by one. By the end of the day, it was amazing to see how much progress people made by taking this layered approach of small pieces, loosely stacked.
The first step is: do you have a domain name?
Okay, next step: are you linking from that domain to other profiles of you on the web? Twitter, Instagram, Github, Dribbble, whatever. If so, here’s the first bit of hands-on work: add
rel="me" to those links.
<a rel="me" href="https://twitter.com/adactio">Twitter</a> <a rel="me" href="https://github.com/adactio">Github</a> <a rel="me" href="https://www.flickr.com/people/adactio">Flickr</a>
If you don’t have any profiles on other sites, you can still mark up your telephone number or email address with
rel="me". You might want to do this in a
link element in the
head of your HTML.
<link rel="me" href="mailto:firstname.lastname@example.org" /> <link rel="me" href="sms:+447792069292" />
As soon as you’ve done that, you can make use of IndieAuth. This is a technique that demonstrates a recurring theme in indie web building blocks: take advantage of the strengths of existing third-party sites. In this case, IndieAuth piggybacks on top of the fact that many third-party sites have some kind of authentication mechanism, usually through OAuth. The fact that you’re “claiming” a profile on a third-party site using
rel="me"—and the third-party profile in turn links back to your site—means that we can use all the smart work that went into their authentication flow.
You can see IndieAuth in action by logging into the Indie Web Camp wiki. It’s pretty nifty.
If you’ve used
rel="me" to link to a profile on something like Twitter, Github, or Flickr, you can authenticate with their OAuth flow. If you’ve used
rel="me" for your email address or phone number, you can authenticate by email or SMS.
Next question: are you publishing stuff on your site? If so, mark it up using h-entry. This involves adding a few classes to your existing markup.
<article class="h-entry"> <div class="e-content"> <p>Having fun with @aaronpk, helping @border_none attendees mark up their sites with rel="me" links, h-entry classes, and webmention endpoints.</p> </div> <time class="dt-published" datetime="2014-10-18 08:42:37">8:42am</time> </article>
Now, the reason for doing this isn’t for some theoretical benefit from search engines, or browsers, but simply to make the content you’re publishing machine-parsable (which will come in handy in the next steps).
Aaron published a note on his website, inviting everyone to leave a comment. The trick is though, to leave a comment on Aaron’s site, you need to publish it on your own site.
Webmention is basically a reimplementation of pingback, but without any of the XML silliness; it’s just a POST request with two values—the URL of the origin post, and the URL of the response.
My site doesn’t automatically send webmentions to any links I reference in my posts—I should really fix that—but that’s okay; Aaron—like me—has a form under each of his posts where you can paste in the URL of your response.
This is where those h-entry classes come in. If your post is marked up with h-entry, then it can be parsed to figure out which bit of your post is the body, which bit is the author, and so on. If your response isn’t marked up as h-entry, Aaron just displays a link back to your post. But if it is marked up in h-entry, Aaron can show the whole post on his site.
Okay. By this point, we’ve already come really far, and all people had to do was edit their HTML to add some
rel attributes and
For true site-to-site communication, you’ll need to have a webmention endpoint. That’s a bit trickier to add to your own site; it requires some programming. Here’s my minimum viable webmention that I wrote in PHP. But there are plenty of existing implentations you can use, like this webmention plug-in for WordPress.
Once you have a webmention endpoint, you can point to it from the
head of your HTML using a
<link rel="mention" href="https://adactio.com/webmention" />
Now you can receive responses to your posts.
Here’s the really cool bit: if you sign up for Bridgy, you can start receiving responses from third-party sites like Twitter, Facebook, etc. Bridgy just needs to know who you are on those networks, looks at your website, and figures everything out from there. And it automatically turns the responses from those networks into h-entry. It feels like magic!
Here are responses from Twitter to my posts, as captured by Bridgy.
That was mostly what Aaron and I covered in our one-day introduction to the indie web. I think that’s pretty good going.
The next step would be implementing the idea of POSSE: Publish on your Own Site, Syndicate Elsewhere.
You could do this using something as simple as If This, Then That e.g. everytime something crops up in your RSS feed, post it to Twitter, or Facebook, or both. If you don’t have an RSS feed, don’t worry: because you’re already marking your HTML up in h-entry, it can be converted to RSS easily.
I’m doing my own POSSEing to Twitter, which I’ve written about already. Since then, I’ve also started publishing photos here, which I sometimes POSSE to Twitter, and always POSSE to Flickr. Here’s my code for posting to Flickr.
I’d really like to POSSE my photos to Instagram, but that’s impossible. Instagram is a data roach-motel. The API provides no method for posting photos. The only way to post a picture to Instagram is with the Instagram app.
My only option is to do the opposite of POSSEing, which is PESOS: Publish Elsewhere, and Syndicate to your Own Site. To do that, I need to have an endpoint on my own site that can receive posts.
Working side by side with Aaron at border:none inspired me to finally implement one more indie web building block I needed: micropub.
Having a micropub endpoint here on my own site means that I can publish from third-party sites …or even from native apps. The reason why I didn’t have one already was that I thought it would be really complicated to implement. But it turns out that, once again, the trick is to let other services do all the hard work.
First of all, I need to have something to manage authentication. Well, I already have that with IndieAuth. I got that for free just by adding
rel="me" to my links to other profiles. So now I can declare indieauth.com as my authorization endpoint in the
head of my HTML:
<link rel="authorization_endpoint" href="https://indieauth.com/auth" />
Now I need some way of creating and issuing authentation tokens. See what I mean about it sounding like hard work? Creating a token endpoint seems complicated.
But once again, someone else has done the hard work so I don’t have to. Tokens-as-a-service:
<link rel="token_endpoint" href="https://tokens.indieauth.com/token" />
The last piece of the puzzle is to point to my own micropub endpoint:
<link rel="micropub" href="https://adactio.com/micropub" />
That URL is where I will receive posts from third-party sites and apps (sent through a POST request with an access token in the header). It’s up to me to verify that the post is authenticated properly with a valid access token. Here’s the PHP code I’m using.
It wasn’t nearly as complicated as I thought it would be. By the time a post and a token hits the micropub endpoint, most of the hard work has already been done (authenticating, issuing a token, etc.). But there are still a few steps that I have to do:
- Make a GET request (I’m using cURL) back to the token endpoint I specified—sending the access token I’ve been sent in a header—verifying the token.
- Check that the “me” value that I get back corresponds to my identity, which is https://adactio.com
- Take the h-entry values that have been sent as POST variables and create a new post on my site.
Finally, there’s OwnYourGram, a service that monitors your Instagram account and posts to your micropub endpoint whenever there’s a new photo.
Indie Web Camp
Each one of these building blocks unlocks greater and greater power:
Each one of those building blocks you implement unlocks more and more powerful tools:
But its worth remembering that these are just implementation details. What really matters is that you’re publishing your stuff on your website. If you want to use different formats and protocols to do that, that’s absolutely fine. The whole point is that this is the independent web—you can do whatever you please on your own website.
Still, if you decide to start using these tools and technologies, you’ll get the benefit of all the other people who are working on this stuff. If you have the chance to attend an Indie Web Camp, you should definitely take it: I’m always amazed by how much is accomplished in one weekend.
Some people have started referring to the indie web movement. I understand where they’re coming from; it certainly looks like a “movement” from the outside, and if you attend an Indie Web Camp, there’s a great spirit of sharing. But my underlying motivations are entirely selfish. In the same way that I don’t really care about particular formats or protocols, I don’t really care about being part of any kind of “movement.” I care about my website.
As it happens, my selfish motivations align perfectly with the principles of an indie web.
Wednesday, September 10th, 2014
This episode of Click on the BBC World Service does a great job of distilling some of the ideas and themes from this year’s dConstruct.
Two years ago dConstruct’s theme was “Playing with the Future”. Last year it was “Communicating with Machines”. This year’s theme is “Living with the Network”. Click interviews artists, writers, hackers and coders about surveillance, connected devices, big data, and whether the ideals of the internet have been too far corrupted for them ever to be preserved.
A round-up of the themes addressed at this year’s dConstruct.
Monday, September 8th, 2014
Laura’s thoughts on this year’s dConstruct.
All the audio from this year’s dConstruct. Each and every one of these talks is worth listening to …more than once.
Thoughtful, mind-expanding, brain-blowing stuff.
dConstruct is all done for another year. Every year I feel sort of dazed in the few days after the conference—I spend so much time and energy preparing for this event looming in my future, that it always feels surreal when it’s suddenly in the past.
But this year I feel particularly dazed. A little numb. Slightly shellshocked even.
This year’s dConstruct was …heavy. Sure, there were some laughs (belly laughs, even) but overall it was a more serious event than previous years. The word that I heard the most from people afterwards was “important”. It was an important event.
Here’s the thing: if I’m going to organise a conference in 2014 and give it the theme of “Living With The Network”, and then invite the most thoughtful, informed, eloquent speakers I can think of …well, I knew it wasn’t going to be rainbows and unicorns.
If you were there, you know what I mean. If you weren’t there, it probably sounds like it wasn’t much fun. To be honest, “fun” wasn’t the highest thing on the agenda this year. But that feels right. And even though it wasn’t a laugh-fest, it was immensely enjoyable …if, like me, you enjoy having your brain slapped around.
I’m going to need some time to process and unpack everything that was squeezed into the day. Fortunately—thanks to Drew’s typical Herculean efforts—I can do that by listening to the audio, which is already available!
Slap the RSS feed in your generic MP3 listening device of choice and soak up the tsunami of thoughts, ideas, and provocations that the speakers delivered.
Oh boy, did the speakers ever deliver!
Listen, it’s very nice that people come along to dConstruct each year and settle into the Brighton Dome to listen to these talks, but the harsh truth is that I didn’t choose the speakers for anyone else but myself. I know that’s very selfish, but it’s true. By lucky coincidence, the speakers I want to see turn out to deliver the best damn talks on the planet.
That said, as impressed as I was by the speakers, I was equally impressed by the audience. They were not spoon-fed. They had to contribute their time, attention, and grey matter to “get” those talks. And they did. For that, I am immensely grateful. Thank you.
I’m not going to go through all the talks one by one. I couldn’t do them justice. What was wonderful was to see the emerging themes, ideas, and references that crossed over from speaker to speaker: thoughts on history, responsibility, power, control, and the future.
And yes, there was definitely a grim undercurrent to some of those ideas about the future. But there was also hope. More than one speaker pointed out that the future is ours to write. And the emphasis on history highlighted that our present moment in time—and our future trajectory—is all part of an ongoing amazing collective narrative.
But it’s precisely because the future is ours to write that this year’s dConstruct hammered home our collective responsibility. This year’s dConstruct was a grown-up, necessarily serious event that shined a light on our current point in history …and maybe, just maybe, provided some potential paths for the future.
Feeling like freshly stoked warrior of freedom, ready for battle against complacency. Bring on the future. Bring on the change. #dConstruct— Charles Roper (@charlesroper) September 5, 2014
That was a hard but rewarding #dconstruct. Dense and dark. Grown up, thoughtful, political.— Andrew Travers (@atrvrs) September 5, 2014
Digging the how-I-learned-to-stop-worrying-and-love-the-dystopia vibes of every #dConstruct talk today. (Ir)rational responses to 2014.— Matthew Ogle (@flaneur) September 5, 2014
This year's @dconstruct was a darker affair than usual, but given recent events, necessarily so. Lots to think about and digest. Inspiring.— Garrett Coakley (@garrettc) September 6, 2014
Troubled by this year's @dconstruct. A definite undercurrent throughout. Totally unlike previous years.— Ed Horsford (@edwardhorsford) September 5, 2014
I love how @dconstruct has been deliciously political.— Mr. Andrew Clarke (@Malarkey) September 5, 2014
Some seriously deep thinking behind today's @dconstruct talks— chillfinn (@chillfinn) September 5, 2014
Struck by dissatisfactions with technology #dconstruct not much drum beating but warnings, ideas, and nods to history— Jonathan Sapsed (@JSapsed) September 5, 2014
Thanks and goodbye Brighton. @dConstruct was typically great, I had lots of fun, but am sad to leave & am considerably more thoughtful.— Sally Jenkinson (@sjenkinson) September 6, 2014
@dconstruct talks are always mindblowing, and even the most casual of conversations are memorable. Bye for now, Brighton!— steph troeth (@sniffles) September 6, 2014
At the station about to leave Brighton once more. #dConstruct was brilliant, I’m still trying to digest it all to be honest.— Adam Onishi (@onishiweb) September 6, 2014
What a great event @dConstruct is. I’m feeling inspired and this mornings shower was particularly productive…— David Watson (@springfishblue) September 6, 2014
So glad I came to #dconstruct. Incredible talks— Shane Hudson (@ShaneHudson) September 5, 2014
You know after you've read good dystopian sci-fi and you can't shake feeling both disturbed and educated in an important way? #dConstruct— Charles Roper (@charlesroper) September 6, 2014
The 'd' in this year's @dconstruct stands for dystopian.— Andrew Travers (@atrvrs) September 5, 2014
Slides and transcript from Anab’s terrific dConstruct talk.
Sunday, September 7th, 2014
Tom Scott’s energetic dConstruct talk.
Saturday, September 6th, 2014
Tom’s photos from dConstruct.
Thursday, September 4th, 2014
This week in Brighton
This is my favourite week of the year. It’s the week when Brighton bursts into life as the its month-long Digital Festival kicks off.
Already this week, we’ve had the Dots conference and three days of Reasons To Be Creative, where designers and makers show their work. And this afternoon Lighthouse are running their annual Improving Reality event.
But the best is yet to come. Tomorrow’s the big day: dConstruct 2014. I’ve been preparing for this day for so long now, it’s going to be very weird when it’s over. I must remember to sit back, relax and enjoy the day. I remember how fast the day whizzed by last year. I suspect that tomorrow’s proceedings might display equal levels of time dilation—I’m excited to see every single talk.
Even when dConstruct is done, the Brighton festivities will continue. I’ll be at Indie Web Camp here at 68 Middle Street on Saturday on Sunday. Also on Saturday, there’s the brilliant Maker Faire, and when the sun goes down, Brighton will be treated to Seb’s latest project which features frickin’ lasers!
This is my favourite week of the year.
Friday, August 22nd, 2014
Georgina Voss at dConstruct
There is a change to the advertised line-up…
Alas, Jen can no longer make it to Brighton. Circumstances have conspired to make trans-atlantic travel an impossibility. It’s a real shame because I was really looking forward to her talk, but these things happen (and she’s gutted too: she was really looking forward to being in Brighton for this year’s dConstruct).
But never fear. We’ve swapped out one fantastic talk for another fantastic talk. Brighton’s own Georgina Voss has very kindly stepped into the breach. She’s going to knock your socks off with her talk, Tethering the Hovercraft:
A careen through grassroots innovation, speculative design, supply chains and sexual healthcare provision, lashing down over-caffeinated flailing into the grit of socio-technical systems.
I had the chance to see Georgina speak a few months back at Lighthouse Arts and it was terrific. She is the perfect fit for this year’s dConstruct—she really is living with the network.