1. Favicon Adactio: Journal

    [Blog] Adactio: Journal: 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="">Twitter</a>
    <a rel="me" href="">Github</a>
    <a rel="me" href="">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="" />
    <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>
      <time class="dt-published" datetime="2014-10-18 08:42:37">8:42am</time>

    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.


    Here’s my response to Aaron’s post. As well as being published on my own site, it also shows up on Aaron’s. That’s because I sent a webmention to Aaron.

    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 class values.

    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.

    Or you could request an account on, which is basically webmention-as-a-service. Handy!

    Once you have a webmention endpoint, you can point to it from the head of your HTML using a link element:

    <link rel="mention" href="" />

    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 as my authorization endpoint in the head of my HTML:

    <link rel="authorization_endpoint" href="" />

    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="" />

    The last piece of the puzzle is to point to my own micropub endpoint:

    <link rel="micropub" href="" />

    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:

    1. 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.
    2. Check that the “me” value that I get back corresponds to my identity, which is
    3. Take the h-entry values that have been sent as POST variables and create a new post on my site.

    I tested my micropub endpoint using Quill, a nice little posting interface that Aaron built. It comes with great documentation, including a guide to creating a micropub endpoint.

    It worked.

    Here’s another example: Ben Roberts has a posting interface that publishes to micropub, which means I can authenticate myself and post to my site from his interface.

    Finally, there’s OwnYourGram, a service that monitors your Instagram account and posts to your micropub endpoint whenever there’s a new photo.

    That worked too. And I can also hook up Bridgy to my Instagram account so that any activity on my Instagram photos also gets sent to my webmention endpoint.

    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.

    Posted 21 October 2014, 5:49 pm

  2. Favicon martyn reding - juggling with water

    [Blog] martyn reding - juggling with water: The Future of Programming by @worrydream

    I recently attended a two track conference (one track design, one track dev) and for the sake of not watching a presentation I'd already seen and for the sake of forcing myself to open my brain beyond design I decided to spend the morning in the Dev track.

    It turned out to be a fantastic idea. One of the references during the presentations was this presentations by Bret Victor. Most of the Developer attendees nodded along knowingly, however none of my design friends have heard of it.

    Yes it's a presentation about programming, but wait! It's probably one of the most creative presentations you'll see. Bret Victor gave this entire presentation from the perspective of a 1970s Californian computer scientist. The idea of looking at the future, from a historic view is total genius. Bret's attention to detail is wonderful. He dresses as a stereotypical 70s computer operator, complete with pocket pen pouch. He even delivers the slides using an overhead projector.

    One of the key messages in this presentation is that technology moves quickly, but people's behaviour takes much longer change. Which brings back the argument that because we know how to do something, does it mean we should do it?

    It also nicely frames the notion that in order to really understand where we (the digital industry) are going, we have to fully understand where we've come from.

    Posted 21 October 2014, 4:45 pm

  3. Favicon NixonMcInnes

    [Blog] NixonMcInnes: Transformation or Tinkering?

    This is the title of the talk I am delivering this week at HR Tech Europe in Amsterdam. It came from a tweet that I dashed off in frustration a few weeks ago: “Do you want transformation or do you want tinkering?” Why the frustration? Because there is much talk of the potential of social tools to bring about change in business, but not much evidence of real impact. 

    Even if people have embraced social platforms, and appear active, a lot of the energy is still soaked up by “busy”ness. Reading case studies, choosing tools, deploying tools, measuring tools, writing reports about tools. But how much change is actually going on? How much have they got to grips with people? The messy, scary, unpredictable business of truly connecting with people and enabling them to really adapt and change often deeply held assumptions about work.

    The real benefits of social in business should be huge. Not just a trendy new communications channel down which to push content, but a robust platform on which to have work-focussed conversations and get things done. Not just an “employee engagement” palliative, but something that has a productively disruptive impact on the business.

    But for this to happen, people have to want it. They have to understand what they are getting themselves into. They have to be willing to give up their familiar ideas of work and embrace something radically new. This is especially true of those promoting the use of these new tools.

    Too often, when I ask clients how their social media platforms are doing in their organisations, there is the following exchange: “No one is using them.” “Are you using them?” “No I am much too busy.”

    The sort of profound change we are looking for in our workplaces happens one person at a time, one conversation at a time, and for their reasons not ours. This calls for a different approach to management and a shift in our understanding of work. This doesn’t just happen. It takes real work. It IS the real work.


    To find out more follow #HRTechEurope or say hi to @euan or @contentqueen at HR Tech Europe later this week. If you’d like to talk about how we can help your organisation benefit from more social and collaborative ways of working, email



    Contributor has not supplied alternative text for this image

    Posted 21 October 2014, 4:08 pm

  4. Favicon SiteVisibility

    [Blog] SiteVisibility: Long Tail Keywords and Profitability – Felice Ayling – Podcast Episode #267

    In this week’s Internet Marketing Podcast Andy talks to Felice Ayling, Digital Media Director at SiteVisibility, about long tail keywords. They first discuss the difference between head keywords and long tail keywords and the different results each type of search give you. They then talk about how longer tail keywords are more suited to those looking to target particular niches and that they often have much higher conversion rates. Finally, they chat about the various tools available to help you identify the keywords you want to target.

    Post from Apple Pie & Custard blog by SiteVisibility - An SEO Agency

    Long Tail Keywords and Profitability – Felice Ayling – Podcast Episode #267

    Contributor has not supplied alternative text for this image Contributor has not supplied alternative text for this image Contributor has not supplied alternative text for this image
    Contributor has not supplied alternative text for this image

    Posted 21 October 2014, 11:00 am

  5. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: FatSand Films teams up with Brilliant Noise to produce Enigma Paint Works Film

    We are very happy to say that the new Enigma Bikes film is now Live. Brilliant Noise have been working with Enigma Bikes to redesign their brand and online presence for the last 9 months, and approached us to produce a film which captures the excellent ...

    Posted 21 October 2014, 1:00 am

  6. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: It's that time of year already - the Wired Sussex Members' Christmas Meetup is coming!

    Meeting other members and talking to Wired Sussex about what you and/or your company needs is one of the best ways of getting the most out of your membership. The more we know about you, the better we can help; and the more you know who we are - and ...

    Posted 21 October 2014, 1:00 am

  7. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: Platforms

    THE CALL FOR PARTICIPANTS IN THE NEW LIGHTHOUSE STUDIO PROGRAMME IS NOW OPEN. APPLICATION DEADLINE: MONDAY 3 NOVEMBER Platforms is a new studio programme being launched by Lighthouse, supported by Creative Skillset, that will bring together creative ...

    Posted 21 October 2014, 1:00 am

  8. Writing For SEO

    [Blog] Writing For SEO: What Does Writing Copy Mean?

    We talk a lot about not copying content on the Web and republishing it. What each of us put online must be unique.

    Which led a reader to ask me why we talk about producing ‘copy’ for websites.

    So what’s this about writing copy?

    It’s a term that predates the Internet by many decades. Professional writers always produce ‘copy’ – for newspapers, magazines, books, you name it.

    But why ‘copy’, when the work must be original? I found this on

    1. an imitation…
    2. one of various examples…
    3. written matter intended to be reproduced in printed form:
    “The editor sent the copy for the next issue to the printer.”
    4. The text of a news story, advertisement, television commercial, etc., as distinguished from related visual material.
    5. the newsworthiness of a person, thing or event…
    6. Computers…
    7. Genetics…

    (my emboldening).

    So it seems that copy is a work meant to be copied – i.e. printed or reproduced.

    Or is it? On, I found this definition:

    Copy is a derivative of the latin “ad copies” meaning “to provide” which in turn may be traced back to Greek “ad copium” meaning “to nourish” or “to give”. In a modern context it was adopted by the advertising industry as a means to describe the process of writing text with the intent of “providing” the consumer a particular service or product.

    Hmm. I’m not a classical scholar, but that doesn’t have much of a ring of truth about it to me – “ad copies”, really?

    Or do you know better?

    What does writing copy mean?

    And then there’s copywriting

    That’s copywriting (one word) not copy writing (two words). Or even copyrighting – see your lawyer for that.

    Originally the domain of advertising copywriters (not copy writers, you’ll note), the term copywriting applies to writing material for marketing – advertising, direct mail, PR, brochures, and scripts for radio, TV and sales people. Now we add website pages and blogs, podcast scripts, the words on infographics and so on.

    Some people refer to the finished document as “the copywriting”, wrongly I feel.

    Is copy the same as content?

    These days, for many people, they are one and the same. For many years, I’ve argued that content is anything that appears on a website, including images, video, diagrams, infographics, PDFs – not just words. What I produce is copy because it consists of words.

    However, just like I had to give up writing about ‘Web sites’ (sites on the Web) and now say ‘websites’, I’ve been talking in terms of content because that’s what most people expect me to call it.

    But I digress. Content can be copy, but not necessarily.

    Does that help? How do you define copy?

    Thanks to fdecomite and Cali4beach for making their images available via Creative Commons.

    Have you read these?

    Posted 20 October 2014, 1:57 pm

  9. Favicon NixonMcInnes

    [Blog] NixonMcInnes: How the Playful conference links to our work on behaviour change through improvisation

    As a consultant who uses improvisation to help our clients work better together, i’m always excited when an opportunity to see how other people use storytelling, play and games in their work comes along.

    And none more so than Playful - a conference that brings together exactly that. I’m a little bit embarrassed to say that this is the first time I’ve made it to Playful – though I’ve heard from my colleagues for a number of years running that it’s a cracking and incredibly inspiring event.

    When working with people, I get most excited when I see those moments of growth that come from trying out something new, being out of their comfort zone – and then realising that it wasn’t as bad as they thought and that they have genuinely been changed by the experience.

    Often people come into my workshops quite guarded, somewhat apprehensive and unsure what will come of it. Very often people leave surprised, enlightened and with an appetite to approach problems with a more open mind. This kind of training applied over a set of months can really set teams free.

    I use improv not only to train (it’s a great tool for many more reasons) but also as a diagnostic – from a single workshop I can draw out a set of observations about how a team works together and any number of hidden traits that may not have been visible before – and this is why I love improv.

    Given improvisations ability to draw out the hidden behaviours in individuals and teams, i’m well chuffed that theme for Playful this year is ‘Hidden – what lies beneath’.

    I hope that the conference will reveal something inspiring for me and all that attend.

    If you want to meet up to talk about working with groups of people, improv, or just to say hi and have a coffee, drop me a message on

    See you there :)

    Contributor has not supplied alternative text for this image

    Posted 20 October 2014, 11:56 am

  10. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: Jaunty Twig offers introductionary trial to all Wired Sussex members

    Originally created as a high tech replacement for disposable cameras, a new ‘selfie’ app, Jaunty Twig, has been launched by Brighton entrepreneur and photographer, Lesley Taylor. The app embraces the mobile generation giving those attending events ...

    Posted 20 October 2014, 1:00 am

  11. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: How Wired Sussex can help you access the best junior talent - and even help towards the cost

    Earlier this year Wired Sussex launched their hugely successful Intern Placement Programme which connects companies with the best new talent in the sector . The scheme is targeted at SMEs working from Brighton to Chichester and Newhaven to Croydon ...

    Posted 20 October 2014, 1:00 am

  12. Favicon Wired Sussex Digital Media News

    [Blog] Wired Sussex Digital Media News: Mariam Crichton joins ribot as Chief Operating Officer

    Mariam Crichton joins the team at ribot Creative digital and design studio ribot have appointed Mariam Crichton as their new Chief Operating Officer. In this newly-created role within the company, Mariam will be responsible for the running of the ...

    Posted 20 October 2014, 1:00 am

  13. A few words from Rob Mansfield

    [Blog] A few words from Rob Mansfield: Why paper publishers are shooting themselves in the foot

    I’m going to tell you a story. It may be an isolated story, but it underlines exactly why old-school magazine publishers will slowly die, unless they basically buck their ideas up. My partner has a subscription to Vanity Fair and Vogue – both published by Conde Nast. This entitles her to the hard copy magazine […]
    Contributor has not supplied alternative text for this image

    Posted 18 October 2014, 9:44 am

  14. Favicon SiteVisibility

    [Blog] SiteVisibility: First look at Google Tag Manager v2

    Google Tag Manager (GTM) is a powerful tool for anyone who is involved in configuring analytics (or other tracking on a website). It allows you to rapidly update and improve code without needing to interrupt or schedule in IT time, plus it has version control and the ability to test tracking on development servers before deployment by dynamically changing the account.

    GTM allows you to drop a small block of code on the site which allows you to effectively add as many extra tags (JavaScript) as you want to without needing developers to directly update the page,. SiteVisibility use it to alter analytics code and deploy tracking conversions across many of our clients and we are, where possible, migrating many clients over when appropriate.

    Unfortunately, for v1 of Tag Manager, the learning curve for this tool has always put off many potential users. In many aspects the required knowledge wasn’t that well documented, with the best documentation coming from power users such as Simo Ahava’s blog.

    Google’s Tag Manager has just taken a leap forward with a new interface and improved terminology, API access and an increasing array of pre-built tags – including one of our favorites ClickTale.

    Rules and Macros have now been changed to phrases more inline with their actual functionality to being “Triggers” and “Variables”. In fact link listeners (which required creating multiple tags to be configured to track clicks on links), are now rolled into a single tag and trigger, resulting in simpler workflows when creating these tags.

    The new interface feels considerably more styled, which can be best described as lovely multi-coloured pastels (I am not sure if I personally like this).  V2 feels much less aimed at the developers than v1 was, which shared the interface with other developer focused tools (such as API management).-

    For legacy users, V2 is not available for your existing tags at present. So for many of our clients where we have moved them to GTM, they (and us) will still need to use the existing interface to manage their tagging.

    Google have stated that “soon” you will be able to migrate legacy containers over, and that the old interface will be gone in January (2015).

    What do you think of the new interface? Does this encourage you to give it a try? As ever if you need help with implementing or migrating to tag management then please drop SiteVisibility a line.

    Post from Apple Pie & Custard blog by SiteVisibility - An SEO Agency

    First look at Google Tag Manager v2

    Contributor has not supplied alternative text for this image Contributor has not supplied alternative text for this image Contributor has not supplied alternative text for this image
    Contributor has not supplied alternative text for this image

    Posted 17 October 2014, 4:48 pm

  15. Favicon remy sharp's b:log

    [Blog] remy sharp's b:log: Adding an (SHA256 signed) SSL certificate

    I've had to update the SSL certificate quite a few times on in the last 6 months, and I keep a cheatsheet of SSL steps on my machine. So it's about time I publish it somewhere that I can google too!

    This walkthrough explains how to add an SSL certificate to your server. This is based on using a linux based machine (in my case Ubuntu) and nginx as the server.

    I registered my SSL certificate via namecheap from RapidSSL which is actually a shell for GeoTrust.

    If you're reissuing a certificate to upgrade to SHA256 (from SHA-1) (because SHA-1 is being ditched) from RapidSSL you must reissue directly from them. See this comment for full details.

    Assuming my site is, I'm using example as the main filename.

    openssl genrsa -aes256 -out example-encrypted.key 2048
    openssl rsa -in example-encrypted.key -out example-decrypted.key
    openssl req -new -sha256 -key example-decrypted.key -out example.csr

    The last command will generate the CSR which will go off to your SSL issuer. I have this a cheatsheet for the prompts (if you're based in the UK, since Locality might not mean much):

    • Country name: GB, a country code, not name
    • State: East Sussex, county if you're in the UK
    • Locality: Brighton, your city
    • Organisation: My Company Ltd
    • Org unit: leave empty
    • Common name:, the full domain for the cert
    • Leave the rest blank (email, challenge password & company name)

    Note: if you have a wildcard certificate, then the common name is *

    Send example.csr contents to reissued SSL cert, and agree to all the emails.

    You should get an email from the SSL issue with the certificate. Save the contents of 'certificate' in example.crt.

    Now get the intermediate certificate (I'm using RapidSSL's SHA256 cert) and combine into a single bundled file - note that the order is important:

    cat example.crt intermediate.crt > bundle.crt

    RapidSSL specific note: I found that the GeoTrust certificate (part of the intermediate certificate that I downloaded above) was still SHA-1 signed. So I dropped it, only bundling my own certificate and the rapidSSL certificate (so less certificates) and now I get the green lock from Chrome Canary. Note: I'm not 100% if this is okay, but it does seem valid.

    Finally, make sure nginx (in my case) is using the bundle and the key used to generate the csr:

    ssl                  on;
    ssl_certificate      /WWW/;
    ssl_certificate_key  /WWW/;

    Then restart nginx:

    nginx -s reload

    References & tools:

    Contributor has not supplied alternative text for this image
    Contributor has not supplied alternative text for this image

    Posted 17 October 2014, 10:00 am


These photos are the most recent added to the BNM Flickr Photo pool.


Photo uploaded by , on

Recent Threads

This list of subject headings is generated from the last 50 posts made to the BNM mailing list which also had a response.

  1. File recovery after... 8 posts. artist chart

This is a chart of the most listened to artists in the BNM group. Chart for the week ending Sun, 19 Oct 2014.

  1. Aphex Twin
  2. David Bowie
  3. Bob Dylan
  4. Cat Power
  5. Ludovico Einaudi
  6. Fleetwood Mac
  7. Daft Punk
  8. Massive Attack
  9. Booker T. & the MG's
  10. The Kinks

Chart updated every Sunday.

These are links tagged by members of the BNM mailing list with the tag ‘bnm’. If you find something you think other readers may find useful, why not do the same?


Events are taken from the BNM Upcoming Group. There are currently no events to display.

You can download, or subscribe to this schedule.