Link archive: February, 2017

Edge of darkness: looking into the black hole at the heart of the Milky Way | Science | The Guardian

Building a planet-sized telescope suggests all sorts of practical difficulties.

Social Media Needs A Travel Mode (Idle Words)

We don’t take our other valuables with us when we travel—we leave the important stuff at home, or in a safe place. But Facebook and Google don’t give us similar control over our valuable data. With these online services, it’s all or nothing.

We need a ‘trip mode’ for social media sites that reduces our contact list and history to a minimal subset of what the site normally offers.

CSS and progressive enhancement | justmarkup

A nice look at the fallbacks that are built into CSS.

Get started with variable fonts – Medium

Rich has posted a sneak peek of one part of his book on Ev’s blog.

The Five-Tool Designer » Mike Industries

Mike lists five tool skills he looks for in a designer (not that every designer needs to have all five):

1. Visual Design & Animation
2. Interaction Design
3. Getting Things Done
4. Teamwork
5. Leadership

Swap the first one out for some markup and CSS skills, and I reckon you’ve got a pretty good list for developers too.

Flatris

Tetris in your browser. Visit it once and it works offline (if your browser supports service workers) so go ahead and add it to your home screen.

Send messages when you’re back online with Service Workers and Background Sync – Twilio Cloud Communications Blog

This example of using background sync looks like it’s specific to Twilio, but the breakdown of steps is broad enough to apply to many situations:

On the page we need to:

1. Register a Service Worker
2. Intercept the “submit” event for our message form
3. Place the message details into IndexedDB, an in browser database
4. Register the Service Worker to receive a “sync” event

Then, in the Service Worker we need to:

1. Listen for sync events
2. When a sync event is received, retrieve the messages from IndexedDB
3. For each message, send a request to our server to send the message
4. If the message is sent successfully, then remove the message from IndexedDB

And that’s it.

kamranahmedse/design-patterns-for-humans: Design Patterns for Humans™ - An ultra-simplified explanation

I’m crap at object-oriented programming (probably because I don’t get get enough practice), but I’ve had a quick read through this and it looks like a nice clear primer. I shall return and peruse in more depth next time I’m trying to remember how to do all this class-based stuff.

ongoing by Tim Bray · Geek Career Paths

Tim Bray lists the options available to a technically-minded person thinking about their career path …but doesn’t mention the option of working at an agency.

Some good long-zoom observations in here:

The bad news that it’s a lot of work. We’re a young pro­fes­sion and we’re still work­ing out our best prac­tices, so the ground keeps chang­ing un­der you; it doesn’t get eas­i­er as the decades go by.

The good news is that it doesn’t get hard­er ei­ther. Once you learn to stop ex­pect­ing your knowl­edge to stay fresh, the pace of in­no­va­tion doesn’t feel to me like it’s much faster (or slow­er) now than it was in 1987 or 1997 or 2007. More good news: The tech­nol­o­gy gets bet­ter. Se­ri­ous­ly, we are so much bet­ter at build­ing soft­ware now than we used to be in any of those oth­er years end­ing in 7.

Functional Minimalism for Web Design

According to this, the forthcoming Clearleft redesign will be totally on fleek.

[this is aaronland] fault lines — a cultural heritage of misaligned expectations

When Aaron talks, I listen. This time he’s talking about digital (and analogue) preservation, and how that can clash with licensing rules.

It is time for the sector to pick a fight with artists, and artist’s estates and even your donors. It is time for the sector to pick a fight with anyone that is preventing you from being allowed to have a greater — and I want to stress greater, not total — license of interpretation over the works which you are charged with nurturing and caring for.

It is time to pick a fight because, at least on bad days, I might even suggest that the sector has been played. We all want to outlast the present, and this is especially true of artists. Museums and libraries and archives are a pretty good bet if that’s your goal.

Open Access at ESA

Images, videos, sounds, and 3D models are now available from the European Space Agency under a Creative Commons Attribution Share-alike license.

This Week in the IndieWeb Podcast by Marty McGuire

What an excellent idea! A weekly round-up in audio form of indie web and homebrew website news. Nice and short.

Chris is huffduffing it too.

The Secret History of Hypertext - The Atlantic

The latest excellent missive from The History Of The Web—A Brief History of Hypertext—leads back to this great article by Alex Wright on Paul Otlet’s Mundaneum.

Do we need a new heading element? We don’t know - JakeArchibald.com

Jake is absolutely spot-on here. There’s been a lot of excited talk about adding an h element to HTML but it all seems to miss the question of why the currently-specced outline algorithm hasn’t been implemented.

This is a common mistake in standards discussion — a mistake I’ve made many times before. You cannot compare the current state of things, beholden to reality, with a utopian implementation of some currently non-existent thing.

If you’re proposing something almost identical to something that failed, you better know why your proposal will succeed where the other didn’t.

Jake rightly points out that the first step isn’t to propose a whole new element; it’s to ask “Why haven’t browsers implemented the outline for sectioned headings?”

(I added a small historical note in the comments pointing to the first occurrence of this proposal way back in 1991.)

162 WP-Tonic: Jeremy Keith on Resilient Web Design | WordPress podcast

A podcast chat in which I ramble on about web stuff.

Huffduffed for your convenience.

On Design Tools and Processes | Viljami Salminen

Changing our ways of thinking and doing isn’t easy. Sometimes it’s necessary though, and the first step on this journey is to let go. Let go of our imagi­nary feel of control. Forget the boundaries presented by our tools and ways of thinking. Break out of the silos we’ve created.

Base64 Encoding & Performance, Part 1: What’s Up with Base64?

Harry clearly outlines the performance problems of Base64 encoding images in stylesheets. He’s got a follow-up post with sample data.

PWABuilder

A useful tool to help you generate a manifest file, icons, and a service worker for your progressive web appsite.

These Boots Aren’t Made for Walking – Pixelingo Love

Carolyn is amazing. And you can support her.

Stateside Super 8 on Vimeo

Ben made a music video of the recent Clearleft outing to New York.

The average web page from top twenty Google results

Ever wondered what the most commonly used HTML elements are?

Principles of Web Development · Jens Oliver Meiert

Some proposed design principles for web developers:

1. Focus on the User
2. Focus on Quality
3. Keep It Simple
4. Think Long-Term (and Beware of Fads)
5. Don’t Repeat Yourself (aka One Cannot Not Maintain)
6. Code Responsibly
7. Know Your Field

Be More Careful on Facebook | Incisive.nu

Much of our courage and support comes from the people we read and talk to and love online, often on the very networks that expose us—and our friends—to genuine enemies of freedom and peace. We have to keep connected, but we don’t have to play on their terms.

Winston Churchill’s essay on alien life found : Nature News & Comment

Churchill, as it turns out, had some pretty solid ideas on SETI.

Churchill was a science enthusiast and advocate, but he also contemplated important scientific questions in the context of human values. Particularly given today’s political landscape, elected leaders should heed Churchill’s example: appoint permanent science advisers and make good use of them.

CSS Beating Heart Tutorial. – Cassie Codes

A sweet CSS tutorial that Cassie put together for the Valentine’s Day Codebar.

Discovering Resilient Web Design with Jeremy Keith

In which I attempt to answer some questions raised in the reading of Resilient Web Design.

Accessibility and Performance | MarcySutton.com

When I heard about Universal JavaScript apps (a.k.a. isomorphic JavaScript), despite the “framework hotness”, I saw real value for accessibility and performance together. With this technique, a JavaScript app is rendered as a complete HTML payload from the server using Node.js, which is then upgraded as client resources download and execute. All of a sudden your Angular app could be usable a lot sooner, even without browser JS. Bells started going off in my head: “this could help accessible user experience, too!”

An Introduction to the Reduced Motion Media Query | CSS-Tricks

A new media query that will help prevent you making your users hurl.

Interneting Is Hard | Web Development Tutorials For Complete Beginners

A nice straightforward introduction to web development for anyone starting from scratch.

Decovar: A multistyle decorative variable font by David Berlow

Here’s one of them new-fangled variable fonts that’re all the rage. And this one’s designed by David Berlow. And it’s free!

Performance Under Pressure - performance, responsive web design - Bocoup

The transcript of a really great—and entertaining—talk on performance by Wilto. I may have laughed out loud at points.

Fluid Paint

The texture here is shockingly realistic.

The History of the Web - The best stories from the web’s history

What a great project! A newsletter that focuses on stories from the web’s history, each one adding to an ongoing timeline (a bit like John’s hypertext history).

Most of the web really sucks if you have a slow connection

Just like many people develop with an average connection speed in mind, many people have a fixed view of who a user is. Maybe they think there are customers with a lot of money with fast connections and customers who won’t spend money on slow connections. That is, very roughly speaking, perhaps true on average, but sites don’t operate on average, they operate in particular domains.

Polyfills and the evolution of the web - TAG finding

Really good advice for anyone thinking of releasing a polyfill into the world.

read.isthe.link

Here’s a nice little service from Remy that works sorta like Readability. Pass it a URL in a query string and it will generate a version without all the cruft around the content.

The Computational Foundation of Life | Quanta Magazine

Philip Ball certainly has a way with words.

Tuna - Typeface

I like the feel of this typeface a lot.

Bubbling, strong, but very accurate.

Legal Advice Forum for EU/EEA Nationals Tickets, Thu, 16 Mar 2017 at 18:30 | Eventbrite

Are you an EU/EEA national living in the UK? Worried about your rights and options post-Brexit?

Alex has an organised an event at 68 Middle Street for March 16th with an immigration advisor, The £5 ticket fee is refundable after the event or you can donate it to charity.

The Problem With AMP | 80x24

The largest complaint by far is that the URLs for AMP links differ from the canonical URLs for the same content, making sharing difficult. The current URLs are a mess.

This is something that the Google gang are aware of, and they say they’re working on a fix. But this post points out some other misgivings with AMP, like its governance policy:

This keeps the AMP HTML specification squarely in the hands of Google, who will be able to take it in any direction that they see fit without input from the community at large. This guise of openness is perhaps even worse than the Apple News Format, which at the very least does not pretend to be an open standard.

Isomorphic rendering on the JAM Stack

Phil describes the process of implementing the holy grail of web architecture (which perhaps isn’t as difficult as everyone seems to think it is):

I have been experimenting with something that seemed obvious to me for a while. A web development model which gives a pre-rendered, ready-to-consume, straight-into-the-eyeballs web page at every URL of a site. One which, once loaded, then behaves like a client-side, single page app.

Now that’s resilient web design!

“Is This Helpful?” » Mike Industries

I like Mike’s “long zoom” view here where the glass is half full and half empty:

Several years from now, I want to be able to look back on this time the same way people look at other natural disasters. Without that terrible earthquake, we would have never improved our building codes. Without that terrible flood, we would have never built those levees. Without that terrible hurricane, we would have never rebuilt this amazing city. Without that terrible disease, we would have never developed antibodies against it.

It doesn’t require giving any credit to the disaster. The disaster will always be a complete fucking disaster. But it does involve using the disaster as an opportunity to take a hard look at what got us here and rededicate our energy towards things that will get us out.

GarrettDimon.com

It strikes me that Garrett’s site has become a valuable record of the human condition with its mix of two personal stories—one relating to his business and the other relating to his health—both of them communicated clearly through great writing.

Have a read back through the archive and I think you’ll share my admiration.

The Loyal Opposition by Adrian Hon & more

A weekly list of short, concrete actions to defend the weak, rebuild civic institutions, and fight right-wing extremism. For UK people.

Subscribed.

Stuff in Space

A gorgeous visualisation of satellites in Earth orbit. Click around to grasp the scale of the network.