Search
“the closest thing web standards have to a golden rule”
14.2.2019
The internet's own Mat Marquis plucks this choice quote from the HTML Design Principals spec:
In case of conflict, consider users over authors over implementors over specifiers over theoretical purity.
And then he applies the idea to putting images on websites in 2019.
Direct Link to Article...
Avoiding those dang cannot read property of undefined errors
13.2.2019
Uncaught TypeError: Cannot read property 'foo' of undefined. The dreaded error we all hit at some point in JavaScript development. Could be an empty state from an API that returns differently than you expected. Could be something else. We don’t know because the error itself is so general...
Grid Reveal Effects with Anime.js
13.2.2019
Some experiments with the new staggering system of Anime.js where we try different effects for hiding and showing thumbnails in an image grid.
Grid Reveal Effects with Anime.js was written by Mary Lou and published on Codrops
A Site for Front-End Development Conferences (Built with 11ty on Netlify)
12.2.2019
I built a new little site! It's a site for listing upcoming conferences in the world of front-end web design and development. In years past (like 2017), Sarah Drasner took up this daunting job. We used a form for new conference submissions, but it was still a rather manual task of basically...
Quick! What’s the Difference Between Flexbox and Grid?
12.2.2019
Let's go rapid fire and try to answer this question with quick points rather than long explanations. There are a lot of similarities between flexbox and grid, starting with the fact that they are used for layout and much more powerful than any layout technique that came before them. They...
A Funny Thing Happened on the Way to the JavaScript
12.2.2019
Around this time last year, I wrote an article about the JavaScript learning landscape. Within that article, you’ll find my grand plans to learn JavaScript — complete with a link to a CodePen Collection I started for tracking my progress, and it even got dozens of comments cheering me on.
Like most...
Where Do You Nest Your Sass Breakpoints?
11.2.2019
I love nesting my @media query breakpoints. It's perhaps the most important feature of Sass to me. Maybe I pick a method and do it like this:
.element {
display: grid;
grid-template-columns: 100px 1fr;
@include breakpoint(baby-bear) {
display: block;
}
}
That's straightforward enough....
The ineffectiveness of lonely icons
11.2.2019
Icons are great and all, but as we've been shown time and time again, they often don't do the job all by themselves. Even if you do a good job with the accessibility part and make sure there is accompanying text there for assistive technology, in an ironic twist, you might be confusing people...
Using Dotfiles for Managing Development and Many Other Magical Things
8.2.2019
Howdy folks! 🎉 I'm Simon Owen, and over the years, I've loved being a part of and learning from the dotfiles community. I spend a lot of time teaching developers and running workshops. In those sessions, demonstrating how I set up my development environment is often one of things that folks...
Revisiting the abbr element
7.2.2019
An irresistible HTML element deep dive from Ire Aderinokun, this time on the <abbr title=""> element for abbreviations. You can kinda just use it (JUI) and it works fine, but if you're hoping to make a tooltip for them (which works on touchscreens as well), then it's much more complicated....
Come to An Event Apart in 2019
7.2.2019
The 2019 season for An Event Apart (the premiere web and interaction design conference) is about to kick off!
Seattle - March 4–6, 2019
Boston - May 6–8, 2019
Washington DC - July 29–31, 2019
Chicago - August 26–28, 2019
Denver - October 28–30, 2019
San Francisco - December 9–11...
Where Do You Learn HTML & CSS in 2019?
7.2.2019
The topic of how accessible it is for newbies and seasoned developers alike to learn CSS has been gaining steam as the complexity of the tools around it has become skewed more toward traditional programming. Rachel Andrew has much more to say about this in her post, HTML, CSS and our vanishing...
HTML, CSS and our vanishing industry entry points
7.2.2019
Rachel Andrew:
There is something remarkable about the fact that, with everything we have created in the past 20 years or so, I can still take a complete beginner and teach them to build a simple webpage with HTML and CSS, in a day. We don’t need to talk about tools or frameworks, learn how...
Animate a Blob of Text with SVG and Text Clipping
6.2.2019
I came across this neat little animation in a designer newsletter — unfortunately, I lost track of the source, so please give a shout out if you recognize it! In it, a block of text appears to bleed into view with a swirl of colors, then goes out the same way it came in. It’s a slick effect and...
Gradians and Turns: the quiet heroes of CSS angles
6.2.2019
I love coming across little overlooked CSS gems, like the gradien (grad) and turn (turn) units that Ken Bellows uncovers in his post explaining them. I don't know, maybe y'all are already aware of them, but they're certainly new to me.
They're additional options for dealing with angles, where...
Using the Little-Known CSS element() Function to Create a Minimap Navigator
5.2.2019
W3C’s CSS Working Group often gives us brilliant CSS features to experiment with. Sometimes we come across something so cool that sticks a grin on our face, but it vanishes right away because we think, “that’s great, but what do I do with it?” The element() function was like that for me. It’s a...
Bandwidth or Latency: When to Optimise for Which
5.2.2019
Harry Roberts:
A good rule of thumb to remember is that, for regular web browsing, improvements in latency would be more beneficial than improvements in bandwidth, and that improvements in bandwidth are noticed more when dealing with larger files.
Direct Link to Article — Permalink…...
What Hooks Mean for Vue
4.2.2019
Not to be confused with Lifecycle Hooks, Hooks were introduced in React in v16.7.0-alpha, and a proof of concept was released for Vue a few days after. Even though it was proposed by React, it’s actually an important composition mechanism that has benefits across JavaScript framework ecosystems,...
More Like position: tricky;
4.2.2019
I rather like position: sticky;. It has practical use cases. I think of things like keeping a table of contents in a sidebar of a long article, but as a fairly simple implementation and without risk of overlapping things in awkward ways. But Elad Shechter is right here: it's not used that much...
Code Challenge #15: Simple Crazy Buttons with VanillaJS
4.2.2019
Woohoo! This is the first of our live stream code challenge series, and we'll kick it off with completing a super satisfying and rather funny challenge using HTML, CSS and plain Vanilla JavaScript