Jason Pamental has been working the web for a long time; so long in fact, he's even used "Netscape". This experience, coupled with his passion for responsive design and web typography (amongst many other things) have made him a well known face on the speaking circuit. I caught up with him, shortly before he heads to London for the Future of Web Design, and fired a few questions his way.
10% FOWD Discount for Tuts+ Readers!
Future of Web Design have been running brilliant web conferences for nearly ten years. This year's London event (held at The Brewery) sees three days of workshops, talks, learning and networking, all aimed at people like you.
Clik here to view.
The two-track schedule means that you can pick and choose which talks you'd most like to attend, giving you a tailored and dynamic experience, amongst some of the biggest names in web design.
Clik here to view.
Head on over to the FOWD website for more information.
And that's not all! If you'd like to attend, use the coupon code TUTS when you purchase your ticket and enjoy a 10% discount! This code is valid for every pass type except for the workshop only pass, the student pass, and the group passes.
The Q&A
Hi Jason, thanks for taking a moment to talk to us :) Tell us a bit about yourself; three bullet points to bring everyone up to speed.
Me in 3 bullet points?
- Have been designing & developing websites since Mosaic & Netscape 1
- Think any day where I learn something new can’t be all bad; even better if I get to share it!
- Have been called ‘Froggy’ by my step-daughter & step-son since they were 6 & 8 (they’re now 16 & 18). We still don’t know why.
Cheating with one more: I think that the biggest value in being a designer is in making oblique connections - finding new and different ways of connecting people and systems to help organizations do more amazing things. But without knowing what web technology can do, you just can’t be as effective. You have to bring knowledge of both to the table. Then you can really do incredible things.
Typography is a big part of what you do. Do you think that comes from your having seen, first-hand, the web industry grow from print/graphic design? Do you think fledgeling designers fail to recognise the attention typography deserves?
I think that there are two issues, stemming from two different sorts of designers. Those who come from a print/traditional design education have lots of typographic knowledge but often don’t know how much that can be used on the web, or don’t know enough about how to implement it to really bring that knowledge to bear. But there are also many web designers who don’t come from a traditional design education background, so those designers often don’t have the education about typography: how it can impact voice and tone, how it can relate to time and place and mood. So even though they might have the technical knowledge of how to use web fonts, they might not know what to do and why. I’ve tried to address both sides of that quandary in my talks - but it’s a real challenge, and often more than you can cover in a 45-minute or an hour-long talk.
If you could suggest one "first step" which would help designers improve their typography on the web, what would it be?
I think ‘play’. There are tons of great resources out there to read (I’ve written a couple, and the blogs on all the font service sites are outstanding, as is the Typecast blog, .net magazine and Smashing magazine have great stuff - the list goes one). But beyond reading a bit, just sign up for a free account on one of the services and try it out. Or just try ones from Google Web Fonts. It’s a total change to yank a page out of ‘average’ to ‘interesting’ just by changing the body copy. We have hundreds of millions of web pages in Arial. Just by changing that one dynamic, you can make your design really stand out.
In a similar vein, what would you say is a classic stumbling block in web typography, something which you often see folk getting wrong?
Probably overdoing it: including too many fonts and really slowing down the page load. Great typography most often doesn’t involve more than 2 or 3 typefaces - so loading up with 8 different weights and variants can really slow down the page load without necessarily advancing the design. If the fonts load slowly, the page will look really off, and that in turn can really put off the client. So all your hard work in designing will be undermined by not getting the technical implementation right. It’s just not that hard - you just need to pay attention to the details.
With web tools and services emerging every day, what would you say has been the most useful to you (particularly concerning typography) in recent years?
I’m a bit in love with Typecast I have to admit. It’s really quite cool - you can prototype your typography live in the browser with thousands of fonts from all different services. But to be honest I think that one of the best technologies has been things like LESS and Sass. Having math and variables available has allowed me to make my own frameworks for design that have loads of typographic details built in, making it much faster and reliable to get even better results. It eliminates a lot of wheel-reinvention.
Some would argue these days that "Responsive Web Design" is actually just "Web Design" - in other words, how we should think of web design by default. Would you say the same is true of "Responsive Typography"?
Of course! :)
I think that the truth is though that while we’d like to say that ‘Responsive Web Design’ is really just ‘Web Design’, which is really just ‘Design’ - but it’s not. It’s harder. We have to convey the same message, encourage the same behavior with our design without knowing what the screen size is, what the device capabilities are and in most cases without knowing even what the specific content is because it’s in a CMS. Typography is just as hard: how can we set headlines without knowing how long they’ll be? How do we make sure that our paragraphs don’t end with one word on a line when the width of that page/paragraph/window/screen is always changing?
I think that both Responsive Web Design and Responsive Typography should be our ‘normal’ - but I guess I just don’t want to understate or fail to recognize that to do either well requires a significantly greater amount of both design and technical effort and knowledge. I think it’s necessary, but it’s not always easy!
What can we expect from your workshop and talk at FOWD 2014?
Well - I’ll be addressing both parts of the previous question! The workshop is an intensive ‘beginning to pretty advanced’ journey into Responsive Web Design. It starts out by going through exercises that mirror the topics Ethan Marcotte laid out in his book: flexible grids, fluid media and media queries. But I’ve added more there for fallbacks, a more ‘mobile first’ approach to coding and em-based media queries. Then we’ll get into more advanced topics like responsive images, emerging UI patterns and Responsive Typography. It’s a really full day, but I’ve been amazed at the energy every time I’ve done this. It’s really a lot of fun.
My talk on Tuesday is going to be fully focused on Responsive Typography though. It’s something I’ve been thinking about for several years now and it’s finally gelling (to me anyway) into a good solid set of topics that can really mean something. Performance, progression, proportion and polish: the four ‘P’s’. It’s all a balance of art and science, type and tech. You need to get the fonts on the page, it has to work for everyone and it has to adapt for changes in screen size. And it needs to look done. It’s a lot to cover in 40 minutes, but I’ve got lots of samples and slides for people to take away and just start to play!
Clik here to view.
More Jason
If you're planning on visiting FOWD in London this April, Jason's workshop "From Sharpie to Sublime: a Responsive Design Intensive" on April 7th has already sold out. However, you can still catch his talk "Type, Responsively: Design For Readability & Meaning on Any Screen" at 11:30 on April 8th.
Don't forget to use the promotional discount code TUTS for 10% off when purchasing a ticket!
- www.hwdesignco.com
- @jpamental on Twitter
Clik here to view.
Image may be NSFW.Clik here to view.
Clik here to view.
Clik here to view.