Tags: ar

2655

sparkline

Shadow DOM: fast and encapsulated styles – Monica Dinculescu

Monica explains how Shadow DOM could be the perfect answer for scoping CSS:

We didn’t have style encapsulation, so we started naming things “the right way” with BEM, so that we didn’t accidentally stomp over each other’s styles. We wanted to be able to author CSS from inside a JavaScript component, so we started using CSS-in-JS. We needed all these tools, because “the platform” (read: the browsers that be) wasn’t there, and building these tools showed that there was a need to move forward. For style encapsulation, Shadow DOM is the platform moving forward.

Although, in a way, Shadow DOM is also another flavour of CSS-in-JS:

Before you complain that using a Shadow DOM and Web Components means that it absolutely requires JavaScript: this is true.

I made a style guide for my personal web site and you should too.—zachleat.com

Here’s Zach’s style guide. But the real reason I’m linking to this is his lovely description of having a personal website that grows over time:

As my own little corner of the web unceremoniously turned ten years old this year, it’s really starting to feel more like a garden than a piece of software. I certainly enjoy tending to it. I can plant what I like and with proper care it can grow into something useful.

I’m a Google Manufacturing Robot and I Believe Humans Are Biologically Unfit to Have Jobs in Tech - McSweeney’s Internet Tendency

Normally a McSweeney’s piece elicits a wry chuckle, but this one had me in stitches.

Humans are also far more likely to “literally cannot right now.” I have never met an automaton that literally could not, though I have met some that theoretically would not and hypothetically might want to stop.

Patterns Day 2017: Paul Lloyd on Vimeo

Paul pulls no punches in this rousing talk from Patterns Day.

The transcript is on his site.

Attachment #317095 for bug #175115

I’ve never been so excited by a single diff in a JSON file.

Service workers are coming to Safari.

Presenting the new d3.loom chart form plugin - Visual Cinnamon

Nadieh has packaged up the code for her lovely loom diagrams as a plug-in for d3.

Patterns Day 2017: Alice Bartlett on Vimeo

At Patterns Day, Alice shared what she has learned from shepherding the Origami project within the Financial Times.

Flash is in the pan

Cameron counts the ways in which Flash was like a polyfill.

Yeah, that’s right: The Man In Blue is back!

Shoelace.css: a back to the basics CSS starter kit

A starter kit of CSS that gives you some basic styles that you can tweak with custom properties.

For when you don’t need the whole boot.

Also:

Shoelace doesn’t ship with a grid system because you don’t need one. You should use the CSS Grid Layout instead.

I approve this message!

advanced-js-resources.md

Following on from that intro-level book on JavaScript, here’s a handy list of resources for learning more advanced JavaScript.

bpesquet/thejsway: The JavaScript Way book

This looks like a good introductory book to JavaScript, DOM scripting, and Ajax.

You can read it for free here or buy a DRM-free ebook.

Hello codebar Sydney! | Charlotte Jackson, Front-end developer

People of Sydney, you’re in luck. Charlotte is starting up a Sydney chapter of Codebar. If you know someone there who is under-represented in the tech industry, and they’re looking to learn how to code, please tell them about this.

Some want to become full-time developers, whereas others want to learn the basics of coding to enhance their current jobs. Some want to learn programming as a hobby. Whatever the reason, we’d love to see you there!

Also, if you’re a developer in Sydney, please consider becoming a tutor at Codebar.

I promise that tutoring is not scary! We ask that you let us know which areas you feel comfortable tutoring when you sign up, so you choose what you teach. It’s absolutely okay to not know answers during sessions, but knowing how to look for them is helpful.

Oh, and if you’ve got a space in Sydney that can accommodate a class, please, please consider become a Codebar sponsor.

Tooltips & Toggletips

Another great deep dive by Heydon into a single interface pattern. This time it’s the tooltip, and its cousin, the toggletip.

There’s some great accessibility advice in here.

Patterns Day 2017: Jina Anne on Vimeo

Jina invented an entirely new genre for her Patterns Day talk—autobiographical fantasy.

Testing the accessibility of pattern libraries

Riffing on Rachel’s talk at Patterns Day:

At the Patterns Day conference last month, Rachel Andrew mentioned something interesting about patterns. She said that working with reusable interface components, where each one has its own page, made her realise that those work quite well as isolated test cases. I feel this also goes for some accessibility tests: there is a number of criteria where isolation aids testing.

Hidde specifically singles out these patterns:

  • Collapsible (“Show/hide”)
  • Form field
  • Video player

Web Publications for the Open Web Platform: Vision And Technical Challenges

Given my experience publishing Resilient Web Design as a web book, I think I should take a good look at this nascent spec.

What we envision for Packaged Web Publications is similar to the goals and techniques of Progressive Web Apps: breaking the boundaries between web sites and mobile apps, an emphasis on “offline” paradigms, and so on. The time is right to broaden the scope and power of the web to include publications.

Improbable Botany by Wayward — Kickstarter

Improbable Botany is a brand-new science fiction anthology about alien plant conquests, fantastical ecosystems, benevolent dictatorships and techno-utopias.

This is the book plants don’t want you to read…

The illustrations look beautiful too.

Bruce Lawson’s personal site  : Eulogy for Flash

Web developers aren’t going to shed many tears for Flash, but as Bruce rightly points out, it led the way for many standards that followed. Flash was the kick up the arse that the web needed.

He also brings up this very important question:

I’m also nervous; one of the central tenets of HTML is to be backwards-compatible and not to break the web. It would be a huge loss if millions of Flash movies become unplayable. How can we preserve this part of our digital heritage?

This is true of the extinction of any format. Perhaps this is an opportunity for us to tackle this problem head on.

Progressively Enhancing CSS Layout: From Floats To Flexbox To Grid – Smashing Magazine

A great example of progressive enhancement in action.

You can perfectly use CSS grid layout today if you don’t expect exactly the same appearance in every single browser, which isn’t possible to achieve nowadays anyway. I’m well aware that this decision isn’t always up to us developers, but I believe that our clients are willing to accept those differences if they understand the benefits (future-proof design, better accessibility and better performance). On top of that, I believe that our clients and users have — thanks to responsive design — already learned that websites don’t look the same in every device and browser.

100 Demon Dialogues – Lucy Bellwood

This is easily the most relatable 100 Days project I’ve seen:

I began posting a daily dialogue with the little voice in my head who tells me I’m no good.

Now you can back already-funded the Kickstarter project to get the book …and a plush demon.