This is a nifty visual interactive explainer for the language of CSS—could be very handy for Codebar students.
Thursday, July 23rd, 2020
Friday, July 17th, 2020
Having your independent blog is an excellent way to share what you think in a decentralized way, independent of any major company that may add a paywall to it (Medium, I am looking at you).
Friday, July 10th, 2020
An excellent and clear explanation of specificity in CSS.
Friday, June 12th, 2020
A really great one-page guide to HTML from Bruce. I like his performance-focused intro:
If your site is based on good HTML, it will load fast. Browsers incrementally render HTML—that is, they will display a partially downloaded web page to the user while the browser awaits the remaining files from the server.
Sunday, June 7th, 2020
There’s a voice inside your head that prevents you from sharing ideas—punch it in the face. - Airbag Industries
When I challenge the idea of topics—especially when I suggest writing about a design topic—the “I don’t know what to write about” excuse goes to level two: Someone has already written about [design topic]. And that might be true, but by Great Gutenberg’s Ghost, if that was a hard requirement for publishing, we’d have one newspaper, a few magazines, and maybe a thousand books. Hollywood would be a ghost town because we got to the end of all of the movie tropes by 1989. We’d have seventy-five songs with lyrics, but re-recorded in every music style and everyone would still hate Yanni. The point is you can’t let the people who have come before you be the excuse to stop you from writing or, frankly, creating.
Monday, June 1st, 2020
A great explanation of the curse of knowledge …with science!
(This, by the way, is the first of 100 blog posts that Matthias is writing in 100 days.)
Tuesday, May 26th, 2020
This is a lovely little interview with Cassie—it really is an honour and a privilege to work with her!
Note that John is a computer scientist that knows a fair bit about the Web: He had Node & npm installed, he knew what MIME types are, he could start a localhost when needed. What hope do actual novices have?
I think it’s even worse than that. Not only are potential new devs being put off ever getting started, I know plenty of devs with experience who have pushed out by the overwhelming and needless complexity of the modern web’s toolchain. It’s like a constant gaslighting where any expression of unease is summarily dismissed as being the whinings of “the old guard” who just won’t get with the programme.
John gives up. Concludes never to touch Node, npm, or ES6 modules with a barge pole.
(Just watch as Lea’s post gets written off as an edge case.)
Monday, May 4th, 2020
Thursday, April 30th, 2020
I was on the podcast A Question Of Code recently. It was fun! The podcast is aimed at people who are making a career change into web development, so it’s right up my alley.
I sometimes get asked about what a new starter should learn. On the podcast, I mentioned a post I wrote a while back with links to some great resources and tutorials. As I said then:
That’s assuming you want to be a good well-rounded web developer. But it might be that you need to get a job as quickly as possible. In that case, my advice would be very different. I would advise you to learn React.
Regardless of your initial route, what’s the next step? How do you go from starting out in web development to being a top-notch web developer?
I don’t consider myself to be a top-notch web developer (far from it), but I am very fortunate in that I’ve had the opportunity to work alongside some tippety-top-notch developers at Clearleft—Trys, Cassie, Danielle, Mark, Graham, Charlotte, Andy, and Natalie.
They—and other top-notch developers I’m fortunate to know—have something in common. They prioritise users. Sure, they’ll all have their favourite technologies and specialised areas, but they don’t lose sight of who they’re building for.
When you think about it, there’s quite a power imbalance between users and developers on the web. Users can—ideally—choose which web browser to use, and maybe make some preference changes if they know where to look, but that’s about it. Developers dictate everything else—the technology that a website will use, the sheer amount of code shipped over the network to the user, whether the site will be built in a fragile or a resilient way. Users are dependent on developers, but developers don’t always act in the best interests of users. It’s a classic example of the principal-agent problem:
The principal–agent problem, in political science and economics (also known as agency dilemma or the agency problem) occurs when one person or entity (the “agent”), is able to make decisions and/or take actions on behalf of, or that impact, another person or entity: the “principal”. This dilemma exists in circumstances where agents are motivated to act in their own best interests, which are contrary to those of their principals, and is an example of moral hazard.
A top-notch developer never forgets that they are an agent, and that the user is the principal.
But is it realistic to expect web developers to be so focused on user needs? After all, there’s a whole separate field of user experience design that specialises in this focus. It hardly seems practical to suggest that a top-notch developer needs to first become a good UX designer. There’s already plenty to focus on when it comes to just the technology side of front-end development.
So maybe this is too simplistic a way of defining the principle-agent relationship between users and developers:
user :: developer
There’s something that sits in between, mediating that relationship. It’s a piece of software that in the world of web standards is even referred to as a “user agent”: the web browser.
user :: web browser :: developer
So if making the leap to understanding users seems too much of a stretch, there’s an intermediate step. Get to know how web browsers work. As a web developer, if you know what web browsers “like” and “dislike”, you’re well on the way to making great user experiences. If you understand the pain points for browser when they’re parsing and rendering your code, you’ve got a pretty good proxy for understanding the pain points that your users are experiencing.
Tuesday, April 28th, 2020
I really enjoyed having a chat with Ed and Tom on their podcast. It’s aimed at people making a career shift into web development, but that didn’t stop me banging on about my usual hobby horses: progressive enhancement, resilient web design, and all that jazz.
Monday, April 20th, 2020
I love how Remy explains front-end development to his kids:
The bones are the HTML. Each bone has a name, we call them tags (or elements).
…the skin and the paint on the skin, this is CSS.
Sunday, March 15th, 2020
CSS only truly exists in a browser. As soon as we start writing CSS outside of the browser, we rely on guesses and memorization and an intimate understanding of the rules. A text editor will never be able to provide as much information as a browser can.
Wednesday, March 11th, 2020
CSS is frustrating because you have to actually think of a website like a website and not an app. That mental model is what everyone finds so viscerally upsetting. And so engineers do what feels best to them; they try to make websites work like apps, like desktop software designed in the early naughts. Something that can be controlled.
Tuesday, March 3rd, 2020
I can see this coming in very handy at Codebar—pop any CSS selector in here and get a plain English explanation of what it’s doing.
Friday, February 28th, 2020
The headline begs the question, but Robin makes this very insightful observation in the article itself:
Tuesday, February 25th, 2020
I love, love, love this encounter that Stephanie had with high school students when she showed them her own website (“Your website? You have a website?”).
I opened the DevTools on my site and there was an audible gasp from the class and excited murmuring.
“That’s your code?” A student asked. “Yes, that’s all my code!” “You wrote all of that?!” “Yes, it’s my website.”
And the class kind of exploded and starting talking amongst themselves. I was floored and my perspective readjusted.
When I code, it’s usually in HTML and CSS, and I suppose there’s a part of me that feels like that isn’t special because some tech bros decide to be vocal and loud about HTML and CSS not being special nearly everyday (it is special and tech bros can shut up.)
And the response from that class of high school students delighted me and grounded me in a way I haven’t experienced before. What I view as a simple code was absolute magic to them. And for all of us who code, I think we forget it is magic. Computational magic but still magic. HTML and CSS are magic.
Yes! Yes! Yes!
Tuesday, February 18th, 2020
I am the programming equivalent of a home cook.
The exhortation “learn to code!” has its foundations in market value. “Learn to code” is suggested as a way up, a way out. “Learn to code” offers economic leverage, a squirt of power. “Learn to code” goes on your resume.
But let’s substitute a different phrase: “learn to cook.” People don’t only learn to cook so they can become chefs. Some do! But far more people learn to cook so they can eat better, or more affordably, or in a specific way.
Thursday, January 23rd, 2020
You know that this online course from Scott is going to be excellent—get in there!
Wednesday, January 22nd, 2020
This is a wonderful interactive explanation of the way CSS hierarchy works—beautiful!