Tags: ar

2371

sparkline

Hacked On Classics - The Old Market

Seb is going to be closing out the Brighton Digital Festival with a bang.

Seb unravels all the geeky details about how your favourite retro gadgets work, including Nintendo light guns, Casio keyboards and the cathode ray tube televisions that once dominated our living rooms.

It’s going to be like Seb: The Musical …with lasers.

Responses To The Screen Reader Strategy Survey | HeydonWorks

Heydon asked screen readers some questions about their everyday interactions with websites. The answers quite revealing: if you’re using headings and forms correctly, you’re already making life a lot easier for them.

How do I learn? - Snook.ca

I can very much relate to Jonathan’s learning process (except for the bit about reading Hacker News—spit):

  1. Reading
  2. Building
  3. Writing

I think I read about 20-30 times more than I write, but the writing part is still crucial for helping me get stuff straight in my own head.

The Internet Should Be a Public Good | Jacobin

A gripping history lesson of the internet and the ARPANET before it, emphasising the role of government funding.

Silicon Valley often likes to pretend that innovation is the result of entrepreneurs tinkering in garages. But most of the innovation on which Silicon Valley depends comes from government research, for the simple reason that the public sector can afford to take risks that the private sector can’t.

It’s precisely the insulation from market forces that enables government to finance the long-term scientific labor that ends up producing many of the most profitable inventions.

Today we have an internet effectively controlled by a small number of private companies.

Instead of trying to escape the bigness of the Internet, we should embrace it — and bring it under democratic control. This means replacing private providers with public alternatives where it’s feasible, and regulating them where it’s not.

There is nothing in the pipes or protocols of the Internet that obliges it to produce immense concentrations of corporate power. This is a political choice, and we can choose differently.

Proposal to CSSWG, Sept 2016 // Speaker Deck

Jen has some ideas for a new CSS Region spec to turbo-boost Grid. I’m still trying to wrap my head around it, but in the meantime, if you have feedback on this, please let her know.

The Typekit Blog | Variable fonts, a new kind of font for flexible design

This is what Nick Sherman has been banging on about for years, and now the time has come for variable fonts …as long as typographers, browser makers, and standards bodies get behind it.

More details on Ev’s blog.

Physical Web Beacons - Snook.ca

Jonathan takes a look at the physical web. Like me, he’s excited by the possibilities. Although he says:

Sadly, my mind quickly devolved into the annoyance of numerous notifications, like popup windows and other distracting adverts, vying for my attention.

This is a common worry with the physical web, but it’s unfounded. All a beacon does is broadcast a URL. You have to actively look for the URLs being broadcast—they can’t send notifications.

It all just feels like QR codes. They’ll be all over the place and most of them won’t be very useful.

I understand this concern, but whereas QR codes are completely opaque to humans, at least URLs can—and should—be human-readable …so, unlike QR codes, a URL can give you some idea of what awaits.

How Google And Others Are Plotting The Revenge Of The Web App | Fast Company | Business + Innovation

It’s always, um …”interesting” when a mainstream publication covers a topic from the web’s bikeshed. In this case, it’s progressive web apps, and—apart from the sensationalist headline—it’s actually not that bad at all.

Style Guides, Pattern Libraries, Design Systems and other amenities. // Speaker Deck

This slide deck is a whistle-stop tour of all things styleguide and pattern-library related. Nice to see Charlotte’s excellent exercise get a shout-out.

Shipping vs. Learning » Mike Industries

Some typically smart thinking from Mike—what if success were measured in learning rather than shipping?

Organizations that learn the quickest seem the most likely to succeed over the long haul.

This really resonates with me, and it aligns so closely with our values at Clearleft that I think this is something we should be pursuing. Fortunately Mike’s post comes with plenty of examples and ideas.

My Decade of Blogging

Heartfelt congratulations to Remy on ten years of blogging.

More importantly, every single URL on my blog that’s ever been published still works, and even better than that (for me) is my archive showing off the decade of writing I’ve been producing over all this time 💪

I Wanted To Type a Number | Filament Group, Inc., Boston, MA

Choosing the right input type for your form field.

Aria-Controls is Poop | HeydonWorks

I wrote a while back about how I switched from using a button to using a link for progressive disclosure patterns. That looks like it was a good move—if I use a button, I’d need to use aria-controls and, as Heydon outlines here, the screen reader support is pants.

The Improbable, Bold History of Space Concept Art – How We Get To Next

A brief history of space concept art—Norman Rockwell, Chesney Bonestell, Robert McCall, Pat Rawlings, David Meltzer …all the classics.

How we made the RioRun progressive web app | Info | The Guardian

The devs at The Guardian walk through the process of building a progressive web app for the Olympics. There were some gotchas with the life cycle of service workers, but the pay-off was worth it:

Once you get there though, it’s quite magical when you load the page on a phone, switch it to airplane mode, reload, and continue using the app as though nothing was wrong.

MarkApp: Building apps with HTML

Here’s an interesting collection from Lea: small JavaScript libraries that do their configuration declaratively via HTML, rather than in JavaScript.

Shadow DOM v1: self-contained web components | Web Fundamentals - Google Developers

An in-depth look at the current Shadow DOM spec. It’s well-written but I don’t think this will really click with me until I start playing around with it for myself.

It’s good to see that the examples have some thought given to fallback content.

There’s also a corresponding tutorial on custom elements

Official Google Webmaster Central Blog: Helping users easily access content on mobile

Two pieces of good news from Google:

  1. 85% of websites qualify as mobile-friendly, so there’s no longer a need to explicitly label them as such in search results.
  2. Google will down-rank sites that have annoying pop-overs demanding you download an app or sign up to an email newsletter when you’re trying to read the damn page.

Why The Longplay Face | Collection

I giggled at quite of few of these mashups.

Using Feature Queries in CSS ★ Mozilla Hacks – the Web developer blog

A thorough explanation of @supports from Jen, with plenty of smart strategies for using it in your CSS today.

If it weren’t for retargeting, we might not have ad blocking

The more I reflect on the current practices of the online advertising industry, the more I think that ad-blocking is a moral imperative.

What is React?

I’m in a similar position to Remy:

I don’t use React. I don’t really gravitate towards larger frameworks, only because my daily work doesn’t require it, and I’m personally more interested in the lower level techniques and parts of the web and JavaScript.

But, like Remy, I’m interested in knowing what are the ideas and techniques embedded within large frameworks that will end up making their way into the web stack:

What I want to know is: what should I be taking away from React into my own continued evolution as a web developer?

There are some good responses in the comments.

The History of the URL: Path, Fragment, Query, and Auth - Eager Blog

Another dive into the archives of the www-talk mailing list. This time there are some gems about the origins of the input element, triggered by the old isindex element.

Start Building Accessible Web Applications Today - Course by @marcysutton @eggheadio

A great series of short videos from Marcy on web accessibility.

Can’t code, won’t code - cracking the secret of gender imbalance in STEM

Adult training represents a way into coding for millions of women who never learnt when they were younger. Meetups such as those run by organisations such as Women Who Code and Codebar can introduce women to the collaborative, problem-solving world of programming.

Creating An Accessible Modal Dialog

In the same vein as Hugo’s script, Ire walks through the steps involved in making an accessible modal window. Seeing all the thinking and code required for this really highlights the need for a way of making the document in the background inert.

“Researching Design Systems,” an article by Dan Mall

Dan has been researching the history of design systems, annotating as he goes.

Progressive Enhancement for JavaScript App Developers | De Voorhoede

Build JS apps responsibly - cover your basics, render strategically and enhance into true apps.

sw-toolbox

If you’re going to dip your toes into the world of service workers, this handy library from the Chrome team is a good place to start.

The History of Email - Eager Blog

The ancestors of the Internet were kind enough to give us a communication standard which is free, transparent, and standardized. It would be a shame to see the tech communication landscape move further and further into the world of locked gardens and proprietary schemas.

The Forgotten Kaleidoscope Craze in Victorian England | Atlas Obscura

A wonderful investigation of a culture-shifting mobile device: the kaleidoscope. A classic Gibsonian example of the street finding its own uses for technology, this story comes complete with moral panics about the effects of augmenting reality with handheld devices.

(I’m assuming the title wasn’t written by the author—this piece deals almost exclusively with pre-Victorian England.)

Service worker meeting notes - JakeArchibald.com

Jake has written up the notes from the most recent gathering to discuss service workers. If you have any feedback on any of the proposed changes or additions to the spec, please add them. This proposal is the biggie:

We’re considering allowing the browser to run multiple concurrent instances of a service worker.

Official Google Webmaster Central Blog: AMP your content - A Preview of AMP’ed results in Search

Google’s search results now include AMP pages in the regular list of results (not just in a carousel). They’re marked with a little grey lightning bolt next to the word AMP.

The experience of opening of those results is certainly fast, but feels a little weird—like you haven’t really gone to the website yet, but instead that you’re still tethered to the search results page.

Clicking on a link within an AMP spawns a new window, which reinforces the idea of the web as something separate to AMP (much as they still like to claim that AMP is “a subset of HTML”—at this point, it really, really isn’t).

25 years ago the world changed forever | W3C Blog

On August 6th, 1991, Tim Berners-Lee sent a message to alt.hypertext newsgroup announcing his WorldWideWeb project.

Battery Status readout as a privacy risk

The security research that went into improving the spec for the Battery Status API. This is why it’s so important that the web holds itself to high standard.

Even most unlikely mechanisms bring unexpected consequences from privacy point of views. That’s why it is necessary to analyze new features, standards, designs, architectures - and products with a privacy angle. This careful process will yield results, decrease the number of issues, abuses and unwelcome surprizes.

Web Components and progressive enhancement - Adam Onishi

Adam and I share the same hopes and frustrations with web components. They can be written in a resilient, layered way that allows for progressive enhancement, but just about every example out there demonstrates a “my way or the highway” approach to using them.

We were chatting about this in the Design Systems slack channel, and it helped clarify some of my thoughts. I’ll try to poop out a blog post about this soon.

The Lumpy Web - Tales of a Developer Advocate

Paul argues that the biggest problems for interoperability on the web don’t come from support (or lack of support) for entire features, but from the frustrating inconsistencies when features land in different browsers at different times with different implementations:

  • Platform inconsistencies hurt us more than big feature differences, we should start to try and prioritize aligning the platform
  • We need better tools to help us understand what the inconsistencies are and guidance on how to manage them
  • Developers should raise more issues to keep browser vendors accountable when there are differences

Megnut – I’ve been thinking a lot

Sixteen years on, this still rings true.

I realized there are dot-com people and there are web people. Dot-com people work for start-ups injected with large Silicon Valley coin, they have options, they talk options, they dream options. They have IPOs. They’re richer after four months of “web” work than many web people who’ve been doing it since the beginning. They don’t have personal sites. They don’t want personal sites. They don’t get personal sites. They don’t get personal. Web people can tell you the first site they ever saw, they can tell you the moment they knew: This, This Is It, I Will Do This. And they pour themselves into the web, with stories, with designs, with pictures.

Web Design in 4 minutes

This is a wonderful way of progressively explaining the layered approach to building for the web that Charlotte was teaching in her Codebar workshop.

FontShop | The Fonts of Star Trek

Yves Peters examines the typography of Star Trek. Unlike Typeset In The Future, which looks at on-screen typography, this article dives into titles and promotional posters.

A Code Review, Or Yet Another Reason to Love the Web | Brad Frost

I love this back and forth between Brad and Jonathon. I think they’ve both got some good ideas:

  • I agree with Brad that you can start marking up these kind of patterns before you’ve got visual designs.
  • I agree with Jonathon that it’s often better to have a generic wrapper element to avoid making assumptions about which elements will be used.

The Woman Who Put Men On The Moon [Comic]

Margaret Hamilton:

Never let fear get in the way! Don’t be afraid to continue even when things appear to be impossible, even when the so-called “experts” say it is impossible. Don’t be afraid to stand alone, to be different, to be wrong, to make and admit mistakes, for only those who dare to fail greatly can ever achieve greatly.

shawnbot/custom-elements: All about HTML Custom Elements

A good introduction to custom elements, one piece of the web components stack.

That said, when using custom elements—or anything involving JavaScript, for that matter—you should always design experiences for progressive enhancement, and plan for the possibility that JavaScript isn’t enabled or available.

Hmmm …that’s kind of hard when JavaScript is required to make custom elements work at all.

Join Fractal on Slack!

If you’re planning on giving Fractal a test drive, jump into this Slack channel. Mark and others will be able to help you out with any questions that aren’t covered in the docs.

A workshop for codebar students: Build a portfolio or blog site | Charlotte Jackson, Front-end developer

Charlotte did a fantastic job putting this workshop together on the weekend. It was inspiring!

Fractal v1.0 | Clearleft

Mark sets the scene for Fractal, the fantastic tool he’s built for generating pattern libraries.

This 1.0 release is just a start; it hopefully provides a solid foundation on which we (and anyone else who wants to contribute) can build and expand on in the future.

Exciting!

Fractal Documentation

This is the tool that we use at Clearleft to generate pattern libraries. It’s pretty damn cool. Mark built it. It’s pretty damn cool.

Exploring the Physical Web (Without Buying Beacons) — Medium

Well, this is interesting! It turns out you can turn your laptop into a beacon for broadcasting a URL to devices that support The Physical Web.

Design Systems

A newsletter dedicated to all things related to design systems, style guides, and pattern libraries.

Qualities of Successful Pattern Libraries: Pick Any Two - Cloud Four

I think Tyler’s onto something here:

I noticed three qualities that recurred in different combinations. Without at least two, the projects seemed doomed to failure.

  1. User-Friendly
  2. Collaborative
  3. Integrated

I certainly think there’s a difference in how you approach a pattern library intended as a deliverable (something we do a lot of at Clearleft) compared to building a pattern library for an ongoing ever-evolving product.

Teaching web development to design students (Phil Gyford’s website)

Phil’s write-up of teaching web development to beginners is immensely valuable in the run-up to the Codebar workshop that Charlotte is running this weekend. This bit gave both us a real “a-ha!” moment:

It only occurred to me at the end that I should have encouraged the students to try and fix each other’s bugs. If anyone had problems I’d go round and help people and often it’d be a little typo somewhere. Helping each other would acknowledge that this is entirely normal and that a second pair of eyes is often all that’s needed.

Adapting to Input · An A List Apart Article

Jason breaks down the myths of inputs being tied to device form factors. Instead, given the inherent uncertainty around input, the only sensible approach is progressive enhancement.

Now is the time to experiment with new forms of web input. The key is to build a baseline input experience that works everywhere and then progressively enhance to take advantage of new capabilities of devices if they are available.

Dennis Cooper fears censorship as Google erases blog without warning | Books | The Guardian

Two weeks ago, writer and artist Dennis Cooper was checking his Gmail when something peculiar happened: the page was refreshed and he was notified that his account had been deactivated – along with the blog that he’d maintained for 14 years.

This is why the Indie Web exists.

His advice to other artists who work predominantly online is to maintain your own domain and back everything up.

The History of the URL: Domain, Protocol, and Port - Eager Blog

From the ARPANET to the internet, this is a great history of the Domain Name System:

Root DNS servers operate in safes, inside locked cages. A clock sits on the safe to ensure the camera feed hasn’t been looped. Particularly given how slow DNSSEC implementation has been, an attack on one of those servers could allow an attacker to redirect all of the Internet traffic for a portion of Internet users. This, of course, makes for the most fantastic heist movie to have never been made.

Snyk’s Style Guide

…and Anna describes the process of creating the Snyk style guide.

Creating a Bocoup style guide - Bocoup

Susan describes the process behind creating Bocoup’s style guide…

Making And Maintaining Atomic Design Systems With Pattern Lab 2 – Smashing Magazine

A walkthrough of what’s new in Pattern Lab 2. It’s really interesting to see the convergent evolution of ideas here with what’s brewing in Fractal at Clearleft.

How to Make Sense of Any Mess

Did you know that Abby Covert’s book is available online in its gloriously hyperlinked entirety?

EmberCamp London Keynote 2016 // Speaker Deck

I really, really like what Ember is aiming for here:

First, we deliver the raw content, ensuring those on slow connections or without JavaScript get they’re after as soon as possible. Next, we load the minimum set of JavaScript needed to interactivity for that page, keeping transfer time and parsing time low. Once the user has an interactive page, we can start preemptively loading other parts of the application, including frequently-accessed data.

That’s how you get the holy grail of resilience and performance:

Subsequent visits and interactions are therefore nearly instantaneous, because they don’t rely on the network.

I sincerely hope other frameworks are paying attention to this layered approach.

Oh, and I also like this observation:

There’s an age-old argument about the difference between “web pages” and “web apps”. In reality, there’s a continuum between the two.

Moonscape – The Apollo 11 Moonwalk in HD

Moonscape is a free and freely shareable high-definition documentary about the first manned Moon landing. Funded and produced by space enthusiasts from all over the world, it shows the full Apollo 11 landing and moonwalk, using only the original audio, TV and film footage and the original photographs, rescanned and restored from the best available sources, with full English subtitles (other languages will follow).

CSS Containment Module Level 3

A way of declaring the scope of an element’s layout and paint styles, which browsers can then use as a hint to optimise performance. It’s already shipping in Chrome and Opera.

How Will Web Components Change CSS Architecture? - Snook.ca

Depending on how you’re currently structuring your CSS and class attributes, web components might not make all that much of a difference to your workflow.

The :target Trick

An alternative to using the :checked pseudo-class for sprinkling in some behaviour—you can use the :target pseudo-class. It might mess up the browser history though.

An Event Apart News: Ten Years, Ten Speakers: Part II

Ten of us reminisce about where we were and what we were doing a decade ago.

Ten years ago I was writing on my blog. Lots of other people were writing on their blogs back then too. That would soon change, though. Twitter and Facebook were picking up steam and soon they’d be luring bloggers away with enticing and seductive short-form convenience. I’ve stubbornly continued writing on my own site. I fully intend to keep on writing there for the next ten years too.

ForEveryone.Net - Trailer on Vimeo

I can’t wait for this documentary to come out (I linked to its website a while back).

Persistent Domains by Tim Berners-Lee

This sixteen year old cool URI has not changed. I think this idea of domains entering an archive state is worth pursuing.

Also, I love the science fictional footnote “Note for readers after 2100”.

Global Defense

Dave is making a nifty in-browser game that you can play by yourself or in co-operative mode. If your device has a gyroscope, you can use that to aim. Very cool!

(And it looks like it’s all set to become a progressive web app once it’s running on HTTPS.)

The Internet | Thought Economics

The World Wide Web, with all of its pages, blogs and so on- has allowed human expression in ways that would have been uneconomic and out of reach before. The most dramatic effect has been this ability for almost anyone to express himself or herself whenever they want to- and potentially be heard by many others.

Vint Cerf there, taking part in this wide-ranging discussion with, among others, Kevin Kelly and Bob Metcalfe.

The introduction leans a bit too heavily on Nicholas Carr for my liking, but it ends up in a good place.

The internet connects us cognitively and becomes a membrane through which our minds can interact, manifesting a whole new iteration of our species, who have begun to exist in a connected symbiotic relationship with technology.

The internet is the first technology we have created, that makes us more human.

.generation on Vimeo

A cautionary tale of digital preservation.

.generation is a short film that intimately documents three millennials in the year 2054 - uncovering their relationships with technology in the aftermath of the information age.

Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications

Mark recommended this JavaScript library as lightweight alternative to Vue.js …itself a kind of lightweight alternative to React. Basically I’m interested in the data-binding stuff.

Astrum - A lightweight pattern library for any project

One more tool for making pattern libraries. This one looks fairly simple and straightforward.

MarkSheet: a free HTML and CSS tutorial - Free tutorial to learn HTML and CSS

This looks like a great resource for beginners looking to learn HTML and CSS.

The Foundation of Technical Leadership · An A List Apart Article

Story of my life:

I have to confess I had no idea what a technical leader really does. I figured it out, eventually.

Seriously, this resonates a lot with what I find myself doing at Clearleft these days.

Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns” (Pre-Release) – Smashing Magazine

I think it’s a safe bet that this new book by Heydon will be absolutely brilliant.

It’s a handbook with valuable, time-saving techniques that will help you avoid hacky workarounds and solve common issues effectively.

The Languages Which Almost Were CSS - Eager Blog

A wonderful deep dive into the history of styling languages before CSS. I love spelunking down these internet history potholes—fascinating stuff!

Screw Mastery

The joy of starting from scratch:

I remembered a really nice thing: how to be goofily, absurdly proud of myself for figuring something out, a kind of pride I usually reserve for my children. This is the best part of dropping back to zero. The list of things you have to master is endless. And when you get one right — even a little, tiny one — everyone notices and gives you an adult version of an extra candy in your lunchbox.

My talk writing process (so far) | Charlotte Jackson, Front-end developer

Charlotte outlines the process she used in creating her talk at Dot York. It was a real joy to see it come together.

Designing Modular UI Systems Via Style Guide-Driven Development – Smashing Magazine

Striking that balance between the reusability of modular components and maintaining a big-picture vision of the overall design:

We should always strive to use patterns in an application. For example, consistent use of colors and font sizes can quickly indicate to the user elements in the UI that can be interacted with. However, avoid using a pattern just because it has been implemented before; rather, use it because it really solves the problem at hand.

Standardizing the Social Web

The slides from Aaron’s talk at OS Bridge in Portland, looking at the formats and protocols powering the indie web.

Resilience Poster Talk from Jeremy Keith by jessman5Stuff on Etsy

This beautiful poster could be the ideal decoration for your home or office.

You can download the original size (DIN A3) and print it to hang it on the walls in your office or wherever you want.

My talk at Dot York: Learn and Teach | Charlotte Jackson, Front-end developer

Here’s the full text of Charlotte’s fantastic short talk at the Dot York event last week. I’m so, so proud of her.

Brief History of the Internet - Internet Timeline | Internet Society

From twenty years ago, a look back at the origins of the internet, written by its creators.

ARPAWOCKY

RFC 527

Building better accessibility primitives

On the need for a way to mark parts of a document as “inert” while the user is interacting with modal content.

Declarative Design Tools | Jon Gold

Jon introduces a new tool with a very interesting observation: up until now, all our graphic design tools have been imperative rather than declarative

With our current tools we’re telling the computer how to design the vision we have in our head (by tapping on our input devices for every element on the screen); in our future tools we will tell our computers what we want to see, and let them figure out how to move elements around to get there.

» Introducing Drizzle Cloud Four Blog

A new pattern library tool, this time from the smart people at Cloud Four. It’s called Drizzle and it started life as a fork of Fabricator.

Apprenticeship: A better path to mastering our craft | Louder Than Ten

I’ve been thinking a lot about learning, teaching, mentoring, coaching …this article by Ivana McConnell from last year is packed with gold nuggets of wisdom concerning apprenticeships.

As lifelong learners, we may be reluctant to call ourselves “masters.” But that’s missing the point, and it discounts the fact that teaching is learning. We’re not there to guarantee mastery—we’re there to give our apprentices fundamentals, to foster their respect, and make journeymen (or women) out of them. Mastery will come; we just offer the tools.

Making your JavaScript Pure · An A List Apart Article

I really like this piece by Jack. All the things he’s talking about—pure functions and referential transparency—are terms I was previously unfamiliar with …but the concepts smell familiar. It’s good to have terminology (and reasoning) to apply to the way I structure my JavaScript.

The Web’s Creator Looks to Reinvent It - The New York Times

“The web is already decentralized,” Mr. Berners-Lee said. “The problem is the dominance of one search engine, one big social network, one Twitter for microblogging. We don’t have a technology problem, we have a social problem.”

“Apprenticeships,” an article by Dan Mall

I really love what Dan is doing with his apprenticeship programme—I hope we can do something like this at Clearleft.

Miscellany № 74: zombies always make a hash of things – Shady Characters

A thoroughly lovely look at the octothorpe that skewers a myth or two along the way.

PURL: A Portable Content Store - Not Enough Neon

I need to wrap my head around the details of this approach, but it sounds like it might be something I could do here on my site (where I feel nervous about my current dependency on a database).

Network Effect

The latest piece from Jonathan Harris explores online life in all its mundanity, presenting it in an engaging way, all the while trying to make you feel bad for doing exactly what the site is encouraging you to do.

Progressively less progressive | Andrew Betts

I agree with everything Andrew says here. Progressive web apps are great, but as long as Google heap praise on mobile-only solutions (like the Washington Post doorslam) and also encourage separate AMP sites, they’re doing a great disservice to the web.

More features arrive regularly to make this “one web” even better and easier to maintain. Service worker, streams, app manifests, payment request, to name a few. But adding these features one at a time to large, mature applications like WaPo or FT or Nikkei is a slow and painstaking process. That’s why it’s taking us a long time for us to tick off all these new features, and why it seems like madness to try and build the entire app several times over.

However, by creating the concept of PWAs and marketing them as they do, Google is encouraging publishers to ‘start again’. And they’re doing exactly the same thing with AMP.

matthiasott/webmention: Webmention Plugin for Craft CMS

A plug-in for Craft CMS for receiving webmentions. I’ll have to tell Charlotte about this (she’s using Craft for her site).

Progressive Enhancement and Modern JavaScript ― Caolan

I think JavaScript frameworks have been blinkered to the needs of many developers (most websites are not SPAs or run by Node, nor should they be) for too long. We need to find a way to apply the lessons of modern frameworks to the rest of the web - it would be sad if everyone had to run JavaScript on their server and good-old resilient HTML was considered only as a fallback.

Introducing Multirange: A tiny polyfill for HTML5.1 two-handle sliders | Lea Verou

You’re supposed to be able to create two-handled sliders with input type="range" but the browser support isn’t there yet. In the meantime, Lea has created a nice lightweight polyfill.

adactio - Upcoming.org Archive

My old Upcoming.org profile is back online, along with everyone else’s:

This is a static historical archive more than 7 million events saved from Upcoming’s first ten years.

I’m enjoying this trip down memory lane, recalling fun times from the last decade.

Not The Post I Wanted To Be Writing… – Infrequently Noted

Phew! Alex seems to have calmed down. He’s responding to my concerns about exposing URLs in progressive web apps, but thankfully without the absolutist rhetoric or insults. Progress!

DRY: Do Repeat Yourself - QuirksBlog

Y’know, I think PPK might be on to something here. It’s certainly true that developers have such an eversion to solving a problem twice that some users end up paying the cost (like in the examples of progressive enhancement here).

I will be pondering upon this.

Beyond Progressive Web Apps • cssence.com

Matthias Beitl takes a stab at trying to tackle the tricky UI problem of exposing the URLs of Progressive Web Apps. This stuff is hard.

Vanilla List: The Vanilla Javascript Repository

Here’s a handy directory of scripts that set out to solve one problem without any dependencies. Useful for poking at, picking apart, and learning from.

marmelab/universal.css: The only CSS you will ever need

Ensure that your class names never go out of sync with your style declarations with this one simple trick:

Take any CSS rule you want to apply, replace : by -, and dots by -dot-, and you get the name of the corresponding universal css classname.

The only thing missing is immutability, so I would suggest also putting !important after each declaration in the CSS. Voila! No more specificity battles.

Revision 263: Im Gespräch mit PPK, Chris Heilmann und Jeremy Keith | Working Draft

The Working Draft podcast is usually in German, but this episode is in English. It was recorded in a casual way by a bunch of people soaking up the sun sitting outside the venue at Beyond Tellerrand. Initially that was PPK and Chris, but then I barged in half way through. Good fun …if you’re into nerdy discussions about browsers, standards, and the web. And the sound quality isn’t too bad, considering the circumstances under which this was recorded.

Meet the Father of Modern Space Art | Atlas Obscura

A profile of Chesley Bonestell. It’s amazing to think how much of his work was produced before we had even left this planet.

State of the gap

Remy looks at the closing gap between native and web. Things are looking pretty damn good for the web, with certain caveats:

The web is the long game. It will always make progress. Free access to both consumers and producers is a core principle. Security is also a core principle, and sometimes at the costs of ease to the developer (but if it were easy it wouldn’t be fun, right?).

That’s why there’ll always be some other technology that’s ahead of the web in terms of features, but those features give the web something to aim for:

Flash was the plugin that was ahead of the web for a long time, it was the only way to play video for heavens sake!

Whereas before we needed polyfills like PhoneGap (whose very reason for existing is to make itself obsolete), now with progressive web apps, we’re proving the philosophy behind PhoneGap:

If the web doesn’t do something today it’s not because it can’t, or won’t, but rather it is because we haven’t gotten around to implementing that capability yet.

» Autofill: What web devs should know, but don’t

Jason takes good look at the browser support for autocomplete values and then makes a valiant attempt to make up for the complete lack of documentation for Safari’s credit card scanning.

CSS When/Else Rules

A really interesting proposal for more logic constructs in CSS: when/else conditions. At first glance, this looks like it would complicate the language (and one of the most powerful features of CSS is its simplicity), but when you dig a bit deeper you realise that there’s nothing new enabled by this extra syntax—it actually simplifies what’s already possible.

Semantic CSS - Snook.ca

Snook has been on a roll lately, sharing lots of great insights into front-end development. This is a particularly astute post about that perennial issue of naming things.

Developing Dependency Awareness – Smashing Magazine

A typically superb article by Aaron. Here, he breaks down a resilient approach to building for the web by examining the multiple ways you could add a button to a page. There’s a larger lesson here too:

We don’t control where our web-based products go or how our users access them. All we can do is imagine as many less-than-perfect scenarios as possible and do our best to ensure our creations will continue to do what they’re supposed to do. One of the easiest ways to do that is to be aware of and limit our dependencies.

Everything is a Remix: The Force Awakens on Vimeo

The newest Kirby Ferguson video looks at remixing through the lens of the newest Star Wars film.

Shuffleboard At McMurdo (Idle Words)

Maciej’s first report from Antarctica is here. Put the kettle on and settle in for a grand read.

BBC Blogs - Internet Blog - BBC UX&D on creating a GEL foundation for everyone

Al runs through the process of updating GEL—the BBC’s Global Experience Language design system. I particularly like the thought that’s gone into naming type sizes.

Design systems and Postel’s law | Journal | The Personal Disquiet of Mark Boulton

Marvellous insights from Mark on how the robustness principle can and should be applied to styeguides and pattern libraries (‘sfunny—I was talking about Postel’s Law just this morning at An Event Apart in Boston).

Being liberal in accepting things into the system, and being liberal about how you go about that, ensures you don’t police the system. You collaborate on it.

So, what about the output? Remember: be ’conservative in what you do’. For a design system, this means your output of the system – guidelines, principles, design patterns, code, etc etc. – needs to be clear, unambiguous, and understandable.

FamilySearch Style Guide

A straightforward little pattern library. There’s also the story of making it a living style guide.

When Websites Won’t Take No for an Answer - The New York Times

Our Harry’s in the New York Times! Well, an article on dark patterns is in the New York Times, and Harry is Mr. Dark Patterns.

Shane Becker - Dark Matter and the #IndieWeb

Shane gave a talk recently where he outlined his reasons for publishing on the indie web:

Most people reading this will probably have an account at most or all of these sites: Facebook, Instagram, Twitter, YouTube, Vimeo, Tumblr, Wordpress. Many also had accounts at Friendster, Tribe, MySpace, Delicious, Magnolia, Gowalla, Geocities. But no one has an account at any of those (on the second list) anymore. And all of the content that we created on those sites is gone.

All of those super emo feeling you posted to MySpace, they’re all gone. Some of the great web designers of our generation got started on Geocities. That stuff is gone forever. And sure, it was sparkling animated GIFs and neon colors. But that’s important history. Yahoo bought it, left it alone for a while, and then decided one day to turn it off.

Archiving a Website for Ten Thousand Years - The Atlantic

Prompted by the way Craig is handling the shutdown of hi.co, Glenn Fleishman takes a look at other digital preservation efforts and talk to Laura Welcher at the Long Now Foundation.

A time capsule is bottled optimism. It makes material the belief that human beings will survive long enough to retrieve and decode artifacts of the distant past.

Archiving Our Online Communities — Medium

Now this is how you shut down a service:

  • Maintain read-only URLs for at least ten years.
  • Create physical copies etched in metal held by cultural institutions for ten thousand years.
  • Allow users to export their data (of course).

Web projects often lack hard edges. They begin with clarity but end without. We want to close Hi.co with clarity. To properly bookend the website.

And nary a trace of “We are excited to announce…” or “Thank you for joining us on our incredible journey…”

(Such a shame that the actual shut-down notice is only on Ev’s blog, but hopefully Craig will write something on his own site too.)

To the Class of 2050 - The New Yorker

Remember: life is ten per cent what happens to you, ten per cent how you respond to it, and eighty per cent how good your reflexes are when the Tall Ones come at your throat with their pincers.

The inside story of Facebook’s biggest setback | Rahul Bhatia | Technology | The Guardian

The history of Facebook’s attempt to steamroll over net neutrality in India …and how they failed in that attempt, thanks to a grassroots campaign.

Crucially, Facebook itself would decide which sites were included on the platform. The company had positioned Internet.org as a philanthropic endeavour — backed by Zuckerberg’s lofty pronouncements that “connectivity is a human right” — but retained total control of the platform.

The Sonos Pattern Library — zdfs

There’s a lot I disagree with here. I don’t think this pattern library process is very elegant or scalable, and it certainly wouldn’t work for me.

But I’m still linking to it. Why? Because I think it’s absolutely wonderful that people share their processes like this. It doesn’t matter one whit whether or not it would work for me.

Frontend development may have gotten a lot more complicated, but the simple premise of sharing what you’ve learned hasn’t.

I couldn’t agree more!

How Literature Became Word Perfect | New Republic

An engaging look at the history of word processing, word processed by Josephine Livingstone.

Decentralized Web Summit: Locking the Web Open

Oh, how I wish I could make it to this event!

June 8th-9th at Internet Archive, featuring Vint Cerf, Brewster Kahle, and more.

We are bringing together a diverse group of Web architects, activists, engineers, archivists, scholars, journalists, and other stakeholders to explore the technology required to build a Decentralized Web and its impact.

Rebuilding the Perch UI - creating a pattern library

Rachel and Drew have been beta-testing Mark’s Fractal project for organising a library of components for Perch’s interface. Sounds like it’s working out very, very well indeed!

The Joy of Sparks

This is so cool! The logs of the Indie Web Camp IRC channel visualised as a series of sparklines in the style of Joy Division/Jocelyn Bell Burnell.

Aesthetics of the invisible | Francesco Schwarz

Hidden little details that make a big difference for screen readers.

A website is only as beautiful as the underlying markup.

HTML5 accessibility

A glanceable one-stop-shop for how today’s browsers are dealing with today’s accessibility features. Then you can dive deeper into each one.

what3words | Addressing the world

In this English language alternative to latitude and longitude coordinates, the Clearleft office is located at:

cross.rooms.quick

On Building Component Libraries | Clearleft

Mark has dumped his brains!

Seriously, there is a lot of thought that has gone into this, and it’s just the beginning: Mark recounts the experience that Clearleft has had with delivering pattern libraries, laying the groundwork for releasing the library-generating tool that he has been building.

Watch this space.

Claude Shannon, the Father of the Information Age, Turns 1100100 - The New Yorker

A lovely profile of Claude Shannon (concluding with an unexpected Brighton connection).

An Event Apart News: The Contributions of Others: A Session with Jeremy Keith

Eric asked me some questions and I was only too happy to give some answers.

Explore New Horizons - StarBnB

Discover exotic places with local hosts in a galaxy far, far away.

OOUX: A Foundation for Interaction Design · An A List Apart Article

I really, really like this approach. I’ve used something similar in my responsive design workshops, where I get people to break things down into nouns and verbs (objects and actions). I think there’s a lot of crossover with good URL design here too—this is kind of like REST for UX designers.

Updating Our Prefixing Policy | WebKit

Ted has snuck a blog post out from behind Apple’s wall of silence, and it’s good news: WebKit is not going to use vendor prefixes for new features.

Min | A smarter, faster web browser

I lightweight little web browser. It’s quite nice.

What Comes Next Is the Future: Trailer 2 on Vimeo

I particularly like Ethan’s Stop Making Sense era David Byrne suit.

chartd - responsive, retina-compatible charts with just an img tag

This could be a handy replacement for some Google Charts images of graphs. It uses SVG and is responsive by default.

I bet it wouldn’t be too tricky to use this to make some sparklines.

A Complete Guide to CSS Grid Layout | Chris House

This guide to CSS grid layout is the perfect companion piece to Rachel’s Grid by Example.

Layout Demos by Jen Simmons

If you want to keep up to date with all the coolest stuff landing in CSS, I recommend bookmarking this ever-changing page.

Clarity 2016 Wrapup by Chris Coyier on CodePen

As well as compèring the event, Chris took the time to make notes at the Clarity conference, dedicated to all things patterny.

Interview with Håkon Wium Lie — net magazine — Medium

A trip down memory lane with Håkon.

It’s not like the web has been done. This is history in the making. The web is only 25 years old. It’s going to be around for a long time, so there are lots of things to develop.

The Internet Archive—Bricks and Mortar Version - Scientific American Blog Network

A profile of the Internet Archive, but this time focusing on its physical space.

The Archive is a third place unlike any other.

Classic Programmer Paintings

Painters and Hackers: nothing in common whatsoever, but this are classical painters depictions of software engineering.

Node: Up and Running

One of these days I’m going to step outside of my PHP comfort zone and actually build something in Node. One of these days. When I do, this book looks like a good place to start (and the online version is free).

Day-of-talk countdown (with images, tweets) · larahogan · Storify

If you’re at all interested in public speaking, this is a great insight by Lara into what it’s like on the day of a talk.

Scroll Magazine, Edition 1

I wrote the foreword to this inaugural edition of Scroll Magazine which was published for the Respond conference down under. You can get your digital edition here, featuring interviews with Karen, Ethan, and Sara.

Side Projects – AVC

I think the move away from side projects toward doing a startup day one is not all good. There was something great about the ability to experiment with an idea before committing to it and before sucking other people’s money into it.

Messages to the Future, by Heather Ryan · The Manual

History, as the future will know it, is happening today on the web. And so it is the web that we must capture, package, and preserve for future generations to see who we are today.

Digital archivists run up against mismatched expectations:

But did you know that a large majority of web users think that when sharing their thoughts, images, and videos online they are going to be preserved in perpetuity? No matter how many licenses the general population clicks “Agree” to, or however many governing policies are developed that state the contrary, the millions of people sharing their content on websites still believe that there is an implicit accountability that should be upheld by the site owners.

Progressive Web Apps have leapfrogged the native install model … but challenges remain

While many challenges remain, the good news is … it’s progressive. Developers can already see the benefits by sprinkling in these technologies to their existing websites and proceed to build on them as browsers and operating systems increase support.

Clarity Conf: Brad Frost

I wish I could’ve made it to the Clarity conference—I had a Salter Cane gig to play—but luckily for me, Brad took lots of notes.

simpl.info

This is a very handy resource—a collection of minimum viable implementations of HTML5 features and JavaScript APIs.

Should I use Grid or Flexbox?

Rachel compares two CSS layout modules; Grid and Flexbox. This distinction is crucial:

Flexbox is essentially for laying out items in a single dimension – in a row OR a column. Grid is for layout of items in two dimensions – rows AND columns.

№ ⸮ ‽ ℔ ⁊ ⸿  — or, a cavalcade of characters – Shady Characters

The numero sign, the reversed question mark, the interrobang, the l b bar symbol, the Tironian et, the capitulum, and the ironieteken.

Microsoft Cognitive Services: Introducing the Seeing AI app - YouTube

Seems like ages since I’ve seen Saqib. He’s been working on something very nifty indeed:

…Seeing AI, a research project that helps people who are visually impaired or blind to better understand who and what is around them. The app is built using intelligence APIs from Microsoft Cognitive Services…

Front-End Style-Guides: Definition, Requirements, Component Checklist

You know that front-end pattern libraries have hit the mainstream when the Nielsen Norman Group get in on the action.

As ever, I’m not sure their sweeping generalisations can be applied to every project, but their checklist approach makes for a good starting point.

Mapping Mountains · Mapzen

Everything you never wanted to know about conveying elevation information on maps, delivered in Peter’s always-entertaining style and illustrated with interactive examples.

RFC 7763 - The text/markdown Media Type

Markdown gets its own media type: text/markdown.

Angola’s Wikipedia Pirates Are Exposing the Problems With Digital Colonialism | Motherboard

The street finds its own uses for colonial internet practices:

Because the data is completely free, Angolans are hiding large files in Wikipedia articles on the Portuguese Wikipedia site (Angola is a former Portuguese colony)—sometimes concealing movies in JPEG or PDF files. They’re then using a Facebook group to direct people to those files, creating a robust, completely free file sharing network.

Blandly. A Full-Service Integrated Digital Blanding Agency

Well, we might as well bin the Clearleft website rebranding project. Somebody has beaten us to it.

Introduction to Ember FastBoot by Tom Dale on Vimeo

I’m so happy that Ember is moving to a server-side rendering model. Not only that, but as Tom points out here, it’s crucial that the server-side rendering is the default and the client-side functionality than becomes an enhancement.

Web Manifest Validator

If you have a manifest.json file for your site, here’s a handy validator.

Cosmic Surgery by Alma Haser — Kickstarter

Well, here’s an art project with a difference: it comes with a web site built by Josh, a story written by Piers Bizony, and a book made by Emily.

Introducing A11y Toggle

Here’s a bit of convergent evolution: Hugo’s script is similar to what I wrote about recently.

He also raises a point that Kevin mentioned:

I would like to investigate on the details and summary elements as they are basically a native implementation for content toggles.

For some reason details never got much browser love, even though it’s clearly paving a well-trodden cowpath.

ECSS

Enduring CSS (not int the sense of “put up with” but in the sense of “long-lasting”) is a new book by Ben Frain all about writing and maintaining modular reusable CSS.

You can read the whole thing for free online or buy an eBook.

Jon Aizlewood | Visual inventories for agile design

Jon outlines his technique for keeping “the 30,000 foot” view when patterns are coalescing during a project.

See also: Andy P.’s experience of working with Jon this way.

Material Conference 2016 by Joschi Kuphal & Brian Suda — Kickstarter

I’m am soooo there!

Iceland, July 22nd: a conference about the material of the web …right up my alley.

You can get a ticket by backing the project on Kickstarter. Be sure to check out all the options.

See you in Reykjavík!

ForEveryone.net

A film about Tim Berners-Lee and the World Wide Web. Details are scarce right now but watch this space.

An update (March 2016) on the current state & recommendations for JavaScript …

Making web apps? Care about SEO? Here’s Google’s advice:

Use feature detection & progressive enhancement techniques to make your content available to all users.

thoughtbot/design-sprint: Product Design Sprint Material

If you’re intrigued by the kind of design sprints I wrote about recently, here’s a handy collection of resources to get you going.

EnhanceConf - Stefan Tilkov - How to embrace the browser - YouTube

The videos from EnhanceConf are started to go up already. Stefan’s talk really struck me—all the talks were great but this one had the most unexpected insight for me. It really clarifies a lot of ideas that I’ve been trying to articulate, but which Stefan crystalises by taking the long-zoom view.

Will we ever walk again on the surface of the moon?

A brief history of lunar sci-fi.

No matter how much we want the science fiction dream to come true – and personally I would love it – the reality is that a lunar colony is very unlikely to ever be financially viable. It would be no surprise if we saw more expeditions to the moon, but all those wonderful visions of the high frontier recreated in space are more likely to apply to destinations with a better long-term future, like Mars, rather than the moon.

Manifesto of the Committee to Abolish Outer Space – The New Inquiry

Fear and loathing in Houston.

  1. Humanity will never colonize Mars, never build moon bases, never rearrange the asteroids, never build a sphere around the sun.
  2. There will never be faster-than-light travel. We will not roam across the galaxy. We will not escape our star.
  3. Life is probably an entirely unexceptional phenomenon; the universe probably teems with it. We will never make contact. We will never fuck green-skinned alien babes.
  4. The human race will live and die on this rock, and after we are gone something else will take our place. Maybe it already has, without our even noticing.
  5. All this is good. This is a good thing.

Building Inspector by NYPL Labs

A wonderful Zooniverse-like project from the New York Public Library:

Help unlock New York City’s past by identifying buildings and other details on beautiful old maps.

Journal of Design and Science

A new publication from MIT. It deliberately avoids the jargon that’s often part and parcel of peer-reviewed papers, and all of the articles are published under a Creative Commons attribution licence.

The first issue is dedicated to Marvin Minsky and features these superb articles, all of which are independently excellent but together form an even greater whole…

Design and Science by Joi Ito:

When the cybernetics movement began, the focus of science and engineering was on things like guiding a ballistic missile or controlling the temperature in an office. These problems were squarely in the man-made domain and were simple enough to apply the traditional divide-and-conquer method of scientific inquiry.

Science and engineering today, however, is focused on things like synthetic biology or artificial intelligence, where the problems are massively complex. These problems exceed our ability to stay within the domain of the artificial, and make it nearly impossible for us to divide them into existing disciplines.

Age of Entanglement by Neri Oxman:

This essay proposes a map for four domains of creative exploration—Science, Engineering, Design and Art—in an attempt to represent the antidisciplinary hypothesis: that knowledge can no longer be ascribed to, or produced within, disciplinary boundaries, but is entirely entangled.

Design as Participation by Kevin Slavin:

The designers of complex adaptive systems are not strictly designing systems themselves. They are hinting those systems towards anticipated outcomes, from an array of existing interrelated systems. These are designers that do not understand themselves to be in the center of the system. Rather, they understand themselves to be participants, shaping the systems that interact with other forces, ideas, events and other designers. This essay is an exploration of what it means to participate.

The Enlightenment is Dead, Long Live the Entanglement by Danny Hillis:

As our technological and institutional creations have become more complex, our relationship to them has changed. We now relate to them as we once related to nature. Instead of being masters of our creations, we have learned to bargain with them, cajoling and guiding them in the general direction of our goals. We have built our own jungle, and it has a life of its own.

A Complete History of the Millennium Falcon — Kitbashed

Everything you never knew you wanted to know about the Millennium Falcon, wrapped up in one unsurprisingly insanely detailed essay from Michael.

Performance is a feature. Why performance is an opportunity for online businesses.

The problem is that performance is a feature that is not on anyone’s product roadmap.

For whatever reason, the fact that it correlates directly to bounce rate, time on site, pages-per-visit etc. has not struck home with many product owners.

Most websites, certainly in the publishing industry where I have worked for a good part of my career, see those metrics as core KPIs. So you would think that anything that improved them would get prioritised. But no.

Walmart Web Style Guide

A pattern library of Walmart’s front-end code.

A 5 day sprint with Clear Left exploring library self-service machine software – Leon Paternoster

Myself and Batesy spent last week in Ipswich doing an intense design sprint with Suffolk Libraries. Leon has written up process from his perspective as the client—I’ll try to get a case study up on the Clearleft website soon.

This is really great write-up; it captures the sense of organised chaos:

I can’t recommend this kind of research sprint enough. We got a report, detailed technical validation of an idea, mock ups and a plan for how to proceed, while getting staff and stakeholders involved in the project — all in the space of 5 days.

Jon Aizlewood | Is marketing being reborn as CX?

Aaaaand, once again, the Acheulean hand ax makes an appearance, this time in Jon’s rant about marketing.

A decade or more ago, digital marketing was more of a blunt instrument. It was like the first stone axe - crude, but it got the job done.

That’s three links in one day that reference the same prehistoric technology. What coincidental synchronicity!

Terraforming on Vimeo

There’s that Acheulean hand ax again.

The first ever object to be designed by man 1.7 million years ago was a flint hand axe. Flint has the same molecular structure as a crystal and they both consist of silica. The project juxtaposes the flint hand axe with the latest crystal technology; Xero chaton the world’s smallest precision cut crystal measuring 0.6mm in diameter, smaller than a grain of sand.

Hand Ax Technology - A Legend In Sustainability

Even more intriguing than their vast distribution across three continents is their time depth. Acheulean hand axes have been found at sites spanning 1.5 million years of human existence, dating from roughly 1.6 million years ago to about 100,000 years ago. That makes the Acheulean ax the most sustainable technology that members of our genus (Homo) ever developed. Consider, in contrast, the amount of technological change that has occurred in just the last 150 years (since the first telephone call), one ten-thousandth the amount of time the Acheulean hand ax was made and used. Or consider the amount of technological change in just the last 10 years (since the first iPhone was introduced), one one-hundred-fifty-thousandth the amount of time that Acheulean hand axes were made and used. In the memorable words of my former professor Arthur J. Jelinek, hand axes represent “mind-numbing technological stability.”

Connected Copies, Part Two | Hapgood

A really good explanation of how a peer-to-peer model for the web would differ from the current location-centric approach.

What really interests me is the idea of having both models co-exist.

You just have to think about the ways in which our location-centrism is contributing to the problems we are hitting, from the rise of Facebook, to the lack of findability of OER, to the Wikipedia Edit Wars.

Outline Your Talk with Presenter Notes — Ladies in Tech

Continuing the topic of public speaking, Jenn has a really good technique for figuring out how to arrange the pieces of your talk without getting bogged down in designing slides.

How to prepare and write a tech conference talk | wunder

Lena’s in-depth run-down of how she puts together a conference talk. If you’re new to public speaking, this is well worth reading.

Eternal 5D data storage could record the history of humankind

360 terabytes of data stored for over 13 billion years:

Coined as the ‘Superman memory crystal’, as the glass memory has been compared to the “memory crystals” used in the Superman films, the data is recorded via self-assembled nanostructures created in fused quartz. The information encoding is realised in five dimensions: the size and orientation in addition to the three dimensional position of these nanostructures.

The Secret Lives of Tumblr Teens | New Republic

A fascinating insight into some of Tumblr’s most popular accounts:

Some posts get more than a million notes—imagine a joke whispered in biology class getting a laugh from a city the size of San Francisco.

It’ll be a real shame when Tumblr disappears.

That’s “when”, not “if”. Remember:

In 2013, Yahoo bought Tumblr.

Keeping a smart home guest-friendly — Sensors and sensibility

In web development, we have this concept of progressive enhancement, which means that you start by building websites with the very most basic blocks - HTML elements. Then you enhance those basic elements with CSS to make them look better, then you add JavaScript to make them whizzy - the benefit being that if the JS or the CSS fail to load, you’ve still go the basic usable blocks underneath. I’m following this same principle in the house.

Related: this great chat between Jen Simmons and Stephanie Rieger.

The Leica Q — Craig Mod

Set aside some time: Craig is reviewing a camera again (and you remember how epic that was last time).

Watch the Watchers

Monika’s end-of-year piece is rather excellent:

The map exposes the network of fibre optic internet cables that lie deep below the sea giving an unfettered glimpse of the government’s counterterrorism tactics and the murky justifications behind them.

16 CSS Lessons via Post-it® Notes

’Sfunny—I was just talking about how important it is to keep document ways of teaching the basics of CSS, then I come across this delightful series of explanations.

(I hope Kaylan posts this to her own site as well as Ev’s blog.)

Teaching the order of margins in CSS | Charlotte Jackson, Front-end developer

Y’know, all too often we’re caught up in the latest techniques and technologies. It’s easy to forget that there are people out there trying to learn this whole web thing from scratch. That’s why I think blog posts like this are so, so important!

Based on her experience teaching CSS at Codebar, Charlotte describes how she explains margins. Sounds simple, right? But is that because we’ve internalised this kind of thing? When was the last time we really thought about the basic building blocks of making websites?

Anyway, this is by far the best explanation of margin shorthand properties that I’ve seen.

More of this kind of thing, please!

#nodigitaldarkage? — Blog of the Long Now

A note of optimism for digital preservation:

Where a lack of action may have been more of the case in the 01990s, it is certainly less so today. In the early days, there were just a handful of pioneers talking about and working on digital preservation, but today there are hundreds of tremendously intelligent and skilled people focused on preserving access to the yottabytes of digital cultural heritage and science data we have and will create.

Banjos and Discrete Technologies | stevebenford

An examination of how sites like The Session are meshing with older ideas of traditional Irish music:

There is a very interesting tension at play here – one that speaks directly to the design of new technologies. On the one hand, Irish musicians appear to be enthusiastically adopting digital media to establish a common repertoire of tunes, while on the other the actual performance of these tunes in a live session is governed by a strong etiquette that emphasizes the importance of playing by ear.

There’s an accompanying paper called Supporting Traditional Music-Making: Designing for Situated Discretion (PDF).

The Pain With No Name · An A List Apart Article

This rousing call-to-arms by Abby the IA makes a great companion piece to her interview on The Big Web Show.

Battling BEM – 5 common problems and how to avoid them

We tend to use a variant of BEM in our CSS at Clearleft. Glad to see that when we’ve hit these issues, we’ve taken the same approach.

Surma.link – New ways to make your web app jank with Houdini – An introduction

This is a really good primer on all the pieces that make up the Houdini approach to CSS—giving authors access to low-level APIs for rendering.

As is often repeated here, it’s still early days and caution is advised, but it’s still a good idea to wrap your head around what’s coming down the standards pipe.

There’s even more specs in Houdini’s list of drafts, but the future of those is rather uncertain and they are not much more than a placeholder for an idea at this point. Examples include custom overflow behaviors, CSS syntax extension API, extension of native scroll behavior and similar ambitious things that allow you to screw up your web app even worse than ever before. Rejoice!

Together • Ludwig Wendzich

Bootstrap is a product of Twitter. If you want your team to work like Twitter’s team, then by all means use Bootstrap. Pick up their design language. Their tool chain. Their decisions. Don’t be surprised when it feels off every time you use it. It will.

The same goes for Material Design. Foundation. These are all products built by other teams to work for their process. Their structure.

Finding the right tool is not what I am advocating for. Making it is.

The Many Faces Of… Punch Dancing

Last time I was in Austin I met up with Trent who got very animated when as he described a childhood strapping shinguards to his arms and recreating the montage fighting/dancing scenes from the finest of 80s movies.

That explains where this website is coming from.

Developer Resources : Microsoft Edge Dev

Microsoft are officially on board with implementing Service Workers in Edge:

Roadmap Priority: High — We intend to begin development soon.

Short note on improving usability of scrollable regions

Three very easy to implement additions to scrollable areas of your web pages: tabindex="0", role="region", and an aria-label attribute.

Link rel=serviceworker - Chrome Platform Status

Ooh, I really like this idea! Pointing to your Service Worker the same way you point to your style sheet makes a lot of sense to me.

A simple HTML5 Progress bar | Charlotte Jackson, Front-end developer

I love this little markup pattern: simple, accessible and elegant …with some quirky CSS gotchas around styling non-standard prefixed pseudo-elements. They came from the Shadow DOM …dun dun DUN!

Links, Buttons, Submits, and Divs, Oh Hell | Adrian Roselli

Use the right element for the job.

  • Does the Control Take Me to Another Page? Use an Anchor.
  • Does the Control Change Something on the Current Page? Use a Button.
  • Does the Control Submit Form Fields? Use a Submit.

The accessibility stack: making a better layer cake » Simply Accessible

A great description of a solid architectural approach to building on the web (and not just for accessibility either).

Taking part in the IndieWeb

The slides from Calum’s presentation at Front-end London.

The elements of HTML

A complete list of HTML elements, past and present. They’re all hyperlinked to the relevant specs.

Glittering Blue

Earth as seen on one day in 2015 from Himawari-8. Beautiful.

Developer Fallacies | HeydonWorks

Some of the explanations get a little ranty, but Heydon’s collection of observed fallacies rings true:

  • The gospel fallacy
  • The Luddite fallacy
  • The scale fallacy
  • The chocolate fireguard fallacy
  • The pull request fallacy
  • The ‘made at Facebook’ fallacy
  • The Bob the Builder fallacy
  • The real world fallacy
  • The Daphne and Celeste fallacy

I’ve definitely had the Luddite fallacy and the scale fallacy thrown in my face as QEDs.

The ‘made at Facebook’ fallacy is pretty much identical to what I’ve been calling the fallacy of assumed competency: copying something that large corporation X is doing just because large corporation X is doing it.

An invitation to bring back your personal site

I invite you not just to follow along here as I expand into topics beyond design and technology, but to start your own personal blog up again if you’ve been neglecting it for a while. I’m really interested in the things you are passionate about. I want to learn from you.

The Facebook-Loving Farmers of Myanmar - The Atlantic

A fascinating slice of ethnographic research in Myanmar by Craig. There’s no mention of the web, which is certainly alarming, but then again, that’s not the focus of the research.

Interestingly, while Facebook is all omnipresent and dominant, nobody is using it the way that Facebook wants: all the accounts are basically “fake”.

What I found fascinating are the ways that people have found to bypass app stores. They’re basically being treated as damage and routed ‘round. So while native apps are universal, app stores would appear to be a first world problem.

Now if there were only some kind of universally accessible distribution channel that didn’t require any kind of installation step …hmmm.

JavaScript web apps considered valuable · molily

A response to a rant I linked to recently.

The solution for bad JavaScript web apps is not to abandon them altogether, but to make better ones.

I couldn’t agree more. The tools have evolved and we now have frameworks and practices that allow us to render from the server and use the same code to render on the client, progressively enhancing from a solid robust base.

JavaScript is the best technology to build excellent interactivity in the browser. Still, the most important skill of a client-side JavaScript developer is to know when not to solve a problem with client-side JavaScript. It’s always more robust to solve a problem further down in the stack.

The problem is that I don’t see a willingness from developers to embrace this way of thinking. Instead I see it dismissed as being unrealistic or more expensive.

Still, it always takes time for behaviour to change so maybe things will only get better. I certainly hope so.

2015 Year in Review | codebar

Codebar had a very good 2015.

Of the 137 workshops run, “100 of those workshops were organised by our two busiest chapters, London and Brighton”—50 each.

Why I love working with the web

I love this. I really love this. Remy absolutely nails what makes the web so great.

There’s the ubiquity:

If the viewer is using the latest technology beefy desktop computer that’s great. Equally they could view the website from a work computer, something old and locked in using a browser called IE8.

Then there’s the low barrier to entry—yes, even today:

It’s the web’s simplicity. Born out of a need to connect documents. As much as that might have changed with the latest generation of developers who might tell you that it’s hard and complex (and they’re right), at the same time it is not complicated. It’s still beautifully simple.

Anyone can do it. Anyone can publish content to the web, be it as plain text, or simple HTML formed only of <p> tags or something more elaborate and refined. The web is unabashed of it’s content. Everything and anything goes.

I might just print this out and nail it to the wall.

If you sit back for a moment, and think about just how many lives you can touch simply by publishing something, anything, to the web, it’s utterly mind blowing.

A Flag for No Nations | booktwo.org

This a magnificent piece of writing from James …all about pieces of metal fabric.

A single technology – the vacuum-deposition of metal vapour onto a thin film substrate – makes its consecutive and multiple appearances at times of stress and trial: at the dawn of the space age, in orbit and on other planets, at the scene of athletic feats of endurance, in defence and offence in the mountains of the Hindu Kush, on the beaches of the European archipelago. These are moments of hope as well as failure; moments when, properly utilised, technological progress enables us to achieve something which was beyond our capabilities before. And yet: we are still pulling bodies from the water wrapped in material which was meant to send us into space.

Why I hate your Single Page App by Stefan Tilkov

A linkbaity title for a ranty post. But it’s justified.

My point is that from an architectural perspective, most single page apps are the result of making the wrong choices and missing important opportunities.

The Heroine’s Journey. - WordRidden

I think I’ve shown great restraint in not linking to loads of think-pieces about Star Wars and The Force Awakens, because believe me, I’ve been reading—and listening to—a lot.

What Jessica has written here is about The Force Awakens. But more than that, it’s about Star Wars. But more than that, it’s about childhood. But more than that…

What I’m saying is: if you only read one thing about the new Star Wars film, read this.

Feature.js

A lightweight alternative to Modernizr. It doesn’t add classes to your markup so it’s up to what you do with the results of any test.

It’s perfect for cutting the mustard on a case-by-case basis.

The web is okay

It’s okay to feel stress in response to this rapid development. It’s natural. I hate change, I hate it so so much. I like things to be consistent and for it to have it’s own place. If it doesn’t, I get stressed and my obsessive compulsive tendencies run riot in a desperate attempt to preserve order. This both benefits and hinders my work.

Chimes very nicely with the latest episode of Ctrl+Click Cast.

VerbalExpressions/JSVerbalExpressions

Regular expressions are my kryptonite so I can definitely imagine using the PHP port of this plain English syntax.

Day 12: I know Kung Fu – 12 Devs of Xmas

Adam Onishi on teaching and learning:

As web developers, with the constant change in our industry, learning becomes a necessary part of our jobs. However with the right environment I think we can make that learning experience easier and actually a fun part of what we do.

WTF Opera Mini?!

The proxy browser Opera Mini is one of the most popular mobile browsers in the world, and rightly so. Ire Aderinokun has put together a handy collection—based on caniuse.com data—of all the features that are unavailable or only partially available in that browser. The point here is not to avoid using these features, but to make sure you’ve got a solid fallback in place:

This isn’t about bashing the problem, but figuring out the solution.

20 Years Ago Today

A lovely reminiscence from Matt on how he came to fall in love with the World Wide Web.

I really hope he posts this on his own site—it’ll be a shame when this disappears along with everything else being posted to Medium.

Reimagining Single-Page Applications With Progressive Enhancement – Smashing Magazine

Some really great thinking here by Heydon on how to make single page apps but using HTML for the views instead of relying on client-side JavaScript for the rendering. He explains the code he’s using, but what really matters here isn’t the specific solution; it’s the approach. Smart!

Affirming User Choice With Checkboxes, From the Notebook of Aaron Gustafson

Well, this is timely! Just today I was having a really good natter with Charlotte about using checkboxes, specifically sending multiple values to the server:

You’ll notice that the name given to each of these checkbox input elements is the same: “reservation-requested-device[]”. The square brackets (“[]”) at the end of the name are the magic bit that allows the values of each chosen “reservation-requested-device” checkbox to be submitted as the value of “reservation-requested-device”.

See, I wasn’t sure whether that was just a PHP thing (the only server-side input-handling I’ve had much experience of) or whether it was a more general way of sending multiple values.

Update: It seems that the square brackets are indeed a PHP thing. Multiple values will be sent in any case. See this test case.

And that was it really, I knew what I wanted to do, I wanted to build websites

Jake describes the pivotal moment of his web awakening:

I explored the world wide web. I was amazed by the freedom of information, how anyone could publish, anyone could read. Then I found a little button labeled “View source”. That was the moment I fell in love with the web.

It all goes back to having a ZX Spectrum apparently. Pah! Luxury! I had a ZX81—one K of RAM …1K! Tell that to the young people today, and they wouldn’t believe you.

Anyway, this is a lovely little reminiscence by Jake, although I have no idea why he hasn’t published it on his own site.

Content and Display Patterns | Brad Frost

Brad follows up with his thoughts on Dan’s article, emphasising the importance of a developer’s role in not just slavishly recreating what’s in a static comp, but seeing through to the underlying pattern beneath:

It’s so incredibly crucial to treat development as a key part of the design process.

“Content & Display Patterns,” an article by Dan Mall

A really terrific article from Dan on building pattern libraries. In summary:

  1. Naming things is hard,
  2. Separation of content and presentation is A Good Thing.

There are some really good insights here into getting just the right level of abstraction for a component—not too tightly tied to a specific visual display, but also not too tightly tied to a specific kind of content type:

When thinking about patterns, content strategists are primarily thinking about Content patterns, designers are primarily thinking about Display patterns, and front-end developers are responsible for bringing the two together.

(And it’s great to see Charlotte’s excellent article get a shout-out in the “Related reading” section at the end,)

Mike Hill - Industrial Design in Entertainment on Vimeo

A terrific analysis of industrial design in film and games …featuring a scene-setting opening that delineates the difference between pleasure and happiness.

Simple inline error message pattern

This is my go-to method for adding validation messages to forms—I think I first heard about it from Derek—so it’s nice to see it corroborated by Steve:

Add the error message as a child of the label element associated with an input.

jordanmoore/Modern-Default-HTML

This is so weird—Jordan Moore’s boilerplate responsive HTML template is exactly the same as mine! What are the odds‽

(I was once asked to contribute a boilerplate starter for

The App-ocalypse: Can Web standards make mobile apps obsolete? | Ars Technica

I really, really want to like this article—it’s chock full of confirmation bias for me. But it’s so badly-written …I mean like, just the worst.

Here’s an actual sentence:

So with a capable, HTML-based platform and a well-designed program that makes good use of CSS, one site could support phones, tablets, PCs, and just about anything else with one site.

So, yeah, I’m still linking to it, but instead of it being for the content, it’s because I want to lament the dreadful state of technology writing.

Touch Keyboard Type ‘Cheat Sheet’ - Labs - Baymard Institute

A useful primer on which combinations of attributes and values work best for which form fields: type, autocomplete, autocorrect, and autocapitalize.

getify/You-Dont-Know-JS

Graham—whose opinion I trust completely—has been raving about these books. And Kyle Simpson is a super-smart guy. So I reckon I should make these JavaScript tomes my holiday reading.

Temporary Constellations — Buckley Williams

This is a really lovely project by Dan and Nat—Christmas cards featuring the fleeting invisible constellations formed by the mesh of GPS satellites within which our planet lies.

Building the UX London website by Charlotte Jackson

Charlotte talks through some of the techniques she used when she was building the site for this year’s UX London, with a particular emphasis on improving perceived performance.

Write What You Know (Now) · An A List Apart Column

Well, this is rather lovely!

I nodded along with host Jen Simmons and guest Jeremy Keith saying some very smart things about the web and its roots as the El train cut across Philadelphia. But at the 48-minute mark things got weird, because Jen and Jeremy basically started writing my column for me while I listened.

Read on for some great advice on conquering your inner critic.

My latest Twitter bot: @5point9billion (14 Dec., 2015, at Interconnected)

I always loved Matt’s light cone project—it was a big influence on the Radio Free Earth hack that I made with Chloe. Now it has been reborn as a Twitter bot. Here’s Matt’s documentation for his future self:

I haven’t made a habit of project write-ups before, but I’m taking an increasingly “long now” approach to the tech I make and use. How will I remember what I made in a decade? By reading this post.

The web accessibility basics – Marco’s Accessibility Blog

Marco gives a run-down of the basics of getting accessibility right on the web. Nothing here is particularly onerous but you’d surprised how often developers get this wrong (or simply aren’t aware of it).

He finishes with a plea to avoid unnecessary complexity:

If there’s one wish I have for Christmas from the web developer community at large, it is this: Be good citizens of the web, and learn proper HTML before you even so much as touch any JavaScript framework. Those frameworks are great and offer a lot of features, no doubt. But before you use hundreds of kilobytes of JavaScript to make something clickable, you may want to try if a simple button element doesn’t do the trick just as fine!

Simplified JavaScript Jargon

An A-Z of JavaScript jargon (although some of the “explanations” could do with de-jargonifying themselves).

HIKE - Introduction to accessibility concepts for the Web

It really isn’t hard to get the basics of accessibility right on the web …and yet those basics are often neglected.

Here’s a handy shortlist to run through, HIKE:

  • H stands for headings and semantic markup.
  • I stands for images and labels.
  • K stands for keyboard navigation.
  • E asks for you to ACT with a little extra love for custom components and more.

(ACT = ARIA, Colour Contrast, Text Size)

Peaceful Reflection

Paul takes a look back at a time in his life one decade ago. This is a great piece of personal writing.

An Event’s Lifecycle: The Highs, The Lows, The Silence // beyond tellerrand

I can certainly relate to everything Marc describes here. You spend all your time devoted to putting on an event; it’s in the future, coming towards you; you’re excited and nervous …and then the event happens, it’s over before you know it, and the next day there’s nothing—this thing that was dominating your horizon is now behind you. Now what?

I think if you’ve ever put something out there into the world, this is going to resonate with you.

Web History Primer

Written in 2001, this history of the web takes in CERN, hypertext, the ARPANET, SGML, and lots more.

A Brief(ish) History of the Web Universe – Part I: The Pre-Web | briankardell

This is a wonderful, wonderful look back at the state of hypertext in the run-up to the creation of the World Wide Web.

My jaw may have dropped when I saw the GML markup.

Now I’m going to read part two.

HTML Developers: Please Consider | HTML5 Doctor

The best ARIA role is the one you don’t need to use.

Kate’s Christmas cards (est.1998) | Flickr - Photo Sharing!

Kate has been hand-making Christmas cards for seventeen years.

2013’s Gizmo Stardust remains my favourite.

IMG_4418

CSS Font Rendering Controls Module Level 1

This is already starting to land in browsers, which makes me very happy—the ability to specify how you want fonts to load/swap without needing a clever bit of JavaScript.

briangonzalez/fontprep

The missing font generator for Mac OS X.

Very handy for subsetting fonts for the web. It doesn’t (yet) export WOFF2 unfortunately.

The web will always be a moving target : Eclectic Dreams

Caution:

It would be convenient to think that because we live in a world where people’s browsers are regularly updating, that we live in a world where the web is in a reliable state.

Reminder:

The web is a continually moving target. It probably changed in the time it took me to write this. If you work with web stuff you need to embrace this fact. It will be the only constant in your career.

Do not panic:

On the web progressive enhancement is and will always be, the methodology of choice. It makes your site robust to the shifting sands of the web front end.

Cutting the Mustard Revisited — sixtwothree.org

Jason revisits some cutting-the-mustard techniques, as started by the BBC and refined by Jake. This kind of feature-testing is indispensable for progressive enhancement.

Personally though, I’m still uncomfortable with the assumptions baked into equating particular features with particular browsers …maybe I’ve known PPK too long.

I much prefer to cut the mustard on a case-by-case basis by feature testing the actual APIs I’m about to use in a script. I realise that might be harder to scale, and it’s more verbose, but it’s the only way to be absolutely sure.

Learn to Code HTML & CSS - Beginner & Advanced

This looks like a great resource for anyone setting out to learn how to make websites.

Gethtml - all the html elements

The A-Z of HTML, with an example for each and every element. Comprehensive and impressive.

philipwalton/flexbugs

A list of known bugs (and workarounds) in flexbox implementations. This is going to be handy to refer back to.

oldweb.today

Such a vividly nostalgic project. Choose an obsolete browser. Enter a URL. Select which slice of the past you want to see.

Digital archives in action. Access drives preservation.

Bliss.js — Heavenly JavaScript!

A small little JavaScript helper from Lea.

The helper library for people who don’t like helper libraries.

Universal React ◆ 24 ways

I have no hands-on experience with React, but this tutorial by Jack Franklin looks like a great place to start. Before the tutorial begins he succinctly and clearly outlines the perfect architecture for building on the web today:

  • The user visits www.yoursite.com and the server executes your JavaScript to generate the HTML it needs to render the page.
  • In the background, the client-side JavaScript is executed and takes over the duty of rendering the page.
  • The next time a user clicks, rather than being sent to the server, the client-side app is in control.
  • If the user doesn’t have JavaScript enabled, each click on a link goes to the server and they get the server-rendered content again.

YES!!!

Y’know, I had a chance to chat briefly with Jack at the Edge conference in London and I congratulated him on the launch of a Go Cardless site that used exactly this technique. He told me that the decision to flip the switch and make it act as a single page app came right at the end of the project. I think that points to a crucial mindset that’s reiterated here:

Now we’ll build the React application entirely on the server, before adding the client-side JavaScript right at the end.

Native or Not? The Untapped Power of Web Apps | Viget

Following on from that last link, here’s an in-depth run-down of what you can do in mobile browsers today. I think a lot of people internalised “what you can’t do on the web” a while back—it’s well worth periodically revisiting the feature landscape to revise that ever-shrinking list.

Perhaps the biggest advantage the web has over native apps is how quickly users are able to engage. All that’s between the user and your content is one click.

What Web Can Do Today

Visit this site using different browsers on different devices to get a feel for what you can do with web technologies.

Native will always be ahead, but the feature gap is closing impressively fast.

WTF is Solid?- Solid

The new style guide and pattern library for Buzzfeed.

It all looks pretty reasonable on the surface but if you poke around in the CSS, you’ll find 1157 uses of !important. Yikes!

The whole point of having an agreed-upon codebase in a pattern library is so that developers need never reach for nuclear options like !important, so I’m afraid, for me, this is a demonstration of what not to do (in terms of CSS—the output of the HTML in the styleguide looks perfectly fine).

Solid uses immutable, atomic CSS classes…

CSS is “mutable”. By design. I don’t think we should be working against that.

Apollo 17 in Real-time

This is rather nice—a Spacelog-like timeline of Apollo 17, timeshifted by exactly 43 years.

Gene and the crew are on their way to the moon …the last humans to ever make the journey.

openHTML

This seems like a decent endeavour:

A collaborative research project aimed at designing better tools and practices for learning web development.

The System of the World Wide Web

A fascinating ten-year old essay looking at the early days of the web and how it conquered FTP and Gopher.

And though glitz, politics, hard work, and competitors’ mistakes all played a role in the success of the web, there are also aspects of the architecture that ensured the web would catch on. I think the web won because of the URI.

URIs are everywhere, and what’s vaguely funny now is the idea that they’re something special. But they’re very special: URI management is the fundamental consideration behind the design of web sites, web applications, and web services. Tim Berners-Lee originally intended URIs to be invisible, but they’re too useful for that.

Flexbox’s Best-Kept Secret

I’m filing this one away for future reference: combining flexbox with margin:auto is a magical combination.

Using auto margins with Flexbox is an effective way to get all of the flexibility of css floats, without the nastiness of breaking elements out of the document’s normal flow.

Remember this, future self!

A Little Less Metacrap - Broken Links

Peter writes a follow-up to my post on metadata markup pointing out that Twitter will fall back to Open Graph values.

Flexbox Froggy - A game for learning CSS flexbox

This is superb!

Flexbox can be tricky to get your head around, but this exercise does a great job of walking you through each step in a fun way. I highly recommend trying all 24 levels.

The proto-internet | Intelligent Life magazine

Mapping the submarine cables of the Victorian internet.

And by the way, why did nobody tell me about Cartophilia before now? I’m very disappointed in you.

Our Generation Ships Will Sink / Boing Boing

Kim Stanley Robinson pours cold water on the premise of generation starships for crewed interstellar travel.

The more I hear about Aurora, the more I think I might enjoy reading it.

HTML5: The New Flash

A new presentation from the wonderfully curmudgeonly Steven Pemberton, the Nosferatu of the web. Ignore the clickbaity title.

I don’t agree with everything he says here, but I strongly agree with his preference for declarative solutions over (or as well as) procedural ones. In short: don’t make JavaScript for something that could be handled in markup.

This part really, really resonated with me:

The web is the way now that we distribute information. We will need the web pages we create now to be readable in 100 years time, just as we can still read 100-year-old books.

Requiring a webpage to depend on a particular 100-year-old implementation of Javascript is not exactly evidence of future-thinking.

Bruce Lawson’s personal site  : Progressive Web Apps: ready for primetime

Bruce gives a great run-down of what’s involved in creating one of those new-fangled progressive apps that everyone at Google and Opera (and soon, Mozilla) are talking about: a secure connection, a service worker, and a manifest file.

Crucially, in browsers that don’t support it, you have a normal website. It’s perfect progressive enhancement.

Funnily enough, this here website—adactio.com—is technically a progressive app now.

At their simplest, Progressive Web Apps are application-like things hosted on your web server. If you’re as old as me, you might call them “web sites”

Instant Loading Web Apps With An Application Shell Architecture | Web Updates - Google Developers

Outlining the architectural thinking required to create what the Google devrel folks are calling progressive apps.

Browsers without service worker support should always be served a fall-back experience. In our demo, we fall back to basic static server-side rendering…

Yay!

…but this is only one of many options.

Hmmm. In my opinion, sending usable HTML on first request isn’t an implementation detail—it’s crucial. But on the whole, this approach is very sensible indeed.

Aerotwist - The Cost of Frameworks

Here’s Paul’s write-up of his excellent talk at FF Conf.

Previously I’ve used the term “developer convenience” when describing the benefits of using a framework. Paul uses the term “ergonomics” to describe those benefits. I like that. I worry sometimes that the term “developer convenience” sounds dismissive, which isn’t at all my intention—making our lives as developers less painful is hugely important …but it’s just not as important as improving the lives of the end users (in my opinion …and Paul’s).

As I look at frameworks, I see the ergonomic benefits (and those are important, I agree!), but I can’t help but feel that, for many developers, investing in knowledge of the web platform itself is the best long-term bet. Frameworks come and go, it just seems to be the ebb and flow of the web, and, as I said above, they do contribute ideas and patterns. But if you ever find that the one you use no longer works for you, or has a bug that remains unfixed, being able to understand the platform that underpins it will help enormously.

You should use [insert library/framework], it’s the bestestest! / Paul Lewis - YouTube

This was one of favourite talks at this year’s FF Conf. But I will readily admit there’s a hefty dollop of confirmation bias in my enjoyment.

Three years with CSS Grid Layout

Rachel outlines the history of the CSS Grid Layout spec so far:

The process works, as slow as it may seem to us who wait anxiously to be able to take advantage of these techniques. I am happy that we are waiting for something that I really believe has the ability to completely change how we do layout on the web.

Moodboard — a small JavaScript library for presenting image moodboards on the web

A lovely little script from Nat to create a nice montage of images. It works by progressively enhancing a regular series of images in the markup.

jonathantneal/mdcss

A tool for generating a pattern library from Markdown comments in CSS. This isn’t the way that I tend to work, but I can see how it would be quite handy.

NC.gov Styleguide

The comprehensive style guide and pattern library for North Carolina.

A short note about web standards from your friends at Known

Ben and Erin are shipping experimental support for AMP in the latest version of Known, but Ben has some concerns about the balance of power tilting towards one major player, in this case Google:

Unfortunately, AMP redefines the HTML standard with some custom tags. That’s not great. It also requires that we load JavaScript from a specific source, which radically centralizes website content.

But it’s Google’s whitelist of approved ad providers that’s most concerning:

We’ve shipped support for AMP because we see potential here, and recognize that something should be done to improve the experience of loading independently-published content on the web. But attempting to bake certain businesses into a web standard is a malformed idea that is doomed to fail. If this is not corrected in future versions of the specification, we will withdraw support.

What Happens to Grantland’s Archives? - The Atlantic

Had anyone from the archive been in touch with ESPN? Was there any hope that the treasured collection of Grantland stories might remain accessible?

“We don’t ‘get in touch,’” Jason Scott, a digital historian at the Internet Archive, told me in an email. “We act.”

Radio SETI Observations of the Anomalous Star KIC 8462852 (PDF)

We have made a radio reconnaissance of the star KIC 8462852 whose unusual light curves might possibly be due to planet-scale technology of an extraterrestrial civilization.

Nothing to report yet.

Aural UI of HTML elements

This is such an incredibly useful resource by Steve and Léonie: documenting how multiple screen readers handle each and every element in HTML.

It’s a work in progress, but it’s definitely one to remember the next time you’re thinking “I wonder how screen readers treat this markup…”

From Pages to Patterns: An Exercise for Everyone · An A List Apart Article

I’m so proud of Charlotte right now: last week she gave a conference talk and today she has an article published in A List Apart. Superb work on both fronts!

She does a great job of talking through a collaborative exercise to help teams move from thinking in pages to thinking in patterns.

Where Did the Internet Begin? - The Atlantic

Ingrid begins her tour into the internet and into the past with a visit to room 3240 at UCLA, home to the first node on the ARPAnet.

In a strikingly accurate replica of the original IMP log (crafted by UCLA’s Fowler Museum of Cultural History) on one of the room’s period desks is a note taken at 10:30 p.m., 29 October, 1969—“talked to SRI, host to host.” In the note, there is no sense of wonder at this event—which marks the first message sent across the ARPANET, and the primary reason the room is now deemed hallowed ground.

More for the skill

Be willing to look like a dork:

Embarrassment about what others think has to be the biggest block to any learning. Embarrassment of looking silly. Embarrassment of looking stupid for asking the question everyone else is wondering about but no one is willing to make.

Chimes nicely with Charlotte’s recent piece, Be comfortable looking like an idiot.

The Okinawa missiles of October | Bulletin of the Atomic Scientists

Pssst! Wanna read something scary for Halloween? Well, this should make you shit your pants.

Seriously though, if the event described here turn out to be true, it is one of the most frightening moments in the history of our species.

<input> I ♡ you, but you’re bringing me down – Monica Dinculescu

The sad history of input elements.

I wish I could share in the closing optimism:

Now imagine the future where Web Components are supported natively, and someone else is allowed to write a <better-input>, an element that is a real, encapsulated DOM element, and not just a div soup. Imagine using this <better-input> that isn’t implemented differently in each browser, that looks the same everywhere, and that probably also knows how to bake you a cherry pie.

But I all I can think is:

Now imagine the future where Web Components are supported natively, and everyone is allowed to write a million variations of <my-idea-of-a-better-input>, an element that is an inaccessible div soup under the hood.

Patterns & Modules: The Toast — 2015 Redesign

I really like the way that you can literally flip between the source code and the output in this styleguide for The Toast.

It’s the IMP

There are Inception-like layers of nostalgia here: firstly, this web series of web pages made by Matt are a throwback to an earlier era, and secondly, the story being told goes all the way back to the birth of the ARPAnet.

Be comfortable looking like an idiot by Charlotte Jackson

I was talking to Charlotte recently about public speaking, confidence, and overcoming fear. She really hit the nail on the head when she said “I need to get comfortable with feeling like an idiot.”

Words to live by—especially if you’re working on the web.

The Radiation Threat to “The Martian” (PDF)

This is something that has been bugging me ever since reading the book:

While Andy Weir does a good job of representing the risks faced by Mark Watney, stranded on Mars and confronting one life-threatening challenge after another, he is silent on the threat of radiation, not just to Mark but particularly to the crew of the Hermes as they contemplate executing a daring rescue mission that more than doubles their time in deep space.

Well, this paper answers all my questions.

Advanced storytelling: Narrative. In space. Over time. | Ellen de Vries

I’m loving Ellen’s thoughts on taking storytelling to the next level.

Let’s say that we’ve got a lot of useful storytelling models for design now. Achievement unlocked. Let’s move on to discuss narrative structure, in space, over time.

Periodic Table of Storytelling

Combining the molecules of narrative tropes to create stories.

Arbitrary Number Generator

Need an arbitrary—but not random—number? Here you go.

No numbers available? Top up the stock by providing some arbitrary numbers.

Day 70: Jeremy’s Got Slack Socks

Yeah, you’re jealous.

The Utopia Of Records: Why Sound Archiving Is Important

The significant challenges in archiving audio.

Her Code Got Humans on the Moon—And Invented Software Itself | WIRED

A profile—published on Ada Lovelace Day—of Margaret Hamilton’s work on the Apollo project.

Static AMP page

Maciej has created a version the AMP Project homepage that’s faster, more performant, and more …um …straight-talkin’.

The Internet’s Dark Ages - The Atlantic

The promise of the web is that Alexandria’s library might be resurrected for the modern world. But today’s great library is being destroyed even as it is being built.

A fascinating account of one story’s linkrot that mirrors the woeful state of our attitude to cultural preservation on the web.

Historians and digital preservationists agree on this fact: The early web, today’s web, will be mostly lost to time.

The Most Mysterious Star in Our Galaxy - The Atlantic

The most interesting anomaly uncovered by a Zooniverse project since Hanny’s Voorwerp.

The Be Nice AMP Project

An alternate version of AMP HTML that works in more parsers and user agents.

The AMP project have “A new approach to web performance” making your website dependent on Google. The Be Nice AMP Project follow the old approach: Make your site fast following best practice guidelines and be independent of Google.

Whatfettle ⁓ Note to self: write more

You read a lot and like the idea of writing. You know the best way to get better at writing is to write, so write!

Rise of the meta-platforms and the new ‘web browser’ - Tales of a Developer Advocate

Paul compares publishing on the web to publish on proprietary platforms, and concludes that things aren’t looking great right now.

Performance is the number one selling point for each of these new content platforms.

The Internet of Things Won’t Work Because Things Don’t Work « The Royal Frontier

But we are promised and shown a world where technology is gorgeous and streamlined and helpful and light and unobtrusive. We don’t live in that world. That world is a fantasy. The hope that the Internet of Things will allow us to be free from daily headaches and logistical errors is naive.

adactio’s jams | This Is My Jam

I absolutely love the way that my archive is presented here. Matt and Hannah have set the bar in how to shut down a service in an honest, dignified way.

Project Apollo Archive on Flickr

This is so, so wonderful—hundreds and hundreds of photographs from all of the Apollo missions. Gorgeous!

The shots of Earth take my breath away.

18F — Introducing the U.S. Web Design Standards

The story behind the newly-released pattern library for the US government.

Andy Budd, Unsung Hero No.51 - Brighton Source

An interview with Andy, reminiscing about the early days of Clearleft.

The Ethos of the Web | degrading disgracefully

This is a wonderful, wonderful description of what it feels like to publish on your own site.

When my writing is on my own server, it will always be there. I may forget about it for a while, but eventually I’ll run into it again. I can torch those posts or save them, rewrite them or repost them. But they’re mine to rediscover.

An Event Apart News: Enhance! by Jeremy Keith—An Event Apart video

Here’s the video of the talk I gave at An Event Apart last year.

Guess what it’s about. Go on, guess!

No! It’s about progressive enha… oh.

Designing The Future, John V Willshire, dConstruct 2015 on Vimeo

Just like Nick, John Willshire has put his slides together with the audio from his gobsmackingly good dConstruct presentation on metadesign.

Clearleft 10th birthday party | Flickr - Photo Sharing!

We celebrated ten years of Clearleft’s existence this weekend. A splendid time was had by all!

IMG_3920

How To Organise Your Library

John expands on just one part of his superbly dense and entertaining dConstruct talk.

Diversity Scholarships for ffconf

Remy and Julie are paying for diversity scholarships to Full Frontal on November 6th …including travel and accommodation costs.

The deadline for applications is October 2nd. If you know of someone who would benefit from this, please let them know.

The CompuServe of Things

We need the Internet of Things to be the next step in the series that began with the general purpose PC and continued with the Internet and general purpose protocols—systems that support personal autonomy and choice. The coming Internet of Things envisions computing devices that will intermediate every aspect of our lives. I strongly believe that this will only provide the envisioned benefits or even be tolerable if we build an Internet of Things rather than a CompuServe of Things.

Locus Online Perspectives » Cory Doctorow: What If People Were Sensors, Not Things to be Sensed?

Imagine a location service that sold itself on the fact that your personal information was securely contained in its environs, used by you and you alone. You could have devices on your person that used their sensors to know things about you – when you last ate, what your dining preferences are, what your blood-sugar is, and so on, but these devices would have no truck with the cloud, and they would not deliver that information to anyone else for analysis.

The Web is Ruined and I Ruined it by David Siegel

Here’s a classic. David Siegel—of Creating Killer Websites fame—outlines exactly why he turned his back on that 1×1 spacer .gif trick he invented.

The anatomy of responsive images - JakeArchibald.com

This is the best moment to write a blog post:

I just had my responsive images epiphany and I’m writing it all down before I forget everything.

Writing something down (and sharing it) while you’re still figuring it out is, in my opinion, more valuable than waiting until you’ve understood something completely—you’ll never quite regain that perspective on what it’s like to have beginner’s mind.

Where to Put Your Search Role by Adrian Roselli

This is a very handy tip. I had been putting form role="search" all over The Session. Turns out that’s overriding the default role of “form”. Oops!

GOV.UK elements

I really like the clear styling of checkboxes and radio buttons in the GDS pattern library. Fitts’s law in action.

Lightning Design System

A nice combination of style guide and pattern library, with plenty of documentation.

The Slow Web | words from Cole Henley, @cole007

We become obsessed with tools and methods, very rarely looking at how these relate to the fundamental basics of web standards, accessibility and progressive enhancement. We obsess about a right way to do things as if there was one right way rather than looking at the goal; how things fit into the broader philosophy of what we do on the web and how what we write contributes to us being better at what we do.

The West Pier, Brighton England on Vimeo

For almost a century and a half the West Pier has been Britain’s most iconic pier. Renowned for its wonderful architectural style, it has been visited and enjoyed by millions. Even today with its sculptural remains casting an eerie beauty over the seafront, the West Pier is still the most photographed building in Brighton.

Doing Science On The Web – Infrequently Noted

Alex recounts the sordid history of vendor prefixes and looks to new ways of allowing browsers to ship experimental features without causing long-term harm.

Making Charts with CSS | CSS-Tricks

What a lovely bit of progressive enhancement—styling data tables to display as charts.

Crafting A Bridge Between Storytelling & UX Design

I kind of want to link to every one of John’s post chronicling his 90 days at Clearleft, but this one is particular good, I think: how narrative ideas from the world of storytelling can help unlock some design problems.

Locking the Web Open: A Call for a Distributed Web | Brewster Kahle’s Blog

I like a lot of Brewster Kahle’s ideas here for a more distributed peer-to-peer architecture for the web, but I’m very wary of relying on JavaScript: I’d much prefer a simpler declarative format.

Confidence and Overwhelm

Following on from her great conversation with Jen on The Web Ahead podcast, Rachel outlines a strategy to avoid feeling overwhelmed by the deluge of tools, frameworks, libraries, and techniques inundating front-end developers every day:

Learn your core skills well. Understand HTML and CSS, be able to build a layout without leaning on a framework. Get a solid understanding of how a website actually gets from the server to a browser, an understanding of security and accessibility. These are the basics, the constants. These things change slowly. These things sit underneath all the complexity and the tooling, the CMSs and the noise of thousands of people all trying to make their mark on this industry.

She also makes this important point:

As you are doing this don’t forget to share what you know.

Growing your business

I enjoyed chatting with Marcus and Paul on the Boagworld podcast …mostly because I managed to avoid the topic at hand by discussing sci-fi for half an hour before we settled to the boring stuff about work, business, and all that guff.

Dave Shea – – beyond tellerrand DÜSSELDORF 2015 on Vimeo

A wonderful, wonderful history of the web from Dave at this year’s Beyond Tellerrand conference. I didn’t get to see this at the time—I was already on the way back home—so I got Dave to give me the gist of it over lunch. He undersold it. This is a fascinating story, wonderfully told.

So gather round the computer, kids, and listen to Uncle Dave tell you about times gone by.

The Infinite Trad Session

Okay, this is kind of nuts: some researchers have seeded a neural network with all the tunes from The Session. Some of the results are surprisingly okay. It’s certainly a fascinating project.

A Good Writer Is a Good Thinker

The web – by its very nature – foregrounds the connections between different clusters of knowledge. Links link. One article leads to another. As you make the journey from destination to destination, all inevitably connected by that trail of links, you begin to tease out understanding.

It’s this drawing together, this weaving together of knowledge, that is the important part. Your journey is unique. The chances of another pursuing the same path, link by link (or book by book), is – statistically – impossible. Your journey leads you to discovery and, through reflection, comprehension. You see the connections others haven’t, because your journey is your own.

The Language of Modular Design · An A List Apart Article

Alla has taken the ideas she presented in her superb talk at Responsive Day Out and published them as a great article in A List Apart.

Use the words normal people use

When you’re struggling to write something that sounds clear and sounds human (two of the essential basics of a good blog post, I’d argue), just use the words normal people would use. The best way to find out what those words are is to try talking the thing through to someone who doesn’t know anything about it. Remember what you just said, then write that.

Scribblit

This is so nifty! Mikey has made a site where you can order his interactive artwork.

Interactive? That’s right! Each framed picture comes with a pen so you can doodle over the picture (and wipe it clean again).

Check out The Fett and The Falcon!

Occasional blog of Tobias Revell: Haunted Machines an Origin Story (Long)

Any sufficiently advanced hacking is indistinguishable from a haunting. In the same way that many Internet of Things objects are referred to as ‘enchanting’ or ‘magical,’ with an intervention, they can very quickly become haunted.

90 Days

John is joining us at Clearleft for three months and he’s documenting every single day—in quite some detail!

If you’ve ever wanted to be a fly on the wall at Clearleft, well, this is pretty close.

PDF: Designing For Deep Time: How Art History Is Used To Mark Nuclear Waste

Kelli Anderson’s thesis on the Human Interference Task Force project set up to mark nuclear waste sites for future generations (a project I’ve referenced in some of my talks).

(Xrisk 101): Existential Risk for Interstellar Advocates | Heath Rezabek - Academia.edu

Exemplars proposing various solutions for the resilience of digital data and computation over long timeframes include the Internet Archive; redundantly distributed storage platforms such GlusterFS, LOCKSS, and BitTorrent Sync; and the Lunar supercomputer proposal of Ouliang Chang.

Each of these differs in its approach and its focus; yet each shares with Vessel and with one another a key understanding: The prospects of Earth-originating life in the future, whether vast or diminishing, depend upon our actions and our foresight in this current cultural moment of opportunity, agency, awareness, ability, capability, and willpower.

No one will ever read this but

There’s something so beautifully, beautifully webbish about this: readings of blog posts found through a search for “no one will ever read this.”

Listen to all of them.

Deep Time : A History of the Earth

This infographic offers a visual way to explore the various stages of the Earth’s history using a 12 hour clock analogy.

Library of Babel

This is simply wondrous! A microcosm of Borges’s story made real on the world wide web.

We do not simply generate and store books as they are requested — in fact, the storage demands would make that impossible. Every possible permutation of letters is accessible at this very moment in one of the library’s books, only awaiting its discovery.

INTERNET IMAGES ^ 10

This is just wonderful: Powers Of Ten recreated using images from the internet. Also available as a flip book!

Read more about it or watch the video.

Styleguide

Huge have released their tool for generating front-end style guides.

Fan Is A Tool-Using Animal—dConstruct Conference Talk

Maciej has published the transcript of his magnificent (and hilarious) talk from dConstruct 2013.

Lightyear.fm

This is a nifty audio-isation of distance from the Earth, like Radio Free Earth but a lot slicker.

You might not need jQuery plugins

From the people who brought you youmightnotneedjquery.com comes youmightnotneedjqueryplugins.com.

Don’t get me wrong—jQuery is great (some of the plugins less so) but the decision about whether to use it or not on any particular project should be an informed decision made on a case-by-case basis …not just because that’s the way things have always been done.

These sites help to inform that decision.

The Ushahidi Platform ~ Pattern Library

A really nicely-documented pattern library.

Clearleft Letterpress Day | Flickr - Photo Sharing!

This was a fun way to spend the day—getting my hands dirty with ink and type.

Wood type composited and ready to set

An album for a11y | HeydonWorks

Heydon’s putting together a collection of songs from webby people. I need to either give him a Salter Cane track or record some tunes for this.

The Internet That Was (and Still Could Be) - The Atlantic

A fantastic piece by David Weinberger on the changing uses of the internet—apparently in contradiction of the internet’s original architecture.

Some folks invented the Internet for some set of purposes. They gave it a name, pointed to some prototypical examples—sharing scientific papers and engaging in email about them—shaping the way the early adopters domesticated it.

But over time, the Internet escaped from its creators’ intentions. It became a way to communicate person-to-person via email and many-to-many via Usenet. The web came along and the prototypical example became home pages. Social networking came along and the prototype became Facebook.

tota11y – an a11y visualization toolkit

A handy little bookmarklet for doing some quick accessibility checks.

When Responsive Images Get Ugly by Taylor Hunt on CodePen

This is a deep, deep dive into responsive images and I can only follow about half of it, but there are some really useful suggestions in here (I particularly like the ideas for swapping out images for print).

Practical Questions around Web Components - Ian Feather

An in-depth look at where web components stand today, together with some very good questions about where they might be heading tomorrow.

Web Typography – a handbook by Richard Rutter — Kickstarter

You’ll want to back this—you’ll want to back the hell out of this!

Writing for Yourself (& the Power of Absolute Positioning)

We should write for ourselves, we should write about whatever we want to. Not just about the web either. Our twitter feeds don’t need to be a highlight reel of our best moments and not every blog post needs to be a stinging critique of the latest javascript framework. They just need to reflect who we are and what we think about and with any luck, when we look back on them, we might learn something about ourselves.

Clearleft Graduate Internship

Know any talented recent graduates? Let ‘em know about this 3-month internship at Clearleft.

Keep The Web Healthy

I really like this impassioned love letter to the web. This resonates:

The web is a worthy monument for society. It cannot be taken away by apps in the app store or link bait on Facebook, but it can be lost if we don’t continue to steward this creation of ours. The web is a garden that needs constant tending to thrive. And in the true fashion of the world wide web, this is no task for one person or entity. It will require vigilance and work from us all.

Progressive Apps: Escaping Tabs Without Losing Our Soul – Infrequently Noted

I really like Alex’s framing of best-of-breed progressively enhanced websites as “progressive apps” (although Bruce has some other ideas about the naming).

It’s a shame that the add-to-homescreen part isn’t standardised yet though.

The real story of how the Internet became so vulnerable | The Washington Post

The first in a series of articles about the architecture of the internet and its security issues, this is a great history lesson of how our network came to be.

What began as an online community for a few dozen researchers now is accessible to an estimated 3 billion people. That’s roughly the population of the entire planet in the early 1960s, when talk began of building a revolutionary new computer network.

‘That pig was a good influence’ with Jeremy Keith and Jeffrey Zeldman on Unfinished Business on Huffduffer

I had a lot of fun recording this episode with Andrew and Jeffrey. It is occasionally surreal.

Stick around for the sizzling hot discussion of advertising at the end in which we compare and contrast Mad Men and Triumph Of The Will.

Interface Experience Maps, From the Notebook of Aaron Gustafson

This sounds like it could be a very useful tool to introduce early in projects to get a shared understanding of progressive enhancement.

How we built the new gocardless.com — GoCardless Blog

A classic example of the holy grail of web performance and robustness—start with regular HTML sent from the server, enhance once it’s in the browser …if the browser is capable of it. In this case, it’s using JavaScript (React) on both the server and the browser.

Here Comes the Airplane

Paradigm-busting disruption!

They Write the Right Stuff

This article first appeared in Fast Company almost twenty years ago. It’s a fascinating look into the culture and process that created and maintained the software for the space shuttle. It’s the opposite of Silicon Valley’s “move fast and break things.”

To be this good, the on-board shuttle group has to be very different — the antithesis of the up-all-night, pizza-and-roller-hockey software coders who have captured the public imagination. To be this good, the on-board shuttle group has to be very ordinary — indistinguishable from any focused, disciplined, and methodically managed creative enterprise.

100 days reflections | Clear Thinking - The Clearleft Blog

Two-thirds of the way through our 100 days project, Batesy takes stock of his journey so far.

(I should probably mention that I love each and every one of the pieces of hand lettering that he’s done …talented bastard.)

The Village and The Village

In which Dan simultaneously goes to the Netherlands and Belgium in a Miévillian sort of way.

Have a listen to the dConstruct 2011 talk from Kars for context.

When Neil Armstrong and Edmund Hillary Took a Trip to the North Pole | Atlas Obscura

Hillary, legendary for being the first to scale Mount Everest with teammate Tenzing Norgay, was on board, and Armstrong was, too, saying he was curious to see what the North Pole looked like from ground level, as he’d only seen it from the moon. Astronaut problems.

Web! Apps! Fight! : Sally Jenkinson

It’s not about technology, performance and APIs – it’s about people.

Mentorship for the Novice Expert · An A List Apart Column

Every single word that Lyza has written here speaks to me so, so much.

I have no idea what I’m doing and I’m nervous about messing up, but I keep doing this week after week because it feels important.

Get out of my head, Lyza!

My first public speaking experience by Charlotte Jackson, Front-end developer

I felt a great swell of pride watching Charlotte give an excellent presentation at the Talk Web Design conference at Greenwich University.

Mutant Materials and Video Spaces: 20 years of MoMA on the web

Much of the web’s early cultural and design history is at risk, despite efforts by the Internet Archive and renegade archivists. One of our realizations after 20 years on the web is that our responsibility isn’t just to the new; we also need to preserve what’s been built in the past.

Grant Morrison | Starting Over

Grant, like Emma, has recently started blogging again. This makes me very, very happy. And he’s doing it for what I consider to be all the right reasons:

But this is mostly a place for me to capture my thoughts, and an excuse to consider them, and an opportunity to understand them more fully.

Instant Web · An A List Apart Column

More thoughts on the lack of a performance culture, prompted by the existence of Facebook Instant:

In my experience, the biggest barrier to a high-performance web is this: the means of production are far removed from the means of delivery. It’s hard to feel the performance impact of your decisions when you’re sitting on a T3 line in front of a 30 inch monitor. And even if you test on real devices (as you should), you’re probably doing it on a fast wifi network, not a spotty 3G connection. For most of us, even the ones I would describe as pro-performance, everything in the contemporary web design production pipeline works against the very focus required to keep the web fast.

The Web is the network

The Indieweb approach has a lot in common with Ev’s ideas for Medium, but the key difference is that we are doing it in a way that works across websites, not just within one.

GSWO Workshop with Sparkbox

Katie, Divya, and the other great designers and developers at Sparkbox run workshops on HTML and CSS for girl scouts. They’ve shared their resources and I might just borrow some of them for Codebar.

15 Years Ago in ALA: Much Ado About 5K · An A List Apart Blog Post

Zeldman looks back at Stewart Butterfield’s brilliant 5K contest. We need more of that kind of thinking today:

As one group of web makers embraces performance budgets and the eternal principles of progressive enhancement, while another (the majority) worships at the altar of bigger, fatter, slower, the 5K contest reminds us that a byte saved is a follower earned.

Mars Weather

A handy way of quickly finding out how the weather in your area compares to the weather on Mars.

The JavaScript-Dependency Backlash: Myth-Busting Progressive Enhancement

Progressive Enhancement remains the best option for solving web development issues such as wide-ranging browser support, maintenance and future-proofing your application.

keyboard (div) ✿ dabblet.com

Here’s a really nifty use of the :checked behaviour pattern that Charlotte has been writing about—an interface for choosing a note from a piano keyboard. Under the hood, it’s a series of radio buttons and labels.

MoMA’s Digital Art Vault

Ben Fino-Radin describes how the MoMA’s archivematica “analyzes all digital collections materials as they arrive, and records the results in an obsolescence-proof text format that is packaged and stored with the materials themselves.”

Barnaby Walters • #TIL there’s a crater on Mercury named after Turlough O’Carolan

The 17th century blind Irish harpist has been immortalised as a crater on Mercury.

Archives in the Digital Age

I’m going to be taking part in a discussion upstairs in The Eagle in Brighton on May 14th, all about digital preservation. I think it’s going to be really fun. It’s free—you should come along.

Future Library – Framtidsbiblioteket

Here’s a lovely project with an eye on the Long Now. Trees that were planted last year will be used to make paper to print an anthology in 2114.

Margaret Atwood is one of the contributors.

Everyone has JavaScript, right?

And that’s why you always use progressive enhancement!

screen shot from the TV series Arrested Development, showing a character whose catchphrase began 'And that's why...'

What does Google need on mobile? — Benedict Evans

The key change in all of this, I think, is that Google has gone from a world of almost perfect clarity - a text search box, a web-link index, a middle-class family’s home - to one of perfect complexity - every possible kind of user, device, access and data type. It’s gone from a firehose to a rain storm. But on the other hand, no-one knows water like Google. No-one else has the same lead in building understanding of how to deal with this. Hence, I think, one should think of every app, service, drive and platform from Google not so much as channels that might conflict but as varying end-points to a unified underlying strategy, which one might characterize as ‘know a lot about how to know a lot’.

[this is aaronland] did I mention it vibrates?

history is time breaking up with itself

A great piece of hypertext from Aaron on the purpose of museums, the Copper Hewitt Pen, and matter battles.

Hazards Of Prophecy by Arthur C. Clarke

A PDF of Clarke’s classic essay on the follies of prediction. From the 1972 collection The Futurists, edited by Alvin Toffler.

Progressive enhancement with handlers and enhancers | hiddedevries.nl

I like this declarative approach to associating JavaScript behaviours with HTML elements.

Keeping it simple: coding a carousel by Christian Heilmann

I like this nice straightforward approach. Instead of jumping into the complexities of the final interactive component, Chris starts with the basics and layers on the complexity one step at a time, thereby creating a more robust solution.

If I had one small change to suggest, maybe aria-label might work better than offscreen text for the controls …as documented by Heydon.

Codebar Brighton came to Clearleft.

Charlotte’s opening remarks at the most recent Codebar were, by all accounts, inspiring.

I was asked to give a short talk about my journey into coding and what advice I would give to people starting out.

Talking design

Mariana Mota is writing a book on the collaborative design process. She’s sharing her research videos as she goes.

The first video features Gerry Leonidas.

Dev.Opera — UX accessibility with aria-label

A great run-down by Heydon of just one ARIA property: aria-label.

SmashingConf Oxford 2015: Richard Rutter on Don’t Give Them What They Want, Give Them What They Need

A great case study from Richard, walking through the process of redesigning the website for the Royal Borough of Kensington and Chelsea.

15 Years of Dao · An A List Apart Blog Post

On the fifteenth anniversary of A Dao Of Web Design people who make websites share their thoughts.

Paul Ford’s is a zinger:

I don’t know if the issues raised in “A Dao of Web Design” can ever be resolved, which is why the article seems so prescient. After all, the Tao Te Ching is 2500 years old and we’re still working out what it all means. What I do believe is that the web will remain the fastest path to experimenting with culture for people of any stripe. It will still be here, alive and kicking and deployed across billions of computing machines, in 2030, and people will still be using it to do weird, wholly unexpected things.

pacapong by kingPenguin

Pacman meets Pong meets Space Invaders.

Let Links Be Links · An A List Apart Article

A superb piece by Ross Penman on the importance of being true to the spirit of the web.

Codebar Brighton from Matchbox HQ - Matchbox Mobile

Jo writes about hosting Codebar Brighton. I share her enthusiasm—it feels like a great honour to be able to host such a great community event.

With a spoonful of flexbox by Charlotte Jackson, Front-end developer

Charlotte has experimenting with a nice discrete bit of flexbox on her personal site. Here she documents what she did, and what the fallback is.

isolani - Web Standards: Flash’s slide into irrelevance

Mike runs through the history of Flash. Those who forget the history of the web are doomed to repeat it:

The struggle now seems to be turning to native apps versus non-native apps on the mobile platform. It is similar to Flash’s original battle ground: the argument that the Web technology stack is not suitable for building applications with a polished user-experience.

Rothkode

Mark Rothko paintings recreated with CSS gradients.

The Brighton Makerlab - where technology meets awesome! by Simon Riley — Kickstarter

Still a few days left to back this great project for Brighton:

Build, tinker, make and play! For anyone with imagination, The Brighton Makerlab lets ages 8 to 80 create cool stuff with technology.

What Should I Design? - the design prompt generator

Get your next design game off to a quick start with this handy generator of nonsensical-yet-vaguely-plausible product ideas.

Purple: A UI kit for Heroku’s web interfaces

Hot on the heels of Github’s pattern library, here’s Heroku’s.

Home · Primer

Github’s pattern library.

As always, it’s great to see how other organisations are tackling modular reusable front-end code (though I can’t imagine why anyone other than Github would ever want to use it in production).

Zen and the Art of Wearable Markup

Jeffrey muses on progressive enhancement and future-friendliness.

JavaScript and Archives | inkdroid

Thoughts on the long-term viability of sites that use JavaScript to render their content.

Submarine Cable Map 2015

This year’s map from TeleGeography is looking lovely.

The Smithsonian’s design museum just got some high-tech upgrades

A profile of the great work Aaron and Seb have been doing at the Cooper Hewitt museum. Have a read of this and then have a listen again to Aaron’s dConstruct talk.

js;dr = JavaScript required; Didn’t Read.

Because in 10 years nothing you built today that depends on JS for the content will be available, visible, or archived anywhere on the web.

INTERNETARCHIVE.BAK - Archiveteam

The most ambitious project from Archive Team yet: backing up the Internet Archive.

We can do this, people! Moore’s Law and all that.

The Web’s Grain by Frank Chimero

Superb. Absolutely superb.

A magnificent tour-de-force by Frank on the web’s edgelessness.

Read. Absorb. Read again. This is the essence of responsive web design, distilled.

Design Principles

These are principles of visual design—hierarchy, rhythm, etc.—nicely explored and explained.

Quantity Queries for CSS · An A List Apart Article

A terrific bit of smart CSS thinking from Heydon Pickering.

You know he’s speaking at Responsive Day Out, right?

flexbox in 5 minutes

A really handy interactive intro to flexbox. Playing around with the properties and immediately seeing the result is a real help.

Google’s experimental new “slow” label could revolutionize how we tackle web performance - Web Performance Today

It looks like Google is going to start explicitly labelling slow sites as such in their search results (much like they recently started explicitly labelling mobile-friendly sites). So far it’s limited to Google’s own properties but it could be expanded.

Personally, I think this is a fair move. If the speed of a site were used to rank sites differently, I think that might be going too far. But giving the user advanced knowledge and leaving the final decision up to them …that feels good.

Space Probes Art Print by Ariel Waldman

Now you can get a 7” x 10” print of the cast of Ariel’s fantastic spaceprob.es site.

I think this would look quite fetching in the Clearleft office.

Killing Time at Lightspeed

Interstellar travel time dilation and status updates: a clever narrative combo.

Splatter

Unleash your inner Jackson Pollock.

BBC - Future Media Standards & Guidelines - Accessibility Guidelines v2.0

The minimum dependency for a web site should be an internet connection and the ability to parse HTML.

Awesomplete: Ultra lightweight, highly customizable, simple autocomplete, by Lea Verou

Lea wasn’t happy with the lack of styling and extensibility of the datalist element, so she rolled her own lightweight autocomplete/type-ahead widget, and she’s sharing it with the world.

Seasonal posts × Katy DeCorah

This is such a simple little adjustment, but I think it’s kinda brilliant: tweaking the display of your site’s maps to match the season.

What happened to Web Intents? - Tales of a Developer Advocate

Paul Kinlan writes an honest post-mortem of his push for Web Intents.

There are some valuable lessons here, particularly for the indie web’s web actions.

Hacking on Tiny Love | Clear Thinking - The Clearleft Blog

Our new intern—L’il James—demonstrates good .gif skills in his write-up of the project he worked on at Hack Farm.

It’s like Downton Abbey and Silicon Valley had a baby.

Progressive Enhancement and Data Visualizations | CSS-Tricks

A nice little pattern for generating a swish timeline in SVG from a plain ol’ definition list in HTML.

ASCII format for Network Interchange

This RFC for ASCII (by Vint Cerf) is over 45 years old.

Last month it became a standard.

Infinite Adam Curtis « Tom Scott

Brilliant! Although it’s kind of like shooting fish in a barrel to make a Markov chain out of someone whose entire output is already one big Markov chain.

Adam Curtis: the Banksy of documentaries.

SpringForward - A celebration of women in digital and technology - March 2015, Brighton

There’s a whole bunch of great events happening in Brighton this March: Codebar, Curiosity Hub, She Codes Brighton, 300 Seconds, She Says Brighton, and Ladies that UX. Lots of these will be downstairs from Clearleft in Middle Street—very handy!

Line Mode | Parallel Transport

Worth remembering:

The Web is the printing press of our times; an amazing piece of technology facilitating a free and wide-scale dissipation of our thoughts and ideas. And all of it is based on this near 20-year old, yet timeless idea of the Hyper Text Markup Language.

Responsible Social Share Links — Jonathan Suh

If you insist on having “social” sharing buttons, here’s a way to avoid bloating your page unnecessarily.

But you might want to reconsider whether you need them at all.

The Long Web by Jeremy Keith – An Event Apart Video on Vimeo

This is a talk I gave at An Event Apart about eighteen months ago, all about irish music, the web, long-term thinking, and yes, you guessed it—progressive enhancement.

Spotify Names the Chloe Weil Scholarship to Help Flatiron School Women Fund their Education

A scholarship fund for women students at the Flatiron School, in memory of Chloe.

Spotify has named the program the Chloe Weil Scholarship as a memorial to Chloe Weil, an inspiring designer and engineer who took a strong interest in creating opportunities for women in technology.

Dev Discomfort | dirtystylus

Rushing doesn’t improve things, it might even slow you down. Focusing on a few things and doing them well is worthwhile. Sharing what you learn—even while you’re still figuring things out—is even better.

DevMynd Blog: Pairing with Junior Developers

We hired Charlotte, our first junior developer at Clearleft recently, and my job has taken on more of a teaching role. I’m really enjoying it, but I have no idea what I’m doing, and I worry that I’m doing all the wrong things.

This article looks like it has some good, sensible advice …although I should probably check to see if Charlotte agrees.

What we would change about Rizzo - Ian Feather

I really like the self-examination that Ian and his team at Lonely Planet are doing here. Instead of creating a framework for creating a living style guide and calling it done, they’re constantly looking at what could be done better, and revisiting earlier decisions.

I’m intrigued by the way they’ve decided to reorganise their files by component rather than by filetype.

The Queen Of Code

A short documentary on the wonderful Grace Hopper.

Welcome to the new Guardian website

The Guardian have hit the big red button and made their responsive site the default. Great stuff!

(top tip: don’t read the comments)

Adrian Roselli: All of This Has Happened Before and Will Happen Again

Everyone who calls for WebKit in Internet Explorer is exactly the same kind of developer who would have coded to Internet Explorer 15 years ago (and probably happily displayed the best viewed in badge).

Truth.

It’s happening again, and every petulant, lazy developer who calls for a WebKit-only world is responsible.

Android Wear and the Moto 360 Browser

Anna documents the most interesting bit (for me) of her new wearable/watch/wrist-device/whatever — the web browser.

The Brand Deck by Scott Thomas — Kickstarter

This Eno-esque deck of cards by Scott could prove very useful for a lot of Clearleft projects.

Windows 10 Technical Preview IE UA String

I love Lyza’s comment on the par-for-the-course user-agent string of Microsoft’s brand new Spartan browser:

There must be an entire field emerging: UA archaeologist and lore historian. It’s starting to read like the “begats” in the bible. All browsers much connect their lineage to Konqueror or face a lack-of-legitimacy crisis!

MakerLab HQ - Maker Club

Good news, Brighton! There’s a Maker Club opening up on London Road (above the new Presuming Ed coffee shop). Grab your robot kits and come along.

Competing on “Chrome”, From the Notebook of Aaron Gustafson

First, the browsers competed on having proprietary crap. Then, the browsers competed on standards support. Now, finally, the browsers are competing on what they can offer their users.

Over It by Brad Frost

So keep things simple. Build to standards. Use progressive enhancement. Don’t try to send wheelbarrows full of JavaScript down the pipes unless you have to. Don’t make assumptions.

What the Web Said Yesterday

A profile of the wonderful Internet Archive.

No one believes any longer, if anyone ever did, that “if it’s on the Web it must be true,” but a lot of people do believe that if it’s on the Web it will stay on the Web. Chances are, though, that it actually won’t.

Brewster Kahle is my hero.

Kahle is a digital utopian attempting to stave off a digital dystopia. He views the Web as a giant library, and doesn’t think it ought to belong to a corporation, or that anyone should have to go through a portal owned by a corporation in order to read it. “We are building a library that is us,” he says, “and it is ours.”

UK-led Beagle 2 lander found on Mars - News stories - GOV.UK

This is quite amazing!

I remember getting up on Christmas day 2003 (I was in Arizona), hoping to get news of Beagle 2’s successful landing. Alas, the news never came.

For something that size to be discovered now …that’s quite something.

The problem with Angular - QuirksBlog

I have doubts about Angular 1.x’s suitability for modern web development. If one is uncharitably inclined, one could describe it as a front-end framework by non-front-enders for non-front-enders.

Atomic Design by Brad Frost

Brad’s writing a book.

Insert take-my-money.gif here.

HTTP/2.0 - The IETF is Phoning It In - ACM Queue

There are some good points here comparing HTTP2 and SPDY, but I’m mostly linking to this because of the three wonderful opening paragraphs:

A very long time ago —in 1989 —Ronald Reagan was president, albeit only for the final 19½ days of his term. And before 1989 was over Taylor Swift had been born, and Andrei Sakharov and Samuel Beckett had died.

In the long run, the most memorable event of 1989 will probably be that Tim Berners-Lee hacked up the HTTP protocol and named the result the “World Wide Web.” (One remarkable property of this name is that the abbreviation “WWW” has twice as many syllables and takes longer to pronounce.)

Tim’s HTTP protocol ran on 10Mbit/s, Ethernet, and coax cables, and his computer was a NeXT Cube with a 25-MHz clock frequency. Twenty-six years later, my laptop CPU is a hundred times faster and has a thousand times as much RAM as Tim’s machine had, but the HTTP protocol is still the same.

Postcards from a Supply Chain

Dan has started writing up what he did on his Summer hols …on a container ship travelling to China.

It is, of course, in the form of an email newsletter because that’s what all the cool kids are doing these days.

Netherlandish Proverbs – Pieter Bruegel the Elder – An Analog Project

A lovely Yuletide present from Brian and co.—an exploration of the proverbs embodied in Bruegel’s painting.

HTML5 Differences from HTML4

I just noticed that I’m mentioned in the acknowledgements of this most handy of W3C documents. This pleases me disproportionately.

Taunus

I like the thinking behind this isomorphic JavaScript library: start with the (Node.js) server and then take over on the client side after the initial page load.

Implement Server-Side Rendering for SEO · Issue #9938 · emberjs/ember.js

The motivation seems entirely misplaced to me (SEO? Really?) but never mind: the end result could be the holy grail of JavaScript MVC frameworks — code that runs on the server and the client. That would get you the reach and initial rendering speed of progressive enhancement, combined with the power of client-side application logic once the page has loaded.

Watch this space.

Researching the Performance costs of JavaScript MVC Frameworks

The Filament Group run the numbers on how long it takes browsers to parse the JavaScript of popular MVC frameworks: Backbone, Angular, and Ember. The results—especially on mobile browsers—are not encouraging.

28 Months on Mars - NYTimes.com

Curiosity’s journey so far, nicely visualised.

State of Web Type

Like caniuse.com, but for typography features. Find out what’s supported in browsers today.

You Don’t Need jQuery! – Free yourself from the chains of jQuery by embracing and understanding the modern Web API and discovering various directed libraries to help you fill in the gaps.

The tone is a bit too heavy-handed for my taste, but the code examples here are very handy if you’re weaning yourself off jQuery.

TARS, CASE & KIPP from Interstellar

Print out the plans, fold and glue/sellotape the paper together, and you’ve got yourself the best sci-fi robots in recent cinema history.

ST4I - Stuff That Talks To The Internet - workshop on Vimeo

Seb will be running this workshop again at the start of February—details here. I can’t recommend it highly enough—it’s so, so good!

RFID podcast radio-in-a-box (needs sound to make any sense) | Flickr - Photo Sharing!

This is so nifty! A combination of the Radiodan, Huffduffer, and RFID, all wrapped up in a box.

Backstory here.

RFID podcast radio-in-a-box (needs sound to make any sense)

An immigration lawyer reviews Paddington

Sounds like a cute idea, right?

In fact it’s the best thing you’re ever likely to read on Peruvian ursine immigration.

Asteroid Day

This is an awareness project I can get behind: a Clarke-like Project Spaceguard to protect the Earth from asteroid collisions. This campaign will focus awareness of this issue on one single day…

Now if only the front page of this website actually said when that day will be.

Update: And now it does.

The Secret Life of Passwords - NYTimes.com

A fascinating look at how the humble password gets imbued with incredible levels of meaning.

It reminds me of something I heard Ze Frank say last year: “People fill up the cracks with intimacy.”

Bruce Lawson’s personal site  : On the accessibility of web components. Again.

I completely share Bruce’s concern about the year-zero thinking that’s accompanying a lot of the web components marketing:

Snarking aside, why do so few people talk about extending existing HTML elements with web components? Why’s all the talk about brand new custom elements? I don’t know.

Hear, hear!

I’m a fan of web components. But I’m increasingly worried about the messaging surrounding them.

On File Formats, Very Briefly, by Paul Ford · The Manual

A history lesson and a love letter to the early web, taking in HTML, Photoshop, and the web standards movement.

Those were long years, the years of drop-shadows. Everything was jumping just slightly off the screen. For a stretch it seemed that drop-shadows and thin vertical columns of text would define the web. That was before we learned that the web is really a medium to display slideshows, as many slideshows as possible, with banner ads.

as days pass by — Enabling Webmentions

Stuart has implemented webmentions on his site, which is great. It’s also fitting, as he is the inventor of pingback (of which webmention is a simpler reformulation).

WebP via picture

This strikes me as an eminently sensible idea by Emil: using the picture element to begin providing WebP alternatives to JPG.

Of course, picture-supporting browsers will have to adjust their decision-making algorithm to support this pattern.

Oh, Jeremy, you silly billy. It turns out that this works right out of the box. Nice!

Lunar Missions Ltd

We’re going back to the moon. With a robot. So we can take sublunarean samples.

You can help fund it on Kickstarter.

Silicon Valley Job Title Generator

This could come in useful for updating the Clearleft website.

Accessibility of Web Components

A great presentation on web components by Marcy, with an emphasis on keeping them accessible.

On HTML5 and the Group That Rules the Web

Paul Ford’s potted history of web standards, delivered in his own inimitable style.

Reading through the standards, which are dry as can be, you might imagine that standardization is a polite, almost academic process, where wonks calmly debate topics like semicolon placement. This is not the case.

Perf.Rocks

A collection of performance resources: articles, tools, talks, and books.

Steve Albini on the surprisingly sturdy state of the music industry

Steve Albini’s barnstorming keynote address at Melbourne’s Face the Music conference.

HTML5’s “Dirty Little Secret”: It’s Already Everywhere, Even In Mobile - ReadWrite

I’m an advocate for progressive enhancement. Tom Dale is not. But even though we may disagree on that, there’s a lot to like in his sensible, balanced answers to some sensationalist linkbaity questions.

It’s not that the pace of innovation on the Web is slower, it’s just solving a problem that is an order of magnitude more challenging than how to build and distribute trusted apps for a single platform. As we saw on the desktop, it may take a few years to catch up to all of the capabilities of a native, proprietary platform, but in terms of the impact it will have on humanity, forgive me for not losing sleep if we have to wait a few years for it to arrive.

HUB Interviews - Jeremy Keith on Huffduffer

Here’s a fun little interview I did recently, mostly about work stuff. It’s available for your huffduffing pleasure.

One thing that really bothers me is the way I repeatedly said “guys” to refer to my colleagues at Clearleft. I must stop doing that.

As we may understand: A constructionist approach to ‘behaviour change’ and the Internet of Things by Dan Lockton

An epic braindump by Dan, covering connected devices, product design, co-creation, DIY, and knopening stuff up. That’s right: knopening.

Knopen, a fairly obvious portmanteau of know and open, can be a verb (to knopen something) or an adjective (e.g. a knopen tool).

The Nor: A Paranoid Cartography

James walks the site of London’s old wall, documenting the instruments of London’s new wall.

He wrote about his experience in “All Cameras Are Police Cameras.” It is a history lesson, a present lesson, and a future lesson, all in one.

Web Standards for the Future on Vimeo

A cute videolette on web standards.

Overwhelmed by Code · An A List Apart Blog Post

Focus on what you want to learn; not what you think you should learn.

There is a lot of pressure out there: to learn new things, to spend all your time coding, to be the super developer. I now believe that to be impossible and unhealthy. It means you aren’t living a balanced life and it also means that you’re living under constant stress and pressure.

Responsive Images in Practice · An A List Apart Article

A great primer on using srcset and picture. I think I’ll be referring back to this a lot.

ARIA Quicktip: Labelledby vs. Describedby, From the Notebook of Aaron Gustafson

Yesterday, Aaron gave a great talk at BD Conf about forms. In one example, he was using aria-describedby. I was a bit confused by the differences between aria-describedby and aria-labelledby, so Aaron has very helpfully clarified the distinction.

Stop Breaking the Web

Angry, but true.

Don’t lock yourself into a comprehensive technology that may just die within the next few months and leave you stranded. With progressive enhancement you’ll never go wrong. Progressive enhancement means your code will always work, because you’ll always focus on providing a minimal experience first, and then adding features, functionality, and behavior on top of the content.

99 Cent: A Look at the Widespread Confusion Over a Photo Gursky DIDN’T Shoot

A fascinating tale of mistaken identity with one of Lyza’s photos.

Hitler reacts to the HTML5 URL normative reference controversy

This is hilarious …for about two dozen people.

For everyone else, it’s as opaque as the rest of the standardisation process.

How URL started as UDI — a brief conversation with @timberners_lee @W3C #TPAC - Tantek

Tantek shares a fascinating history lesson from Tim Berners-Lee on how the IETF had him change his original nomenclature of UDI—Universal Document Identifier—to what we now use today: URL—Uniform Resource Locator.

The ride to 5 | HTML5 Doctor

HTML5 is now a W3C recommendation. Here’s what a bunch of people—myself included—have to say about that.

Beautiful Maps

Cartography porn.

Marcel The Shell With Shoes On, Three - YouTube

Do you want to know what the truth is about shrimps? They’re the idiots of the sea! One time I saw a shrimp just swim right into a rock.

Axiomatic CSS and Lobotomized Owls · An A List Apart Article

I’m quite intrigued by the thinking behind this CSS selector of Heydon’s.

* + * {
    margin-top: 1.5em;
}

I should try it out and see how it feels.

Carrot

It Just Works.®™

What is still on the web after 10 years of archiving? - UK Web Archive blog

The short answer: not much.

The UK Web Archive at The British Library outlines its process for determining just how bad the linkrot is after just one decade.

The Elon Musk interview on Mars colonisation – Ross Andersen – Aeon

Elon Musk talks engineering, the Fermi paradox, and getting your ass to Mars.

The boring front-end developer - Adam Silver, Front end developer, based in London

My name is Jeremy and I am a boring front-end developer.

Startups and Shit, HTML-first

The Android vs. iOS debate is one hinges around whether you think it makes more sense to target a (perceived) larger market, or target one that the technorati favor. But why choose? Building a good responsive web app has a series of benefits, the primary one being that you target users on every platform with one app. Every user. Every platform. All the time. Release whenever you want. A/B test with ease. Go, go go.

Tabletop Whale

Beautiful visualisations of science and nature.

Made with love by a designer with a molecular biology degree.

JS Parse and Execution Time - TimKadlec.com

Tim’s been running the numbers on how long it takes various browsers on various devices to parse JavaScript—in this case, jQuery. The time varies enormously depending on the device hardware.

Physical Web by google

This is what Scott Jenson has been working on—a first stab at just-in-time interactions by having physical devices broadcasting URLs.

Walk up and use anything

Introducing Universal SSL

Great news from Cloudflare—https endpoints by default!

This means that if you’re planning on switching on TLS for your site, but you’re using Cloudflare as a CDN, you’ve got one less thing to change (and goodness knows you’re going to have enough to do already).

I really like their reasoning for doing this, despite the fact that it might mean that they take a financial hit:

Having cutting-edge encryption may not seem important to a small blog, but it is critical to advancing the encrypted-by-default future of the Internet. Every byte, however seemingly mundane, that flows encrypted across the Internet makes it more difficult for those who wish to intercept, throttle, or censor the web. In other words, ensuring your personal blog is available over HTTPS makes it more likely that a human rights organization or social media service or independent journalist will be accessible around the world. Together we can do great things.

Keep ’em Separated — ericportis.com

I share the concerns expressed here about the “sizes” attribute that’s part of the new turbo-powered img element (or “the picture element and its associates”, if you prefer). Putting style or layout information into HTML smells bad.

This is a concern that Matt Wilcox has raised:

Change the design and those breakpoints are likely to be wrong. So you’ll need to change all of the client-side mark-up that references images.

I can give you a current use-case: right here on adactio.com, you can change the stylesheet …so I can’t embed breakpoints or sizes into my img elements because—quite rightly—there’s a separation between the structural HTML layer and the presentational CSS layer.

Responsive Images: If you’re just changing resolutions, use srcset. | CSS-Tricks

Following on from that post of Jason’s I linked to, Chris also emphasises that, for most use cases, you probably only need to use srcset (and maybe sizes), but not the picture element with explicit sources.

It’s really, really great that people are writing about this, because it can be quite a confusing topic to wrap your head around at first.

Using ServiceWorker in Chrome today - JakeArchibald.com

It’s very early days for ServiceWorker, but Jake is on hand with documentation and instructions on its use. To be honest, most of this is over my head and I suspect it won’t really “click” until I try using it for myself.

Where it gets really interesting is in the comments. Stuart asks “What about progressive enhancement?” And Jake points out that because a ServiceWorker won’t be installed on a first visit, you pretty much have to treat it as an enhancement. In fact, you’d have to go out of your way to make it a requirement:

You could, of course, throw up a splash screen and wait for the ServiceWorker to install, creating a ServiceWorker-dependant experience. I will hunt those people down.

The Tink Tank » Understanding screen reader interaction modes

Léonie gives a great, clear description of how screen readers switch modes as they traverse the DOM snapshot.

» Don’t use <picture> (most of the time) Cloud Four Blog

Jason points out that the picture element might not be needed for most responsive image use cases; the srcset and sizes attributes will probably be enough—that’s what I’m doing for the photos on my site.

[this is aaronland] upload.js

A really handy bit of code from Aaron for building a robust file uploader. A way to make your web-based photo sharing more Instagrammy-clever.

Perennial Design, by Wilson Miner · Issue 4 · The Manual

A deeply thoughtful piece (as always) by Wilson, on the mindset needed for a sustainable way of working.

When we start with the assumption that optimizing for rapid, unbounded growth is a goal, we immediately narrow the possibility space. There are only so many choices we can make that will get us there. The same choices that made annual monoculture and the shopping mall the most efficient engines for short-term growth and profit are the same qualities that made them unsustainable in the long term.

There are more ways to scale than growth. There are more ways to deepen our impact than just reaching more people. What if we put just as much effort into scaling the impact of our work over time? Can we build digital products around sustainable systems that survive long enough to outlive us, that are purpose-built to thrive without our constant cultivation?

Against Sharing | Jacobin

But under the guise of innovation and progress, companies are stripping away worker protections, pushing down wages, and flouting government regulations. At its core, the sharing economy is a scheme to shift risk from companies to workers, discourage labor organizing, and ensure that capitalists can reap huge profits with low fixed costs.

There’s nothing innovative or new about this business model. Uber is just capitalism, in its most naked form.

Extensible Web Summit Berlin 2014: my lightning talk on Web Components | soledad penadés

Soledad Penadés also went to the Extensible Web Summit in Berlin, where she gave a lightning talk. Sounds like it was really good.

This also includes some good advice that, again, Alex might want to consider before denouncing any disagreement on Web Components as “piffle and tosh”:

If the W3C, or any other standardisation organisation wants to attract “normal” developers to get more diverse inputs, they/we should start by being respectful to everyone. Don’t try to show everyone how superclever you are. Don’t be a jerk. Don’t scare people away, because then only the loud ones stay, and the quieter shy people, or people who have more urgent matters to attend (such as, you know, having a working business website even if it’s not using the latest and greatest API) will just leave.

Bruce Lawson’s personal site  : Reflections on Extensible Web Summit, Berlin

Bruce went to the Extensible Web Summit in Berlin and wrote up his notes.

Sounds like he shares my excitement, but also my nervousness.

I’m not yet entirely convinced that we’re not heralding a new era of JavaScript-only web development. I don’t want to see the fossilisation of the declarative web and a new Programmer Priesthood (re-)emerge.

There’s also this important point, that Alex would do well to remember before crying “Piffle and tosh!”:

We need to ensure that all devs who want to can participate by allowing ease of collaboration, courteous discourse.

Hypertext as an agent of change | A Working Library

The text of Mandy’s astounding dConstruct talk.

Marvellous stuff!

Digital Amnesia - YouTube

A documentary on our digital dark age. Remember this the next time someone trots out the tired old lie that “the internet never forgets.”

If we lose the past, we will live in an Orwellian world of the perpetual present, where anybody that controls what’s currently being put out there will be able to say what is true and what is not. This is a dreadful world. We don’t want to live in this world. —Brewster Kahle

It’s a terrible indictment of where our priorities were for the last 20 years that we depend essentially on children and maniacs to save our history of this sort. —Jason Scott

Jeffrey Zeldman: 20 years of Web Design and Community on Vimeo

A really nice little documentary about my friend Jeffrey.

An Event Apart News: AEA Resources: Articles, Links, and Tools From An Event Apart Chicago 2014

Hyperlinks relating to the talks delivered at An Event Apart in Chicago, including those connected to my rambling musings on progressive enhancement.

Improving accessibility on GOV.UK search | Technology at GDS

Alice Bartlett shares her experience of getting aria-live regions to work in a meaningful way.

Pop Sonnets

Modern pop songs retold as Shakespearian sonnets.

Jeremy Keith on the importance of creating products that last | netmag | Creative Bloq

I was interviewed for a feature in issue 257 of net magazine.

In this interview, I pause. And continue.

A Ficly Farewell on The Writer’s Room - Official Ficly Blog

Now this is how to shut down a service: switch to a read-only archive, and make the codebase (without user credentials) available on Github.

Heydon Pickering | Effortless Style | CSS Day on Vimeo

Remember when I was talking about refactoring the markup for Code for America? Well, it turns out that Heydon Pickering is way ahead of me.

He talks about the viewpoint of a writer (named Victoria) who wants to be able to write in Markdown, or HTML, or a textarea, without having to add classes to everything. That’s going to mean more complex CSS, but it turns out that you can do a lot of complex things in CSS without using class selectors.

There are slides.

Web Archeology - daverupert.com

A bit of web history reacted by Paravel: the Microsoft homepage from 1994. View source to see some ooooold-school markup.

Ah, memories!

A Spacecraft for All: The Journey of the ISEE-3

A nice bit of interactive citizen science storytelling from Google.

Note: if you have Adblock Plus installed, this won’t load at all. Funny that.

On Blogging - Plausible Thought

If you enjoy writing, or want to enjoy writing, just do it. You’ll probably worry that you have nothing to say, or that what you write is terrible, or that you couldn’t possibly write as well as Neil Gaiman. But silence those voices, get your head down and hit publish on something. Anything. And then do it again. And again.

Pure CSS parallax scrolling websites | Keith Clark

This is clever: a way to achieve parallax scrolling without JavaScript—much more performant.

Of course, you might want to ask yourself why you want a parallax effect in the first place.

Open standards for contact details and calendar events | Technology at GDS

I’ve been suggesting h-event and h-card as open standards for UK government sites.

The Web Manifest specification | HTML5 Doctor

The Web Manifest spec is still very much in draft, but it’s worth reading through Bruce’s explanation of it now. Basically, it will provide a way for us to specify in one external file what we currently have to specify in umpteen meta tags and link elements.

A lot can change in 6 years - Allen Pike

An astute comparison of the early years of the web with the early years of the app store. If there’s anything to this, then the most interesting native apps are yet to come. App Store 2.0?

The Mobile Web should just work for everyone - IEBlog

One more reason why you should never sniff user-agent strings: Internet Explorer is going to lie some more. Can’t really blame them though—if developers didn’t insist on making spurious conclusions based on information in the user-agent string, then browsers wouldn’t have to lie.

Oh, and Internet Explorer is going to parse -webkit prefixed styles. Again, if developers hadn’t abused vendor prefixes, we wouldn’t be in this mess.

The Virtual Haircut That Could Change the World | Design | WIRED

A nice profile of BERG’s Little Printer. That Matt Webb is a smart cookie. He is also a very thoughtful cookie.

MORNING, COMPUTER | Warren Ellis on Pacific Daylight Time

If you were in any doubt that Warren Ellis is going to blow the roof off the Brighton Dome at dConstruct, this is what happens when he decides to write a little something every day.

Radio-Controlled Web Design · An A List Apart Article

Turns out that the :checked pseudo-class selector allows you to do some clever interaction without JavaScript.

Let’s Talk About RTL

Some very handy techniques for working with right-to-left text.

Panorama Fail

The image-stitching algorithm is trying its best.

Software, It’s a Thing — Medium

The first Lunar Orbiter, Andy Warhol’s Amiga, and George R.R. Martin’s WordStar …the opening address to the Digital Preservation 2014 conference July 22 in Washington, DC.

Just as early filmmakers couldn’t have predicted the level of ongoing interest in their work over a hundred years later, who can say what future generations will find important to know and preserve about the early history of software?

(Mind you, I can’t help but feel that the chances of this particular text have a long life at a Medium URL are pretty slim.)

The Pattern Library

Literally a library of patterns: y’know, for tiling background images. Old school!

Google’s ‘Nearby’ Lets Your Smartphone Talk to the Internet of Things | Motherboard

An early look at the just-in-time interactions that Scott has been working on:

Nearby works like this. An enabled object broadcasts a short description of itself and a URL to devices nearby listening. Those URLs are grabbed and listed by the app, and tapping on one brings you to the object’s webpage, where you can interact with it—say, tell it to perform a task.

“The Internet Never Forgets” — sixtwothree.org

The Internet forgets every single day.

I’m with Jason.

I encourage you all to take a moment and consider the importance of preserving your online creations for yourself, your family, and for future generations.

Improving Reality 2014 — Visibility Is A Trap

Lighthouse are putting on their Improving Reality conference again this year. It’s the day before dConstruct. Come to both!

Cotton Bureau – Future Friendly by Brad Frost

For your consideration.

If enough people want a print run of this lovely Future Friendly T-shirt, then they’ll make a new batch.

The profits go to the Internet Archive.

Jeremy Keith on progressive enhancement - YouTube

Almost six minutes of me squinting in the sun and sharing my reckons while seagulls squawk in the background.

The right to flight: why I’m flying a balloon over London this summer

Watch the skies: James Bridle’s balloon will be hovering above London distributing wifi.

Urban Giants on Vimeo

A look at the architectural history of the network hubs of New York: 32 Avenue of the Americas and 60 Hudson Street. Directed by Davina Pardo and written by her husband Andrew Blum, author of Tubes: A Journey to the Centre of the Internet.

These buildings were always used as network hubs. It’s just that the old networks were used to house the infrastructure of telephone networks (these were the long line buildings).

In a way, the big server hotel of New York—111 Eight Avenue—was also always used to route packets …it’s just that the packets used to be physical.

The Internet’s Own Boy: The Story of Aaron Swartz by Brian Knappenberger

The Aaron Swartz film is available on the Internet Archive under a Creative Commons attribution non-commercial share-alike license.

Navigating the Guardian | Help | The Guardian

A peek behind the scenes of an interesting new navigation pattern on the Guardian’s still-in-beta responsive site.

You can try it out here

Web 2024 | Robin Berjon

Here’s a dystopian vision of the web in ten years time, where professional developers are the only people able to publish on the web.

This is why it worries me when I come across very smart people who don’t seem to see a problem with the creation of web pages being taken out of the reach of any human being with an internet connection and a smattering of declarative languages—HTML, CSS—and into the hands of an elite minority of JavaScript programmers.

Practical ARIA Examples

Heydon Pickering put together a great collection of accessible self-contained interface patterns that demonstrate smart use of ARIA.

Pinboard Turns Five (Pinboard Blog)

On the fifth anniversary of Pinboard, Maciej reflects on working on long-term projects:

Avoiding burnout is difficult to write about, because the basic premise is obnoxious. Burnout is a rich man’s game. Rice farmers don’t get burned out and spend long afternoons thinking about whether to switch to sorghum.

The good news is, as you get older, you gain perspective. Perspective helps alleviate burnout.

The bad news is, you gain perspective by having incredibly shitty things happen to you and the people you love. Nature has made it so that perspective is only delivered in bulk quantities. A railcar of perspective arrives and dumps itself on your lawn when all you needed was a microgram.

The elements of HTML

This (literally) charts the evolution of HTML, tracking which elements have been added and which have been removed.

Sana’a (Idle Words)

A new essay from Maciej on Idle Words is always a treat, and this latest dispatch from Yemen is as brilliantly-written as you’d expect.

Marginalia | Parallel Transport

A brilliant idea (and implementation) from Kartik. By combing webmentions and fragmentions, it’s possible to allow a kind of distributed marginalia: you post a comment on your site about a specific passage in a post on my site and a smattering of CSS and JavaScript can display it in the right context.

Good, Form & Spectacle - design & cultural heritage

The brilliant George Oates has started a new design company with an emphasis on cultural heritage: “explicit notes to the future, local archives of global content.” Watch this space

Learn JavaScript & jQuery - a book about interactive front-end web development

This looks like it could be a great book for anyone looking to get starting with JavaScript.

Guardian beta · The container model and blended content – a new approach to how we present content on the Guardian

This is what Oliver was talking about Responsive Day Out 2 — a new approach to information architecture.

Cast off your sidebars! You have nothing to lose but your grids!

shardcore » @bffbot1

Clingy.

She can only offer you unconditional algo-love.

Perhaps that’s the purest love of all.

Getting Back That Lovin’ Feeling on Sparkbox

A lovely little tale of empowerment through HTML and CSS.

Permanence - Matt Gemmell

Some good ideas from Matt on the importance of striving to maintain digital works. I find it very encouraging to see other people writing about this, especially when it’s this thoughtful.

rel=search on Flickr

Here’s a nice little UI addition to Chrome. When you focus on the URL bar, if the current site has site-specific search discoverable via rel=”search”, then you get a greyed-out hint to press tab so you can start searching the site.

rel=search

IXS Enterprise (IXS-110) - an album on Flickr

Design fiction from a NASA scientist.

IXS Enterprise (Work In Progress)

Using Encapsulation for Semantic Markup on CSS-Tricks

I really hope that this is the kind of usage we’ll see for web components: enhancements for the browsers that support them without a good ol’ fashioned fallback for older browsers.

An Event Apart and The Picture Element (a Monkey Do blog post)

A look at how the website for An Event Apart is using the picture and Picturefill …featuring Jessica as the cover girl.

Powerful Ideas Need Love Too!

Alan Kay’s written remarks to a Joint Hearing of the Science Committee and the Economic and Educational and Opportunites Committee in October 1995.

How We Got To Now with Steven Johnson - YouTube

Steven Johnson’s new television series will be shown on BBC in a few months time. Looks like it’s going to be good Burkian fun.

Known: taking a big bet on the #indieweb

When I’ve been banging on at conferences about digital preservation, personal publishing and the indie web, I’ve been at pains to point out that there are huge opportunities here for startups looking to build valet services to help people publish on their own domain.

Ben and Erin at Known are doing just that, with some backing from KQED, PRX and the Knight Foundation instead of the usual short-sighted Silicon Valley venture capitalism.

One of the jobs of a startup is to look at where the world is going, extrapolating from current trends and domain knowledge, and meet a future need with a product at exactly the right time. We think the time is right for an independent web that is owned by content creators and readers alike.

Archeology, Anthropology, and Interstellar Communication edited by Douglas A. Vakoch

A free PDF download from NASA on all things SETI, specifically the challenges of interspecies interstellar communication.

Index cards | A Working Library

A truly wonderful piece by Mandy detailing why and how she writes, edits, and publishes on her own website:

No one owns this domain but me, and no one but me can take it down. I will not wake up one morning to discover that my service has been “sunsetted” and I have some days or weeks to export my data (if I have that at all). These URLs will never break.

Singularity&Co. — Save the Scifi!

The campaign to restore out-of-print pulp sci-fi books in electronic formats.

Bruce Lawson’s personal site  : Happy Birthday, BASIC

Bruce’s love letter to BASIC.

The closest I’ve ever come to that “a-ha!” moment I had when I first wrote something in BASIC was when I first wrote something in HTML.

Burying the URL - Allen Pike

Right now, this move to remove URLs from the interface of Chrome is just an experiment …but the fact that Google are even experimenting with it is very disturbing.

“Who? Me? No, I was never going to actually blow the web’s brains out—I just wanted to feel the heft of the weapon as I stroked it against the face of the web.”

What Comes Next Is the Future by Matt Braun

This has the potential to be a terrific little documentary. What say we get it funded?

Incomplete List of Mistakes in the Design of CSS [CSS Working Group Wiki]

I think I concur with this list. Although I guess it’s worth remembering that, given the size of the CSS spec, this isn’t an overly-long list.

It’s interesting that quite a few of them are about how things are named. It’s almost as if that’s one of the, say, two hardest things in computer science.

Data attributes and progressive enhancement - Simply Accessible

Derek’s excellent advice on avoiding over-reliance on data attributes has this brilliant nugget of insight:

In the web front-end stack — HTML, CSS, JS, and ARIA — if you can solve a problem with a simpler solution lower in the stack, you should. It’s less fragile, more foolproof, and just works

Responsive design testing tool – Viewport Resizer

A handy little bookmarklet for quickly checking how a site might look at different screen sizes, and you can customise it to use whichever screen sizes you like.

Learn CSS Selectors interactively

This visual approach to demonstrating how CSS selectors work is really handy.

Peter Nixey - How to be a great software developer

I’m not sure if I agree completely with every point, but this is a great shortlist of things you can do to make your code more resilient and understandable (thereby making you, by any sensible definition, a better programmer).

New product opportunities for the Internet of Normal Things | Berg Blog

I like Matt’s observation here that the simple combination of a barebones data format like HTML delivered over HTTP is a good-enough low-level API for joining up all kinds of internet-connected things.

In the last 60 years, the biggest software platform for interop and integration – for new products, services, businesses, and value creation – has not been Android, or iOS, or Windows, or the PDP-11. The biggest and best platform has been the web.

One implication is that successful products are not necessarily those with seamless, beautiful, tightly-controlled “experiences”, but rather the ones that are capable of talking to each other.

Small things, loosely joined.

James Bridle — Where You Are

The GPS system is a monumental network that provides a permanent “YouAreHere” sign hanging in the sky, its signal a constant, synchronised timecode.

Wearables versus there-ables.

Some interesting thoughts that follow on nicely from Scott Jenson’s ideas around just-in-time interactions:

What if the technology was actually already in the room when we got there? Maybe that’s the kind of Internet-of-things that will be more sustainable and will win long-term.

Avoiding ‘words to avoid’ | Inside GOV.UK

I love the thinking behind this plugin that highlights the weasel words that politicians are so found of.

Creating Style Guides · An A List Apart Article

A great article by Susan on getting started with creating a styleguide for any project.

I’ve seen firsthand how style guides save development time, make communication regarding your front end smoother, and keep both code and design consistent throughout the site.

Airbag Intl. / Archives

Greg says:

We need a web design museum.

I am, unsurprisingly, in complete agreement. And let’s make lots of copies while we’re at it.

Google Night Walk

A nice stroll around Marseilles at night without any of the traditional danger.

Hemingway

A useful text editor that analyses your writing for excess verbiage and sloppy construction. It helps you process your words, as it were.

The Pastry Box Project: The Values of the Web by Brad Frost

I don’t work in the tech industry. I work on the Web.

Readmill Epilogue - Readmill

If your startup gets acquired and shut down by a larger company, this is the way to announce it—no “we’re excited to announce”; no “incredible journey”. Instead there’s an apology and regret (which is exactly what your users will be feeling).

Confessions Of A CSS Expert

Funny because it’s true:

The thing I regret the most is how my class addiction affected my relationship with HTML.

A Modern Designer’s Canvas | Smashing Magazine

The transcript of Malarkey’s recent talk. Good thoughtful stuff.

Layout in Flipboard for Web and Windows — Flipboard Engineering

A fascinating look at how Flipboard combines art direction and algorithms to generate layouts.

Bruce Lawson’s personal site  : Notes on accessibility of Web Components

Bruce’s thoughts on ensuring accessibility in Web Components. He thinks that the vocabulary of ARIA is up to the job, so that’s good enough for me.

Aerotwist - Web Components and the Three Unsexy Pillars

A healthy dose of scepticism about Web Components, looking at them through the lenses of accessibility, security, and performance.

I share some of this concern: Web Components might look like handy ready-made out-of-the-box solutions, but the truth is that web developers have to do much more of the hard graft that was traditionally left to the browser.

Meet the Geniuses on a Quixotic Quest to Archive the Entire Internet | TIME.com

A short video featuring Jason Scott and Brewster Kahle. The accompanying text has a shout-out to the line-mode browser hack event at CERN.

[this is aaronland] because ephemera are just memories that didn’t try hard enough

I like the way Aaron thinks. I also like the way he makes.

Our Comrade The Electron

This is a wonderful piece by Maciej—a magnificent historical narrative that leads to a thunderous rant. Superb!

BBC Radio 4 Extra - The Hitchhiker’s Guide to the Galaxy - The Hitchhiker’s Guide to the Galaxy Game - 30th Anniversary Edition

One of the most fiendish user-unfriendly (but oh-so-witty) adventure games of all time is now online for you to enjoy with some added graphical flourishes.

Particle Fever

I can’t wait to see this documentary on the monumental work at CERN.

If the Moon Were Only 1 Pixel - A tediously accurate map of the solar system

A lovely visualisation that combines two of my loves: space, and the correct use of the subjunctive.

Node School in Brighton

Tom is running a Node School at 68 Middle Street on the evening of March 27th. I plan to attend and finally wrap my head around all this Node stuff.

4 Million Ravelers

A lovely bit of data celebration from Ravelry on the occasion of their 4 millionth user.

I’ve said it before and I’ll say it again: if you want to see a successful example of a real social networking site, don’t look at Facebook; look at Ravelry.

Platformed. — Unstoppable Robot Ninja

The importance of long-term thinking in web design. I love this description of the web:

a truly fluid, chaotic design medium serving millions of imperfect clients

Sharing Podcasts - daverupert.com

Great suggestions from Dave for podcasters keen on allowing easier sharing.

Oh, how I wish Soundcloud would do this and be less of an audio roach motel!

being a client (tecznotes)

Mike writes about what it was like being a client for a change. After working with him on the Code for America project, I can personally vouch for him as a dream client:

Clearleft’s pattern deliverables are the special-special that made the final work so strong. Jon Aizlewood’s introduction to the concept convinced me to contact Clearleft. Jeremy Keith’s interest in design systems kicked off the process, and Anna Debenham’s fucking rock star delivery brought it all home.

Jonathan T. Neal | Thoughts on Media Queries for Elements

Some good ideas on the idea of element-level media queries, a feature that developers are crying out for and browser makers are saying is too hard. This post has some thoughts on how to deal with the potential issues.

Why we left AngularJS: 5 surprisingly painful things about client-side JS

It’s funny: while I agree with the warning that this article provides (“rich client-side JavaScript frameworks aren’t a good fit for every site, especially content sites”), the reasons given here aren’t the reasons that I have any issues with.

22.7 Million Pixels Of Raw Slideshow Power

This may be the only slideshow on a website I’ve ever actually bothered to click all the way through.

Approaching Principles for Independent Archives | Equivalent Ideas

Thoughts from Luke Bacon on two topics that fascinate me: archives and design principles.

I’ve added these principles to my collection.

Robin Rendle › A Visual Lexicon

Some great thoughts in here about web development workflow and communication between designers and developers.

I believe that the solution is made up of a variety of tools that encourage conversation and improve our shared lexicon. Tools such as styleguides, pattern libraries, elemental and modular systems that encourage access not only by developers, but by designers, shareholders and editors as well.

Getting Started With Pattern Libraries ∙ An A List Apart Blog Post

A great post from Anna on the front-end styleguides she’s worked on for A List Apart and Code for America. ‘Twas a pleasure working with her on the Code for America project.

A-mer-ica! Fuck yeah!

Early History of HTML - 1990 to 1992

A fascinating look at the early history of HTML, tracing its roots from the dialect of SGML used at CERN.

Notes on a responsive Guardian redesign – Lozworld™

A great write-up of the design process behind The Guardian’s responsive site. It’s really gratifying to see UX designers talking about performance.

Play Steamshovel Harry, a free online game on Kongregate

Such a classic game, well worth playing again.

Kyle Bean - Whistleblower

If you picked up the Guardian this weekend, you’ll have seen some brilliant work by Kyle on the cover (and inside) the magazine section.

Best Collaborative Project : The Net Awards 2014

Well, this is nice: the Line-mode browser hack has been nominated in the Best Collaborative Project in the Net awards.

But 24 Ways has also been nominated, and let’s face it, that really is the best collaborative project.

A List Apart Pattern Library

Another front-end style guide for the collection. This time it’s from A List Apart. Lovely stuff!

Curiosity Hub

This nifty place in Brighton is just down the street from me:

Our classes allow kids to get creative with exciting, cutting-edge technology and software.

Operation War Diary

A collaboration between Zooniverse and the Imperial War Museum. Now citizen scientists can become citizen historians by classifying diaries from World War One.

Photography, hello — Software ate the camera, but freed the photograph by Craig Mod

Craig recently had a piece published in the New Yorker called Goodbye, Cameras. It’s good …but this follow-on piece on his own site is truly wonderful.

Read. Absorb. Ponder.

Being close to the network does not mean being on Facebook, thought it can mean that, too. It does not mean pushing low-res images to Instagram, although there’s nothing wrong with that. What the network represents, in my mind, is a sort of ledger of humanity. The great shared mind. An image’s distance to it is the difference between contributing or not contributing to that shared ledger.

Scrap Ideas — David Cole

David Cole shares the ideas for projects he would like to develop further, but probably never will. I like this a lot (and there are some great ideas in here).

The Console Living Room : Free Software : Download

Here’s a nice Christmas gift from Jason and the archinauts at the Internet Archive: tons of games for living room consoles of the early ’80s, all playable in your browser, thanks to emulation in JavaScript.

Frank Chimero × Blog × Homesteading 2014

I’m with Frank. He’s going Indie Web for 2014:

I’m returning to a personal site, which flips everything on its head. Rather than teasing things apart into silos, I can fuse different kinds of content together.

Homesteading instead of sharecropping:

So, I’m doubling down on my personal site in 2014.

WarGames Magazine Identified By Michael Walden

Now this is what I call research:

Through the use of my knowledge of computer magazines, my sharp eyes, and other technical knowledge, I have overcome the limited amount of information available in the video content of WarGames and with complete certainty identified the exact name and issue number of the magazine read on screen by David L. Lightman in WarGames.

About Variables in CSS and Abstractions in Web Languages | CSS-Tricks

Chris has a written a response to my post (which was itself inspired by his excellent An Event Apart presentation) all about CSS, variables, and abstractions.

I love this kind of old-school blog-to-blog discussion.

Spimes: A Happy Birthday Story « optional.is/required

Expanding on an exercise from last year’s Hackfarm, Brian and Mike have written a deliciously dystopian near-future short story.

Happy 17th Birthday CSS | Web Directions

A lovely history lesson on CSS from John.

Myth - CSS the way it was imagined.

This looks interesting: a CSS postprocessor that polyfills support for perfectly cromulent styles.

Earth wind map

A beautiful real-time visualisation of winds on our planet.

Brian Aldiss: ‘These days I don’t read any science fiction. I only read Tolstoy’ | Books | The Guardian

A profile of Brian Aldiss in The Guardian.

I still can’t quite believe I managed to get him for last year’s Brighton SF.

Flickr: The British Library’s Photostream

This is a wonderful addition to the already-wonderful Flickr Commons: over one million pictures from the British Library, available with liberal licensing.

Y’know, I’m worried about what will happen to my own photos when Flickr inevitably goes down the tubes (there are still some good people there fighting the good fight, but they’re in the minority and they’re battling against the douchiest of Silicon Valley managerial types who have been brought in to increase “engagement” by stripping away everything that makes Flickr special) …but what really worries me is what’s going to happen to Flickr Commons. It’s an unbelievably important and valuable resource.

Hackfarm- One Week, a Dozen Projects, 20 “Lefties”

Ant—the latest super-smart addition to the Clearleft team—describes this year’s Hackfarm, which happened a couple of weeks ago.

It was Ant’s first week. Or, as he described it when we were wrapping up all the hacking, “Best first week at a job ever!”

An Hour of Code spawns hours of coding

Here’s a heartwarming tale. It starts out as a description of processing.js project for Code Club (which is already a great story) and then morphs into a description of how anyone can contribute to make a codebase better …resulting in a lovely pull request on Github.

The (other) Web we lost

John shares his concerns about the increasing complexity involved in developing for the web.

Building for the device agnostic web | Talks | Decade City

Some excellent practical advice on progressive enhancement.

Unify – Unicode support on browsers and devices

Some excellent research for web developers: find out which unicode characters have the widest support—release useful for choosing icons.

Proto HTML

A nice bit of markup archeology, tracing the early development of HTML from its unspecced roots to the first drafts.

I recognise some of the extinct elements from the line-mode browser hack days at CERN e.g. HP1, HP2, ISINDEX, etc.

Against the Balkanization of the Web

A fascinating snapshot from 1995, arguing for the growing power of HTML instead of the siren song of proprietary formats.

I’m very happy that this is still available to read online 18 years later.

Laying The Groundwork For Extensibility—Smashing Coding

The authors of the Extensible Web Manifesto explain the thinking behind their …uh… thinking.

There’s a lot to like here, with some practical examples of where we’ve seen a disconnect between JavaScript APIs and declarative HTML (looking at you, Geolocation).

Star Axis is a profound meditation on the sky – Ross Andersen – Aeon

A beautiful exploration of the Star Axis sculpture—an artwork of the Long Now.

The ancients had pyramids to tame the sky’s mystery. We have Star Axis, a masterpiece forty years in the making.

Long Term Web Semantics on Infrequently Noted

Alex starts with a bit of a rant about the phrase “semantic HTML”, which should really just be “well-written HTML, but there then follows some excellent thoughts on the emergence of meaning and the process of standardising on vocabularies.

Prerender - AngularJS SEO, BackboneJS SEO, or EmberJS SEO

I despair sometimes.

Here’s a ridiculous Heath-Robinsonesque convoluted way of getting the mighty all-powerful Googlebot to read the web thangs you’ve built using the new shiny client-side frameworks like Angular, Ember, Backbone…

Here’s another idea: output your HTML in HTML.

That solution works for machines and humans. As a bonus, outputting your HTML in HTML avoids turning JavaScript into a single point of failure.

isMobileDevice and the death of innocence

A nice bit of sleuthing to trace the provenance of one piece of ill-advised user-agent sniffing JavaScript code.

Good luck getting that script updated for the thousands of sites and applications, you say to yourself, where it’s laying dormant just waiting to send devices the wrong content based on a UA substring.

A Book Apart, New store discounts and bundle options

This is a great idea from A Book Apart—the more different books you buy at the same time, the more of a discount you get.

Got to get ‘em all!

Styleguide | MapBox

Hot on the heels of the Mailchimp styleguide, here’s the collection of patterns used by Mapbox. I’m not keen on some of their markup choices, but again, it’s great to see organisations publicly documenting this stuff.

Pattern Library | MailChimp

The markup for the patterns that Mailchimp use on their products. I love getting a glimpse of how companies handle this kind of stuff internally.

cite and blockquote – reloaded | HTML5 Doctor

The definition of the cite element (and the blockquote element) has been changed for the better in HTML5 …at least in the W3C version anyway.

Wallop Slider

I hate carousels, but if you’re going to have one, this progressively enhanced approach looks pretty good.

Steve & Steve: a graphic novel by Patrick Sean Farley

This is absolutely delightful, nicely weird, and thoroughly entertaining.

Moving in, moving on — Paul Robert Lloyd

I’m going to miss having Paul around at Clearleft …and it sounds like he’s going to miss us too.

In many respects, Clearleft can be regarded as a family. Andy and Rich are the parents while perhaps Jeremy is the fun uncle sending postcards from his adventures around the world.

By the way, we’re hiring (two roles, because that’s what it’ll take to fill Paul’s unicorn shoes).

Line Mode on Parallel Transport

A love letter to HTML, prompted by the line-mode browser hack event at CERN.

What is EME?

Henri gives an overview of the DRM-style encryption proposed for HTML. It’s a very balanced unbiased description, but if you have the slightest concern about security, sentences like this should give you the heebie-jeebies:

Neither the browser nor the JavaScript program understand the bytes.

Web App Source Code Protection Community Group

This is the worst idea for a W3C community group ever. Come to think of it, it’s the worst idea for an idea ever.

The hits keep going… | MetaFilter

This gives me a warm fuzzy glow. The Mefites are using Radio Free Earth to find out which stars are receiving the number one hits from their birthdays.

Star Wars: Endor Holocaust

Realistically, what happens when you detonate a large metallic satellite (about the the size of the second Death Star) in orbit around an inhabited world (like, say, the forest moon of Endor).

It isn’t pretty.

Robert Cailliau’s world wide web on Dazed Digital

From CERN to singularity - the digital pioneer and cofounder of the WWW on 20 years of webscapades.

Internet and Web Pioneers: Robert Cailliau - YouTube

Once you get past the cheesy intro music, there are some gems from Robert Cailliau in here.

Smart Quotes for Smart People

Jason provides some instruction in using the correct quotation marks online.

LMB hack days: Jeremy Keith

I took a little time out of the hacking here at CERN to answer a few questions about the line-mode browser project.

UX Career Advice – User Experience

Speakers from this year’s UX Week conference provide career advice. I think my advice is clearly the best:

To be successful in today’s industry, UX professionals should have really killer paisley shirts. Some people will tell you that it’s more important to have good hair and straight teeth, but in my experience, a really good paisley shirt will really take you places.

68 Middle Street launch and Clearleft 8th birthday party - a set on Flickr

Some lovely pictures from the Clearleft office-warming party last weekend.

Clearleft families

Explorers of the combined territory.

Inspired by dConstruct, Ellen is going to start exploring the world of smart objects.

Ask About Going Home

Some examples to illustrate the UK Border Agency’s latest campaign.

Shinseungback Kimyonghun: Portrait

Beautiful amalgamations of film characters:

A custom software detects faces from every 24 frames of a movie, and creates an average face of all found faces. The composite image reflects the centric figure(s) and the visual mood of the movie.

WTF Visualizations

Data visualisations that make no sense.

Progressive Enhancement. Still Alive and Kickin’

Dan explains the reasoning behind his “Sigh, JavaScript” Tumblr blog, and provides an excellent example of progressive enhancement in the process.

Go, Dan, go!

Enabling new types of web user experiences - W3C Blog

Scott gives us an excellent State Of The Web address, looking at how the web can be central to the coming age of ubiquitous computing. He rightly skips through the imitation of native apps and gets down to the potential of just-in-time interactions.

Simon Stålenhag Art Gallery

Scenes from a future Sweden.

The Twittertape Machine

I would love to have a ticker-tape machine for my tweets.

PRSM - The Sharing Network

Don’t ever worry about not sharing again.

Blogging Ourselves to Live

The internet never forgets? Bollocks!

We were told — warned, even — that what we put on the internet would be forever; that we should think very carefully about what we commit to the digital page. And a lot of us did. We put thought into it, we put heart into, we wrote our truths. We let our real lives bleed onto the page, onto the internet, onto the blog. We were told, “Once you put this here, it will remain forever.” And we acted accordingly.

This is a beautiful love-letter to the archival web, and a horrifying description of its betrayal:

When they’re erased by a company abruptly and without warning, it’s something of a new-age arson.

Should JavaScript devs build real things?

This post is about the pros and cons of using JavaScript to programme hardware, but within it is a great summation of what makes JavaScript so powerful:

In my opinion the greatest strengths of JavaScript are its immediacy and its accessibility. It has plenty of weakness (insanely weak typing, implicit casting for comparison, terrible problems with numbers, fluid syntax, I could go on…). Regardless, these weaknesses are entirely overcome by those two points above.

Having taught quite a few people to code, the benefit of being able to open a text editor or a browser console and type code that can immediately and reliably be executed is incredible. The power this brings to the learner is unmatched. When trying to learn new things it’s important to get positive reinforcement very quickly and JavaScript has this ability in spades.

Executing console.log(“hello world”) or window.alert(2+5-20) brings immediate feedback, makes you feel as though you’re getting somewhere and that you are interacting directly with the computer as a programmer. For those of you old enough to own a Spectrum, C64 or Vic20 – BASIC (itself heavily derided) had the same benefit.

Bruce Lawson’s personal site  : On citing quotations. Again.

The semantics of the cite element are up for discussion again. Bruce, like myself, still thinks that we should be allowed to mark up names with the cite element (as per HTML 4), and also that cite elements should be allowed inside blockquotes to indicate the source of the quote.

Let’s pave that cowpath.

When politicians get the internet wrong, the internet can be ruthless by Caroline Criado-Perez

Oh, dear. An otherwise perfectly well-reasoned article makes this claim:

But the internet is peculiarly adapted to deftly pricking pomposity. This is partly because nothing dies online, meaning your past indiscretions are never yesterday’s news, wrapped round the proverbial fish and chips.

Bollocks. Show me the data to back up this claim.

The insidious truism that “the internet never forgets” is extremely harmful. The true problem is the opposite: the internet forgets all the time.

Geocities, Pownce, Posterous, Vox, and thousands more sites are very much yesterday’s news, wrapped round the proverbial fish and chips.

SVG and image tag tricks

A very, very clever hack to provide fallback images to browsers that don’t support SVG. Smart.

The Killing Machines by Mark Bowden in The Atlantic

How to think about drones—an in-depth and fairly balanced article by Mark Bowden on drone strikes and the politics behind them.

In the long run, careful adherence to the law matters more than eliminating another bad actor. Greater prudence and transparency are not just morally and legally essential, they are in our long-term interest, because the strikes themselves feed the anti-drone narrative, and inspire the kind of random, small-scale terror attacks that are bin Laden’s despicable legacy.

Paris Review – “One Murder Is Statistically Utterly Unimportant”: A Conversation with Warren Ellis, Molly Crabapple

Molly Crabapple interviews Warren Ellis. Fun and interesting …much like Molly Crabapple and Warren Ellis.

The creation of Missile Command and the haunting of its creator, Dave Theurer

The story behind the classic arcade game Missile Command and the toll it took on its creator:

Theurer’s constant strides for perfection left him working his body to the point that Missile Command’s premise started to manifest itself in his subconscious, sneaking into his dreams and turning them to nightmares.

There was something about the sound of those explosions, the feeling of the trackball in your hand, and the realisation that no matter how well you played, you could only delay the inevitable.

THE END

Life Inside Brewster’s Magnificent Contraption « ASCII by Jason Scott

A beauty of a post by Jason giving you even more reasons to donate to Archive.org.

Seriously. Do it now. It would mean a lot to me.

Related: I’m going to be in San Francisco next week and by hook or by crook, I plan to visit the Internet Archive’s HQ.

Why a New Golden Age for UI Design Is Around the Corner

A state of the connected union address, with soundbites from smart people in the world of ubicomp, internet of things, everyware, or whatever it is we’re calling it now.

Technical Machine

This looks rather exciting: Tessel is Rasperry Pi-like piece of hardware, but running JavaScript (Node.js) by default.

Human Interest by Trent Walton

Trent proposes a way to avoid implementing dark patterns: take a leaf from the progressive enhancement playbook and assume the worst conditions for your user’s context.

Surfin’ Safari - Blog Archive » Improved support for high-resolution displays with the srcset image attribute

WebKit nightlies now have support for srcset. I’m pleased to see that it’s currently constrained to just handling the case of high-density displays; it doesn’t duplicate the media query functionality of picture.

I’ve always maintained that the best solution to responsive images will be some combination of srcset and picture: they each have their strengths and weaknesses. The “art direction” use case is better handled by picture, but the “retina” use case is better handled by srcset.

EIRE signs of WW II | GPS of the past

A fascinating project to document markings from 1939—designed to be visible from the air—placed all around the Irish coast.

Kids can’t use computers… and this is why it should worry you - Coding 2 Learn

This is a really well-written and worrying piece that pokes at that oft-cited truism about kids today being “digital natives”:

The parents seem to have some vague concept that spending hours each evening on Facebook and YouTube will impart, by some sort of cybernetic osmosis, a knowledge of PHP, HTML, JavaScript and Haskell.

The causes of this lack of digital literacy can be traced back to school:

We’ve mirrored corporate networks, preventing kids and teachers access to system settings, the command line and requiring admin rights to do almost anything. They’re sitting at a general purpose computer without the ability to do any general purpose computing.

Also, this article has the best “TL;DR” description ever.

A Breathing Earth

Beautiful animated GIFs showing the lungs of our planet.

Reflections on An Event Apart DC 2013

Jason pulls together some of the themes that emerged at An Event Apart DC this week.

Design Jargon Bullshit

Fodder for a Markov chain.

Unmoored

James re-imagines the Barbican as an airship drifting free of central London.

We Need More Communism by Scott Jenson

A terrific lighting talk by Scott on the need to think bigger. The solution to long-term issues is rarely “start a company”—we need to think more about creating a shared infrastructure …just like the internet.

LukeW | An Event Apart: The Long Web

Luke’s notes from my talk at An Event Apart DC.

Sketchnotes: The Long Web

Jason Garber took some nicely-hyperlinked notes during my presentation at An Event Apart DC.

Not Real Programming by John Allsopp

A terrific long-zoom look at web technologies, pointing out that the snobbishness towards declarative languages is a classic example of missing out on the disruptive power of truly innovative ideas …much like the initial dismissive attitude towards the web itself.

Crippling the web - TimKadlec.com

A great call-to-arms from Tim, simply asking that we create websites that take advantage of the amazing universality of the web:

The web has the power to go anywhere—any network, any device, any browser. Why not take advantage of that?

Inevitably there is pushback in the comments from developers still in the “denial” stage of coming to terms with what the web is.

Inge Druckrey: Teaching to See on Vimeo

Sit back, relax, and enjoy this classic documentary on graphic design, courtesy of its producer Edward Tufte.

RIP, Change.gov

This is why the Internet Archive matters. It is now the public record of Obama’s broken promise to protect whistleblowers.

I feel very bad for the smart, passionate, talented people who worked their asses off on change.gov, only to see their ideals betrayed.

NSA: The Decision Problem by George Dyson

A really terrific piece by George Dyson taking a suitably long-zoom look at information warfare and the Entscheidungsproblem, tracing the lineage of PRISM from the Corona project of the Cold War.

What we have now is the crude equivalent of snatching snippets of film from the sky, in 1960, compared to the panopticon that was to come. The United States has established a coordinated system that links suspect individuals (only foreigners, of course, but that definition becomes fuzzy at times) to dangerous ideas, and, if the links and suspicions are strong enough, our drone fleet, deployed ever more widely, is authorized to execute a strike. This is only a primitive first step toward something else. Why kill possibly dangerous individuals (and the inevitable innocent bystanders) when it will soon become technically irresistible to exterminate the dangerous ideas themselves?

The proposed solution? That we abandon secrecy and conduct our information warfare in the open.

100,000 Stars

A gorgeous interactive visualisation of our local galactic neighbourhood.

The slippery slope | 90 Percent Of Everything

The transcript of a terrific talk by Harry on how dark patterns are often driven by a slavish devotion to conversion rates.

Responsive design: we are not there yet

A call for developers to let standards bodies know what we want:

It is important that we as developers focus on the right things again. If you encounter a bug, you should not only fix it for your site; you should reach out to browser vendors and web standards people to fix this in a long-term solution. It might cost you a few minutes, but brings a lot of improvement to the whole developer community.

Installable Webapps: Extend the Sandbox by Boris Smus

This a great proposal: well-researched and explained, it tackles the tricky subject of balancing security and access to native APIs.

Far too many ideas around installable websites focus on imitating native behaviour in a cargo-cult kind of way, whereas this acknowledges addressability (with URLs) as a killer feature of the web …a beautiful baby that we definitely don’t want to throw out with the bathwater.

Style Guide Boilerplate

A very handy starting point for creating a front-end style guide.

‘Kitten kitten kitten kittens’, Medium & TED(x) and RSSing since 2003.

Dan’s blog is rapidly turning into one of my favourite destinations on the web.

I hope he comes to an Indie Web Camp.

The Problem With Medium

A good article on Medium on Medium.

A few words on Doug Engelbart

A beautiful eulogy for Doug Engelbart by Bret Viktor, not celebrating the laundry list of his inventions, but celebrating his intent in making the world a better place.

Engelbart had an intent, a goal, a mission. He stated it clearly and in depth. He intended to augment human intellect. He intended to boost collective intelligence and enable knowledge workers to think in powerful new ways, to collectively solve urgent global problems.

Designers’ Friend

I kind of love the interaction design of this site.

Lockdown – Marco.org

A superb piece by Marco Arment prompted by the closing of Google Reader. He nails the power of RSS:

RSS represents the antithesis of this new world: it’s completely open, decentralized, and owned by nobody, just like the web itself. It allows anyone, large or small, to build something new and disrupt anyone else they’d like because nobody has to fly six salespeople out first to work out a partnership with anyone else’s salespeople.

And he’s absolutely on the money when he describes what changed:

RSS, semantic markup, microformats, and open APIs all enable interoperability, but the big players don’t want that — they want to lock you in, shut out competitors, and make a service so proprietary that even if you could get your data out, it would be either useless (no alternatives to import into) or cripplingly lonely (empty social networks).

I share his anger.

Well, fuck them, and fuck that.

Progressive Enhancement: Still Not Dead. - That Emil

A great post by Emil on the importance of using progressive enhancement for JavaScript — an increasingly unpopular position in today’s climate of client-side-only frameworks and libraries.

There’s something fundamental and robust about being able to request a URL and get back at least an HTML representation of the resource: human-readable, accessible, fault tolerant.

Nearby - Wikipedia, the free encyclopedia

I sense the hand of Tom Morris in this. Wikipedia has created a “nearby” page for browsers with geolocation, much like the Wikinear mashup that Simon created with Fire Eagle five years ago.

Enough with the JavaScript already!

A great set of slides from Nicholas, all about the disturbing trend in “modern” web apps to depend entirely on JavaScript as a single point of failure.

Hot Topics Panel with Jeremy Keith - Mobilism 2013, Day 2, Afternoon, Final session on Vimeo

The closing hot topics panel I moderated at this year’s Mobilism conference in Amsterdam, featuring Remy, Wilto, Jake, and Dan.

Why the Web Doesn’t Need Another CSS Zen Garden - YouTube

A great history lesson from Dave.

Ah, I remember when the CSS Zen Garden was all fields. Now get off my CSS lawn.

B612 Foundation

Defending Earth against asteroids, just like the Spaceguard organisation described in Rendezvous With Rama.

Detect. Deflect. Defend.

Web Fonts and the Critical Path - Ian Feather

The battle between web fonts and performance. Ian Feather outlines some possible solutions, but of course, as always, the answer is “it depends”.

‘Kitten kitten kitten kittens’ — I.M.H.O. — Medium

This is what Medium is for.

If you want to read some of Dan Catt’s lesser thoughts, he has his own blog.

The Motherfuton News

Pretty motherfuton funny.

Improving Reality 2013

The line-up for this year’s Improving Reality conference looks great (as always).

It’s the day before dConstruct so why not come on down to Brighton a day early and double your fun?

DRM and HTML5: it’s now or never for the Open Web

Dr Harry Halpin writing in the Guardian about the crucial crossroads that we have reached with the very real possibility of DRM mechanisms becoming encoded within HTML:

Most of us are simply happy to launch our browsers and surf the web without a second thought as to how the standards like HTML are created. These standards are in the hands of a fairly small set of standards bodies that have in general acted as responsible stewards for the last few years. The issue of DRM in HTML may be the turning point where all sorts of organisations and users are going to stop taking the open web for granted.

Is Google dumping open standards for open wallets?

Google’s track record is not looking good. There seems to be a modus operandi of bait-and-switch: start with open technologies (XMPP, CalDav, RSS) and then once they’ve amassed a big enough user base, ditch the standards.

Leveraging Advanced Web Features in Responsive Design

A terrific case study in progressive enhancement: starting with a good ol’ form that works for everybody and then adding on features like Ajax, SVG, the History API …the sky’s the limit.

The Internet of Actual Things on The Morning News

A vision of neurotic network-enabled objects, as prototyped by dConstruct speaker Simone Rebaudengo.

What’s Holding Up The Internet Of Things

This echoes what Scott Jenson has been saying: the current trend with connected devices is far too reliant on individual proprietary silos instead of communicating with open standards.

So instead of talking directly to one another, devices on today’s nascent Internet of Things now communicate primarily with centralized servers controlled by a related developer or vendor. That works, after a fashion, but it also leads to a bunch of balkanized subnetworks in which devices can communicate perfectly well with each other - but can’t actually talk to devices on any other balkanized subnetwork.

Silicon Valley through a PRISM · Ben Ward

Ben is rightly worried by the blasé attitude in the tech world to the PRISM revelations. Perhaps that attitude stems from a culture of “log everything by default”?

I think there’s a deep rooted trait within this industry that sedates the outrage. That is the normality, complicity, and dependency on ‘surveillance’ in the software we make.

Jeremy Keith - What We Talk About When We Talk About The Web on Vimeo

My presentation from the Industry conference in Newcastle a little while back, when I stepped in for John Allsopp to deliver the closing talk.

The New Aesthetic: James Bridle’s Drones and Our Invisible, Networked World in Vanity Fair

James gets profiled in Vanity Fair …which is, frankly, kind of weird.

It’s also so bizarre to read about his SXSW New Aesthetic panel as being such a pivotal moment: there weren’t that many of us in the room.

The Extensible Web Manifesto

An intriguing initiative to tighten up the loop between standards development and implementation.

Request Quest

A terrific quiz about browser performance from Jake. I had the pleasure of watching him present this in a bar in Amsterdam—he was like a circus carny hoodwinking the assembled geeks.

I guarantee you won’t get all of this right, and that’s a good thing: you’ll learn something. If you do get them all right, either you are Jake or you are very, very sad.

The thing and the whole of the thing: on DRM in HTML

A great post by Stuart on the prospect of DRM-by-any-other-name in HTML.

The argument has been made that if the web doesn’t embrace this stuff, people won’t stop watching videos: they’ll just go somewhere other than the web to get them, and that is a correct argument. But what is the point in bringing people to the web to watch their videos, if in order to do so the web becomes platform-specific and unopen and balkanised?

James Somers – Web developer money

A well-written piece on the nature of work and value on the web, particularly in the start-up economy.

Deep dive into the murky waters of script loading

Jake casts a scrutinising eye over the way that browsers load and parse scripts …and looks at what we can do about it.

Auto-Forwarding Carousels, Accordions Annoy Users

Carousels are shit. Auto-animating carousels are really shit. Now proven with science!

2001: A Space Odyssey

A really nice piece on Robert McCall, who was artist-in-residence at NASA and worked as conceptual artist on Kubrick and Clarke’s 2001: A Space Odyssey.

Advancements in the accessibility of Facebook on Marco’s accessibility blog

It’s great to see the changes that Facebook’s four-person accessibility team have managed to push through.

Exquisite Tweets from @genmon, @kellan, @anildash

I need to get Matt to an Indie Web Camp.

Break the Page

A lovely site with thoughtful articles on the long-term future of the web.

There’s audio too, which is unfortunately locked up in the unhuffduffable roach motel that is Soundcloud, but I’m hoping that might change.

Building the Great Libraries of the Internet with a DNS time machine by Ben Ward

Ben proposes an alternative to archive.org: changing the fundamental nature of DNS.

Regarding the boo-hooing of how hard companies have it maintaining unprofitable URLs, I think Ben hasn’t considered the possibility of a handover to a cooperative of users—something that might yet happen with MySpace (at least there’s a campaign to that effect; it will probably come to naught). As Ben rightly points on, domain names are leased, not bought, so the idea of handing them over to better caretakers isn’t that crazy.

The irregular musings of Lou Montulli: The reasoning behind Web Cookies

A fascinating look at the history of cookies …from the inventor of cookies.

Laurent Eschenauer: What’s next Google? Dropping SMTP support?

The litany of open standards that Google has been abandoning: RSS, XMPP, WebDav…

The $12 Gongkai Phone

A fascinating analysis of a super-cheap phone from another world.

Welcome to the Galapagos of Chinese “open” source. I call it “gongkai” (公开). Gongkai is the transliteration of “open” as applied to “open source”. I feel it deserves a term of its own, as the phenomenon has grown beyond the so-called “shanzhai” (山寨) and is becoming a self-sustaining innovation ecosystem of its own.

Just as the Galapagos Islands is a unique biological ecosystem evolved in the absence of continental species, gongkai is a unique innovation ecosystem evolved with little western influence, thanks to political, language, and cultural isolation.

You should write about yourself more

Yes! Yes! YES!

Tom is spot-on here: you shouldn’t be afraid of writing about yourself …especially not for fear of damaging some kind of “personal brand” or pissing off some potential future employer.

If your personal brand demands that you live your life in fear of disclosing important parts of your life or your experience, the answer is to reject the whole sodding concept of personal brands.

Do things I write about my personal life threaten my personal brand? Perhaps. Are there people who wouldn’t hire me based on things I write? Probably. Do I give even a whiff of a fuck? Absolutely not. I wouldn’t want to work for them anyway.

Teenage Diaries Revisited

Fascinating fodder for Huffduffer:

Beginning in 1996, Radio Diaries gave tape recorders to teenagers around the country to create audio diaries about their lives. NPR’s All Things Considered aired intimate portraits of five of these teens: Amanda, Juan, Frankie, Josh and Melissa. They’re now in their 30s. Over this past year, the same group has been recording new stories about where life has led them for our series, Teenage Diaries Revisited.

CSS is not an amoral monster.

I’m in general agreement with this rousing defence of CSS. I think it does a pretty great job of balancing a whole ton of use cases.