The concept of permanently placing content on a web page for a single browsing width or resolution is becoming a thing of the past. Media-queried responsive & adaptive sites afford us the ability to re-architect content on a page to fit its container, but with this exciting new potential come equally exciting challenges. Web designers will have to look beyond the layout in front of them to envision how... Read more →
After my last post on mask-image, I needed to create a few more examples for an upcoming tutorial. I had to abandon this one because it wasn’t straightforward enough—though I quite like how it turned out, so I thought I’d share. Remember this property is sadly webkit-only at the moment. Ground Control Note: If you’re on any responsive width other than 100% (full), the masked shadows won’t line up.... Read more →
I recently wrote about Controlling Web Typography and focused on CSS pseudo selectors & down-to-the-letter control. As a web designer, I want the same level of control over type that print designers have, including texture. There are currently 2 webkit CSS properties that I’ve grown to love and hope gain more traction & browser support. My favorite would have to be background-clip:text, but it currently degrades poorly. A... Read more →
I’ll be doing double duty this June at Converge SE, teaming up with my Paravel cohorts, Dave & Reagan, for a workshop called Designing with Type on Friday, and speaking about Controlling Web Typography on Saturday. The plan will be to cover a lot of ground from the practical to the progressive on each day, with a focus on how you can make the most out of designing... Read more →
Lettering.js was built to solve a problem. As web typography improves, web designers want the same level of control print designers have. Just as we’ve moved beyond Helvetica and Times New Roman, we’ve begun to think about web type in finer detail than <h1> or <span> tags currently (semantically) allow. For example, when Dave Rupert and I prepared to markup the 3 sites for the Lost World’s Fairs... Read more →
We were thrilled at the Paravel office to see such a great use of Lettering.js on Twitter’s 2010: Year In Review site- specifically on the headline for The 10 Most Powerful Tweets of 2010. Josh Brewer, and the rest of the Twitter design team used it to split up the words within the title h1 to resize, position and change fonts; achieving a none-too-shabby intro to the page. If... Read more →
