Marcin Wichary is a designer at Medium who took on the challenge of creating a considered, fine-tuned underline for the links on the site. In contrast to the normal "data-driven" design story, which is often a series of A/B tests that nudge things around by a pixel or two for weeks until they attain some counterintuitive optimum, this is a story about someone who had an intuitive, artistic, aesthetic goal and spent a bunch of time getting HTML to behave in a way that was consistent across different browsers, screen resolutions, and so forth.
I have to say that the actual underlines that Medium came up with don't seem to me to be more or less appealing than the default (the GIF above is displaying a before-and-after and I still can't tell which is which without referring to the article), but I really enjoy stories about people who know what aesthetic effect they want to achieve and are willing to move heaven and earth to achieve it.
I carried on, adding more and more complexity and magic numbers to my suggested change. And this is where the code reviewers started asking the truly hard and important questions: Is this too complicated? Will this make the CSS too heavy? How would we maintain it? What happens if this fails?
And so, during the following weeks, I worked on:
coming up with formulas rather than arbitrary values — in the event of changing the fonts or font sizes in the future, adjusting the underline positions would be much easier and faster,
limiting the browsers we use so that in the case of failure, the reader could see the default browser underlines (rather than not seeing them at all!),
simplifying the code so that while we might not get the perfect underlines, we could save both the bytes and future maintenance costs.
Crafting link underlines on Medium [Marcin Wichary/Medium]
I’ve been going to O’Reilly conferences since the first P2P conference in 2001; for 15 years, they’ve been blowing my mind.
Jim Jones writes, “I have been playing The Warren, Marshall Miller’s role playing game about being rabbits, with my three kids for a little over a month. We play in an area based on our suburban neighborhood. My second grade daughter chose to do a diorama of a suburb for school so she could talk […]
I’ve got a busy couple of weeks coming up! I’m speaking tomorrow at Powell’s in Portland, OR for Banned Books Week; on Wednesday, I’m at UC Riverside speaking to a Philosophy and Science Fiction class; on Friday I’ll be at the University of Southern California in Los Angeles, speaking on Canada’s dark decade of policy […]
The Avantree Powerhouse 4 Port Fast USB Charging Station brings high quality, high power, and still keeps your work space or home looking neat and organized. The best part about this charger is its capacity. It comes packing 4 USB charging sockets and a powerful 4.5A/22.5W output.. Its smartport technology means you don’t have to worry about frying your battery, either—it […]
With this comprehensive course in App & Game Development for iOS and Android, you’ll be able to take full advantage of this career opportunity without committing to going back to school full time. You’ll learn how to build immersive, interactive games and apps from start to finish using Python, C#, Unity, and HTML—some of the most in-demand programming […]
CloudPress is a responsive WordPress theme builder that allows you to create a whole site in less than 30 minutes. CloudPress comes with tools like pre-built headers, content blocks, and footers—all you have to do is pick what you like, and drag and drop. With your subscription, you get access to 13 professionally designed WordPress themes, over 80 […]