I’ve always meant to get back to it and make it more interactive. So over the past several evenings, I’ve rebuilt it as an SVG-based visualization. The main point of doing this was so that when you hover the mouse pointer over one of the little color boxes, it will fill the center of the color wheel with the hovered color and tell you its name and HSL values. Which it does, now. It even tries to guess whether the text should be white or black, in order to contrast with the underlying color. Current success rate on that is about 90%, I think. Calculating perceived visual brightness turns out to be pretty hard!
Other things I either discovered, or want to do better in the future:
Very nearly half the CSS4 (and also CSS3/SVG) color keywords are in the first 90 degrees of hue. More than half are in the first 120 degrees.
There are a lot of light/medium/dark variant names in the green and blue areas of the color space.
I wish I could make the color swatches bigger, but when I do that the adjacent swatches overlap each other and one of them gets obscured.
Therefore, being able to zoom in on parts of the visualization is high on my priority list. All I need is a bit of event monitoring and some viewbox manipulation. Well, that and a bit more time. Done, at least for mouse scroll wheels.
I’d like to add a feature at some point where you type text, and a list is dynamically filtered to show keywords containing what you typed. And each such keyword has a line connecting it to the actual color swatch in the visualization. I have some ideas for how to make that work.
I’d love to create a visualization that placed the color swatches in a 3D cylindrical space summarizing hue, lightness. and saturation. Not this week, though.
I’m almost certain it needs accessibility work, which is also high on my priority list.
SVG needs conic gradients. Or the ability to wrap a linear gradient along/inside/around a shape like a circle, that would work too. Having to build a conic gradient out of 360 individual <path>s is faintly ridiculous, even if you can automate it with JS.
And also z-index awareness. C’mon, SVG, get it together.
I toyed with the idea of nesting elements with borders and some negative margins to pull one border on top of another, or nesting a border inside an outline and then using negative margins to keep from throwing off the layout. But none of that felt satisfying.
It turns out there are a number of tricks to create the effect of stacking one border atop another by combining a border with some other CSS effects, or even without actually requiring the use of any borders at all. Let’s explore, shall we?
That’s from the introduction to my article “Stacked ‘Borders’”, which marks the first time I’ve ever been published at the venerable upstart CSS-Tricks. (I’m old, so I can call things both venerable and an upstart. You kids today!) In it, I explore ways to simulate the effect of stacking multiple element borders atop on another, including combining box shadows and outlines, borders and backgrounds, and even using border images, which have a much wider support base than you might have realized.
Many thanks to Chris Coyier for accepting the piece, and Geoff Graham for his editorial assistance. I hope you’ll find at least some part of it useful, or better still, interesting. Share and enjoy!
So it’s been (checks watch) half a year since I last blogged, yeah, okay, been a while. I took a break, not that you would’ve been able to tell from the sporadic nature of updates before I did so, but a break I took nonetheless. Well, break’s over.
One of things I plan to do is fill in a post I missed writing at the beginning of December: the 25th anniversary of my working with the web. I’ll tell the story in that post, but suffice to say it involves a laptop, a printout of the HTML specification, Microsoft Word 5.1a, a snagged Usenet post, and Mystery Science Theater 3000. Keep circulating the tags!
Before that happens, I’ll be posting a review of the return of a very old, very faithful assistant. I also have an article coming on a site where I’ve never been published before, so that’s exciting — look for an announcement here as soon as it’s public. Stay tuned!
It was twenty years ago today, under the wide-spreading boughs of a tree in the front yard of a house on Long Island, that Kat and I exchanged our wedding vows before a small crowd of friends and family. Immediately after, we all moved to the tent in the back yard to celebrate.
The twentieth anniversary is, traditionally, the china anniversary. Kat’s immediate reaction upon hearing this was that it makes total sense, since by 20 years you’ve probably broken most of your wedding china and need replacements. For us, though, the resonance is a little different, since our honeymoon was a trip to China. And therein hangs an origin story.
At some point in the late 1997, Kat and I were at a Meyer family gathering, probably Thanksgiving, at my paternal grandparents’ house in Cincinnati. As was my wont, I was perusing the stacks of National Geographics they had always lying around. Not like in a dentist’s office; no, these were always up to date. But there were always many of them, interleaved with many similarly contemporary Readers’ Digests.
I picked up one with a cover shot and title about China’s Three Gorges
, and started leafing through it, eventually reaching the cover story. It chronicled the incredible landscapes of the Three Gorges of the Yangtze River, soaring cliff faces and ancient villages. I was immediately captivated by the story and especially the photography. I decided that I wanted to see the Gorges before they were submerged by the Three Gorges Dam Project, which is the sort of snap decision I almost never make. Usually I take time to analyze an idea and game out scenarios before reaching a conclusion, but not this time. I was immediately certain. I was certain enough to say it out loud to other people, like Kat and my parents and, who knows, probably a bunch of my extended family.
Now, fast forward a bit. At the end of that same year, Kat and I were with my parents for Christmas. We went out to dinner at Mom’s favorite spot for her birthday (also Boxing Day) and my parents said they had presents for me and my sister. We each got an envelope.
Both of them contained checks for several thousand dollars, windfall of an inheritance distribution that Mom had insisted be passed on to us. In mine, with the check, were a number of brochures for tours of China.
I was speechless. Kat asked what it was a couple of times, a little bewildered by the look on my face.
And here I must take a side trip. Kat and I had been on a trip to California a few weeks prior, just the two of us. We spent a couple of nights at Ragged Point, a spot I’d stumbled over on a previous solo trip, back in the days when the rooms intentionally had no TVs or phones. The restaurant was booked by a large group, so we ate dinner alone on the open patio under a heat umbrella, looking at the stars and enjoying the fantastic food; the chef at the time was a genius. Music played softly through hidden speakers, and although we were literally sitting outside it felt as quiet and private as any candlelit back room.
“The Christmas Song”, generally better known as “Chestnuts Roasting on an Open Fire”, started playing. Kat, smiling, asked me if I would like to dance. So we stood and danced close together, slowly shuffling around the open space the way untrained dancers do, just us and the song and the stars.
Kat swears I drew breath and opened my mouth to ask her to marry me. Maybe she’s right. But I didn’t, then. Nor the next day. Nor on Christmas Day. Which caused Kat to start thinking that maybe it wasn’t going to happen at all. She was feeling disappointed and hurt by this, as you can probably imagine, but keeping it to herself because she wasn’t sure yet if she was right or wrong.
So: back to Mom’s birthday dinner in Mansfield, Ohio, and me sitting stunned by the check and the China brochures and this unexpected, unprecedented windfall.
“Eric, what is it?” Kat asked again, with some concern starting to color her words.
“We’re going to China!” I finally blurted out.
“No, you’re going to China,” she replied a little tartly.
“No, we’re going to China,” I repeated.
Because in that moment, right there, I knew that this trip I wanted to take, the things I wanted to see so badly before they were gone — I couldn’t imagine doing and seeing all that without Kat.
That’s when I knew, beyond any shadow of a doubt, that I wanted to marry her.
I didn’t propose that night either, because I had to explain this all to her in halting, still-new words and help her (and me!) understand what had happened. She got it, as I think I knew she would. We went shopping for rings just after the New Year. I formally proposed to her, shivering on an ice-crusted deck by the Chagrin Falls, on her birthday in March.
And on July 19th, 1998, we stood underneath the spreading boughs of the tree in the front yard of her childhood home, and exchanged our wedding vows. A short time later, in a backyard tent in the heat of a mid-July afternoon on Long Island, we stood on the compact dance floor and danced to “The Christmas Song”, baffling half the attendees and bemusing the other half.
The next very day, we flew to China, and saw so much together over the next seventeen days: the Three Gorges, yes, but much more. Suzhou, Dazu, and Guilin stand out in particular for being a little more remote and not so overrun by tourists, the kinds of spots we always find inherently more interesting than large cities and glitzed-up, polished destinations. We still want to go back to Guilin some day.
In the two decades since we vowed to love and honor and respect and amuse each other, we’ve had many adventures together. Some were incredible, some were stressful, and some I would have spared us both. Picking out a card was difficult, with so many of them written as if 20 years together could never be anything but an unbroken stretch of bliss and good fortune. We’ve been through too much to respond well to such bromides; we’ve had fortune great and terrible, difficulty and ease, endless joy and boundless grief.
Every one of those days and weeks and months and years, we’ve supported and shared with each other. Kat’s been so strong, and so selfless, and I’ve tried to be the same for her. Neither of us did so perfectly, but we always tried — and we always understood when the other had to nurse a weakness, or look inward for a while. We have always been honest with each other, and accepted each other. That, more than anything, is what’s allowed us to travel together these two decades and still love each other.
I couldn’t have asked for a better partner in life and death than Kat, and I hope she’s even half as proud of and grateful for me as I am for her.
In another timeline, an early alarm woke Kat and me this morning so we could sneak into Rebecca’s room with her siblings and wish her a happy birthday at the moment she turned ten, 7:24am, June 7th, 2018.
Two digits. It’s a big milestone, in its way. Rebecca’s best friend Ruth passed it a few days ago. Ruth, who she called “Ruthie”. Who shared all three of her initials, and practically had the same birthday. Who was the last person to whom Rebecca ever spoke a complete sentence in her full voice, the morning of the day before she died: “Goodbye Ruthie, I love you, MWAH!”
Ruth, who still dreams of Rebecca, happy dreams that make her waking sad.
I have dreams like that too, when I remember them. I don’t often remember my dreams. But sometimes, I get to spend a little time with her, free of sorrow, on a nighttime walk or at an amusement park my subconscious constructed out of all the parks we ever took her to.
Kat and Carolyn and Joshua and I went to the grave marker this morning, because Kat works all afternoon into the evening and Joshua has an all-day LEGO and chess camp and Carolyn has friends to see before summer vacation gets crazy. Because life moves on even when a part of you can’t understand why the sky doesn’t collapse and the world doesn’t crack open and time doesn’t shatter into a million sharded memories. Classes get taken, grades get graduated, camps get attended, trips get planned, work has to be done. Each day follows on the one before, pulling you further and further away from the last moments your life was normal.
We stood or sat or huddled around the flecked slate blue granite slab under the gray clouds of morning, emotions flaring and fading, subsumed by a profound sorrow without many tears. We’re too used to it, now. The sobs of previous years have given way to a steeled mourning. Sometimes there is resentment at the stupid blind unfairness of the holes shot through all our hearts, the hole in our lives, and all the things she and we never got to experience.
Her playgroup friends still talk of her with their parents. Rebecca was a good friend, she was funny, she was fun, she was so nice. In their way, still trying to come to grips with what happened to her. To them.
They don’t mention her to us. Children, trying to protect the grown-ups.
Which makes sense, since they know, now, that sometimes grown-ups can’t protect the children. Sometimes the killer gets into the house and there is nothing you can do to cast it out.
Sometimes there is nothing anyone can do, except hold the victim’s hand as her life ebbs away, and wish your desperate pleas to take her place had been heard. That there was something to hear, anything to hear, and accept a frantic parent’s bargain of life for life.
Ten years ago today, Rebecca came into this world. Four years ago today, she left it.
I can’t remember if I ever told her I would never forget her, or if I was too afraid of frightening her.
I clearly remember when and where she told me, sobbing, knowing she would die, that she would never forget me.
I can still recall the terrified strength in her arms, locked around my neck.
In March of 2014, our son Joshua, then a newly-minted three-year-old, shaved his head for St. Baldrick’s for the first time, in support of his sister Rebecca, who at the time seemed to be in remission. This coming Sunday, now in support of all St. Baldrick’s beneficiaries and in memory of the sister with whom he shared so much love, he’ll shave his head for the fifth time. He’s been letting his hair grow out since the start of the year just for this occasion, and he’s already looking forward to 2020, when he will officially become a Knight of the Bald Table — at the age of nine.
As he was last year, Joshua is a member of Team Fairfax, representing the elementary school all three of our kids have attended. This year he was designated a Team Captain despite only being a first-grader.
Joshua surpassed his initial goal and set a new, much more ambitious threshold of $1,200. As I write this, he’s just over $150 away. If you can help him get over and beyond that line, he — and I — would very much appreciate it.
Just over an hour before I started writing this post, I handed off CSS Pocket Reference, 5th Edition to the Production department at O’Reilly. What that means, practically speaking, is that barring any changes that the editors find need to be made, I’m done.
Besides all the new-new-NEW properties included in this edition (flexbox and grid being just two of the most obvious examples), we put a lot into improving the formatting for this edition. Previous editions used a more sprawling format that led to the 4th edition getting up to 238 pages, which cast serious shade on the word “Pocket” there in the title. After all, not all of us live in climates or cultures where 24/7 cargo pants are a viable option.
So with a few ideas from me and several more from the production team, we managed to add in all the new properties and still bring the page count down below 200. My guess is the final copy will come in about 190 pages, but much will depend on how crazy the indexer gets, and how much the formatting gets changed in the final massaging.
We don’t have a firm release date yet; I’m pulling for April, but it’s really not up to me. I’ll make announcements via all the usual channels when pre-order is available, and of course when publication day arrives.
For now, for the first time in many years, I don’t have a book project on my to-do list. I don’t even have a book proposal on my to-do list. It’s a slightly weird feeling, but not an unwelcome one. I’ll be putting the extra time into my content for An Event Apart: I’m giving a talk this year on using the new CSS tools to make our jobs easier, and doing Day Aparts in Boston and San Francisco where I spend six hours diving deep into guts of stuff like flexbox Grid, writing modes, features queries, and a whole lot more.
So my time will continue to be fully spoken for, is what I’m saying. It’ll all be fun stuff, though, and it’s hard to ask for more out of my work.
My wife Kat and I tell ourselves we’d love another child for who they are, not for who they replace. We even believe it. But we can’t be sure of it — and that keeps us from shutting our eyes, jumping back into the adoption process, and hoping it will turn out okay. We know all too horribly well that sometimes, it doesn’t.
That’s the opening of my essay “The Second Third Child”, included in the new book from Modern Loss titled Modern Loss: Candid Conversation About Grief. Beginners Welcome, published this week.
I’m deeply honored to be one of the 40+ contributors to the book, some of whom you may know — Dresden Dolls co-founder Amanda Palmer, CNN’s Brian Stelter, author Lucy Kalanithi, Dear Evan Hansen director Michael Greif, Stacy London of What Not To Wear — and many of whom you may not, as I will be unknown to the vast majority of the book’s readers. I’ve written articles for Modern Loss in the past, but to be entrusted with a part of their first book was humbling.
Several of the essays in the book are intentionally funny, but mine is not one of them. It’s quiet, reflective, and elegiac in more than one way, but never anything but honest. It appears in the first section of the book, titled “Collateral Damage”.
As Stephen Colbert put it: “Talking about loss can feel scary. This book isn’t. It’s about grieving deeply over the long term, and the reassurance that you’re far from broken because of it.” I hope my essay, and the book as a whole, helps readers to come to terms with their own grief, by seeing that they are not alone, and that they did the best they could even if it doesn’t feel that way at all.
