Tags: ada

80

sparkline

Offline listings

This is brilliant technique by Remy!

If you’ve got a custom offline page that lists previously-visited pages (like I do on my site), you don’t have to choose between localStorage or IndexedDB—you can read the metadata straight from the HTML of the cached pages instead!

This seems forehead-smackingly obvious in hindsight. I’m totally stealing this.

PWA asset generator based on Puppeteer.

Automatically generates icons and splash screens based on Web App Manifest specs and Apple Human Interface Guidelines. Updates manifest.json and index.html files with the generated images.

A handy command line tool. Though be aware that it will generate the shit-ton of link elements for splash screens that Apple demands you provide for a multitude of different screen sizes.

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

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

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

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

German Naming Convention

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

Bruce Lawson’s personal site  : Structured data and Google

Bruce wonders why Google seems to prefer separate chunks of JSON-LD in web pages instead of interwoven microdata attributes:

I strongly feel that metadata that is separated from the user-visible data associated with it highly susceptible to metadata partial copy-paste necrosis. User-visible text is also developer-visible text. When devs copy/ paste that, it’s very easy to forget to copy any associated metadata that’s not interleaved, leading to errors.

Is the universe pro-life? The Fermi paradox can help explain — Quartz

Living things are just a better way for nature to dissipate energy and increase the universe’s entropy.

No anthropocentric exceptionalism here; just the laws of thermodynamics.

According to the inevitable life theory, biological systems spontaneously emerge because they more efficiently disperse, or “dissipate” energy, thereby increasing the entropy of the surroundings. In other words, life is thermodynamically favorable.

As a consequence of this fact, something that seems almost magical happens, but there is nothing supernatural about it. When an inanimate system of particles, like a group of atoms, is bombarded with flowing energy (such as concentrated currents of electricity or heat), that system will often self-organize into a more complex configuration—specifically an arrangement that allows the system to more efficiently dissipate the incoming energy, converting it into entropy.

Readable Code without Prescription Glasses | Ocasta

I saw Daniel give a talk at Async where he compared linguistic rules with code style:

We find the prescriptive rules hard to follow, irrespective of how complex they are, because they are invented, arbitrary, and often go against our intuition. The descriptive rules, on the other hand, are easy to follow because they are instinctive. We learned to follow them as children by listening to, analysing and mimicking speech, armed with an inbuilt concept of the basic building blocks of grammar. We follow them subconsciously, often without even knowing the rules exists.

Thus began some thorough research into trying to uncover a universal grammar for readable code:

I am excited by the possibility of discovering descriptive readability rules, and last autumn I started an online experiment to try and find some. My experiment on howreadable.com compared various coding patterns against each other in an attempt to objectively measure their readability. I haven’t found any strong candidates for prescriptive rules so far, but the results are promising and suggest a potential way forward.

I highly recommend reading through this and watching the video of the Async talk (and conference organisers; get Daniel on your line-up!).

How Readable? | Clearleft

Cassie and I went to a great Async talk last night all about code readability, which was well-timed because it’s been on our minds all week. Cassie explains more in this post.

Sass Selectors: To Nest Or Not To Nest? | Brad Frost

The fascinating results of Brad’s survey.

Personally, I’m not a fan of nesting. I feel it obfuscates more than helps. And it makes searching for a specific selector tricky.

That said, Danielle feels quite strongly that nesting is the way to go, so on Clearleft projects, that’s how we write Sass + BEM.

inessential: The View-Source Web

Lesson learned: the discoverable and understandable web is still do-able — it’s there waiting to be discovered. It just needs some commitment from the people who make websites.

Laws of UX

  1. Fitts’s Law
  2. Hick’s Law
  3. Jakob’s Law
  4. Law of Prägnanz
  5. Law of Proximity
  6. Miller’s Law
  7. Parkinson’s Law
  8. Serial Position Effect
  9. Tesler’s Law
  10. Van Restorff Effect

Not listed:

  1. Murphy’s Law
  2. Sturgeon’s Law

Ridley Scott’s ‘Blade Runner’: A Game-Changing Science-Fiction Classic • Cinephilia & Beyond

A nexus of hypermedia on all things Blade Runner, from links to Tumblr blogs to embedded screenplays, documentaries, and scanned images.

Web Typography: Designing Tables to be Read, Not Looked At · An A List Apart Article

An extract from Richard’s excellent book, this is a deep dive into styling tables for the web (featuring some CSS I had never even heard of).

Tables can be beautiful but they are not works of art. Instead of painting and decorating them, design tables for your reader.

(It also contains a splendid use of the term “crawl bar.”)

The Art of Comments | CSS-Tricks

Great advice on writing sensible comments in your code.

thebaer/MMRA: Make Medium Readable Again — a browser extension

I’ve gotten a little tired of showing up to a Medium-powered site on a non-medium.com domain and getting badgered to Sign Up! or Get Updates! when I’m already a Medium user.

A Chrome extension to Make Medium Readable Again by:

  • Keeping the top navigation bar from sticking around
  • Hiding the bottom “Get Updates” bar completely
  • (Optionally) hiding the clap / share bar
  • (Optionally) loading all post images up front, instead of lazy loading as you scroll

Shame there isn’t a mobile version to get rid of the insulting install-our-app permabutton.

Categories land in the Web App Manifest | Aaron Gustafson

Manifest files can have categories now. Time to update those JSON files.

Interface font family

Interface is a font for highly legible text on computer screens.

And it’s free!

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.

Mercury by Postlight

Readability is back, but now it’s called Mercury.

Data on the Web Best Practices

This document provides Best Practices related to the publication and usage of data on the Web designed to help support a self-sustaining ecosystem. Data should be discoverable and understandable by humans and machines.