novakHouse.us

November 30th, the official "Blue Beanie Day," has come and gone. I'm not sure I ever grokked the exact spirit of it, but I've written about what it means to me. Last year:

Web standards, as an overall idea, has entirely taken hold and won the day. That's worth celebrating, as the web would be kind of a joke without them. So now, our job is to uphold them. We need to cry foul when we see a

… Read article

The post Blue Beanie Day 2019 appeared first on CSS-Tricks.

I think Adam's first prediction is his boldest, even beyond his Hail Mary prediction. CSS grid is awesome and gap is perhaps one of its best qualities, but gap superseding spacing things out in other ways (e.g. margin) is a bold prediction indeed, especially with Firefox being the only browser supporting it in flexbox.

Direct Link to Article — Permalink… Read article

The post Adam Argyle’s 2020 CSS Predictions appeared first on CSS-Tricks.

Interesting idea for a "chat room" from Postlight:

1. Create a Yap chat room.
2. Invite others to join and talk.
3. Share a URL of just about anything.
4. Everyone gathering can comment on what you’ve shared.
5. If you think your conversation deserves an audience, share the URL of your chat publicly.
6. Only six people can join. Lots of people can observe if you invite them. But just six chatters.

Yap.

Direct Link to Article — Permalink… Read article

The post Yap appeared first on CSS-Tricks.

Most of the time you don’t really care about whether a user is actively engaged or temporarily inactive on your application. Inactive, meaning, perhaps they got up to get a drink of water, or more likely, changed tabs to do something else for a bit. There are situations, though, when tracking the user activity and detecting inactive-ness might be handy.

Let’s think about few examples when you just might need that functionality:

• tracking article reading time
• auto saving form or

… Read article

The post Detecting Inactive Users appeared first on CSS-Tricks.

A standard copy-and-paste YouTube embed lands on your page as an <iframe> which loads a big ol' pile of other stuff to play that video. But the UX of it is still essentially an image and a play button. Click the play button and the video plays. You can build essentially the same thing with an anchor link wrapping an image!

Not long ago, we covered a very clever "lazy load" technique doing exactly this from Arthur Corenzan that was … Read article

The post lite-youtube-embed appeared first on CSS-Tricks.

In this week's news: Firefox gets strict, Opera goes to the dark side, and Chrome plans to let web apps run in the background.

Let's get into the news.

Firefox for Android will block tracking content

Mozilla has announced that the upcoming revamped Firefox for Android (currently available in a test version under the name "Firefox Preview") will include strict tracking protection by default.

On the phone or tablet, most users care much more about performance and blocking of annoyances

… Read article

The post Weekly Platform News: Strict Tracking Protection, Dark Web Pages, Periodic Background Sync appeared first on CSS-Tricks.

Did you know there is a well-supported browser API that allows you to interface with interesting and even custom-built hardware using a mature protocol that predates the web? Let me introduce you to MIDI and the WebMIDI API and show you how it presents a unique opportunity for front-end developers to break outside the browser and dabble in the world of hardware programming without leaving the relative comfort of JavaScript and the DOM.

What are MIDI and WebMIDI exactly?

MIDI… Read article

The post Dip Your Toes Into Hardware With WebMIDI appeared first on CSS-Tricks.

We’re sliding into the roaring twenties of the twenty-first century (cue Jazz music 🎷). It’s important that you and I, as responsible people, follow the tradition of looking back on the past year and reflect on the things that went right and wrong in the hopes of becoming the best version of ourselves in the year ahead.

I never do New Year’s resolutions, except for when I was ten years old and wanted to open a local self-run detective agency … Read article

The post How I’ve Improved as a Web Developer (and a Person) in 2019 appeared first on CSS-Tricks.

I don't see image sprites used that much anymore, but it's still a good technique for reducing downloaded decorative image assets when you have multiple on a page. The big idea is combining all the graphics into one and then shifting around the size and background-position to reveal one at a time.

Say you're site needs dozens or hundreds of country flags — that's a perfect opportunity for a sprite. Michael P. Cohen has built a generator site to help … Read article

The post Freak Flags appeared first on CSS-Tricks.

Seemingly out of the blue, the Gulp processing I had set up for this site started to have a race condition. I'd run my watch command, change some CSS, and the processing would sometimes leave behind some extra files that were meant to be cleaned up during the processing. Like the cleanup tasks happened before the files landed in the file system (or something... I never really got to the bottom of it).

Nevermind about the specifics of that bug. … Read article

The post Just Sharing My Gulpfile appeared first on CSS-Tricks.