Contributing to positive change is difficult, but it’s the right pursuit, no matter how much effort it takes. For years here at Smashing, we’ve been working with our dear authors and speakers, as well as students and professionals around the world, to share insights and practical techniques to work better and faster. We’re very much committed to that mission, and it’s always an incredible feeling to meet somebody who has read one of our articles, or attended one of our workshops, who still remembers their experience as that one little step that helped progress their career as a result.
Yet that’s only one part of a larger story — a story of injustice, denial of opportunity, and inequality in our world. For years, we’ve been addressing this issue head-on by diversifying our authors and line-ups, introducing new voices to the stage, mentoring students around the world, coaching tech speakers, and providing diversity and student tickets for our conferences. It’s a constant and very dedicated effort that reflects the values and principles of our little team, and we are committed to it for years to come.
We stand firmly behind the Black Lives Matter movement. We stand strongly behind introducing a wide range of Black voices to Smashing publications and conferences. We remain committed to providing a platform for the Black community to use our platform to make their voices heard. The entire team is committed to introducing and promoting the work of underrepresented people in our community, and to bringing a more diverse lineup to the magazine and conferences.
Building A CSS Layout: Live Stream With Rachel Andrew
Building A CSS Layout: Live Stream With Rachel Andrew
Vitaly Friedman
We’re opening up our Smashing TV webinars to everyone, and today you’re welcome to follow along as Rachel Andrew builds a layout using CSS Grid and Flexbox.
In the session, Rachel will be building a component of a layout, talking through her thinking as she does so. Is Flexbox or Grid the right method to use? How will the component respond to different screen sizes? And, what about those old browsers?
If you are a Smashing Member then you will get the added benefit of being able to ask your own questions after the session.
Rachel Andrew On CSS Layouts
The session took place on December 10 at 6:00 PM Berlin time (12:00 PM New York time). In case the video below doesn’t play, you can also watch it directly on YouTube.
From Smashing With Love
To help you stay on top of things, you can subscribe to our bi-weekly newsletter, in which we announce what’s happening in the Smashing universe. Each and every newsletter issue is written and edited with love and care. No third-party mailings or hidden advertising — promise!
You can also follow us on Twitter, Facebook, LinkedIn and even stay updated with our bi-weekly Smashing Podcast. Please do always feel free to reach out and share your thoughts with us — we love hearing from you!
Smashing TV Live: Privacy UX, A Session With Vitaly Friedman
Smashing TV Live: Privacy UX, A Session With Vitaly Friedman
Vitaly Friedman
Cookie consent prompts, push notifications, app install prompts, video autoplays and annoying pop-ups. Every time we enter a new site, it feels like a fight against all the annoying marketing messages endlessly streaming at us. If you’ve wondered why a product you looked up in a search engine one day keeps showing up in all your social channels over and over just a few hours later, that’s the power of data collection and retargeting at play. We can do better than that though.
For a few years now, we’ve been running live sessions with respected professionals on Smashing TV — our video channel for our dear Smashing Members, who support our little team and our little adventures every month. As the webinars have always been about sharing lessons learned with the community, we’d like to open them up to everybody, with Members having a chance to ask questions right after the session.
Live Stream On Privacy UX: Tue, Dec 3, 5:00 PM London time
The session took place on Dec. 3, at 5:00 PM London time (12:00 PM New York time). In case the video below doesn’t work, you can also watch it directly on YouTube.
Couldn’t tune in on time? No worries! The webinar is available for you on Youtube — enjoy!
In this session, Vitaly explores privacy UX patterns, techniques, strategies and important decisions to consider when designing and building privacy-aware websites and applcations. You’ll walk away with a toolbox of applicable techniques, privacy nightmares and a few notes on how to keep your website/app GDPR-compliant and privacy-focused.
From Smashing With Love
To help you stay on top of things, you can subscribe to our bi-weekly newsletter (193.000 subscribers), in which we announce what’s happening in the Smashing universe. Each and every newsletter issue is written and edited with love and care. No third-party mailings or hidden advertising, of course!
Inclusive Design And Accessibility: Live Stream With Heydon Pickering
Inclusive Design And Accessibility: Live Stream With Heydon Pickering
Vitaly Friedman
Accessibility can sometimes become an unfortunate afterthought as we race to meet deadlines and search for tips and tricks to meet client demands. We can cause problems for keyboard or screenreader users, and leave our products fragile and potentially vulnerable to legal action from people who find themselves locked out due to their accessibility needs. How can we get better?
One way to find out would be by joining our live stream with Heydon Pickering who will be sharing insights about the relationship between accessibility and design systems, and exploring how to build accessible components, and why he decided to write a book on accessible interface design patterns.
Live Stream On Inclusive Design: Nov 7, 5:00 PM GMT
The session will start today, November 7, at 6:00 PM Berlin time (12:00 PM New York time) — broadcasted live below! (If the video doesn’t play, you can also watch on YouTube.)
For a few years now, we’ve been running live sessions with respected professionals on Smashing TV — our video channel for our dear Smashing Members, who support our little team and our little adventures every month.
Starting from November, we’d like to try out something new. As the webinars have always been about sharing lessons learned with the community, we’d like to open them up to everybody, with Members having a chance to ask questions about the projects and their work right after the session.
From Smashing With Love
To help you stay on top of things, you can subscribe to our bi-weekly newsletter, in which we announce what’s happening in the Smashing universe. Each and every newsletter issue is written and edited with love and care. No third-party mailings or hidden advertising — promise!
You can also follow us on Twitter, Facebook, LinkedIn and even stay updated with our bi-weekly Smashing Podcast. Please do always feel free to reach out and share your thoughts with us — we love hearing from you!
Smashing Book 6 Is Here: New Frontiers In Web Design
Smashing Book 6 Is Here: New Frontiers In Web Design
Vitaly Friedman
Imagine you were living in a perfect world. A world where everybody has fast, stable and unthrottled connections, reliable and powerful devices, exquisite screens, and capable, resilient browsers. The screens are diverse in size and pixel density, yet our interfaces adapt to varying conditions swiftly and seamlessly. What a glorious time for all of us — designers, developers, senior Webpack configurators and everybody in-between — to be alive, wouldn’t you agree?
Well, we all know that the reality is slightly more nuanced and complicated than that. That’s why we created Smashing Book 6, our shiny new book that explores uncharted territories and seeks to discover new reliable front-end and UX techniques. And now, after 10 months of work, the book is ready, and it's shipping. Jump to table of contents and get the book right away.
Finding your way through front-end and UX these days is challenging and time-consuming. But frankly, we all just don’t have time to afford betting on a wrong strategy. Smashing Book 6 sheds some light on new challenges and opportunities, but also uncovers new traps and pitfalls in this brave new front-end world of ours.
Our books aren't concerned with short-living trends, and our new book isn't an exception. Smashing Book 6 is focused on real challenges and real front-end solutions in the real world: from accessible apps to performance to CSS Grid Layout to advanced service workers to responsive art direction. No chit-chat or theory. Things that worked, in actual projects. Jump to table of contents.
The Smashing Book 6, with 536 pages on real-life challenges and opportunities on the web. Photo by our dear friend Marc Thiele. (Large preview)
In the book, Laura and Marcy explore strategies for maintainable design systems and accessible single-page apps with React, Angular etc. Mike, Rachel and Lyza share insights on using CSS Custom Properties and CSS Grid in production today. Yoav and Lyza take a dive deep into performance patterns and service workers in times of Progressive Web Apps and HTTP/2.
Ada, Adrian and Greg explore how to design for watches and new form factors, as well as AR/VR/XR, chatbots and conversational UIs. The last chapter will guide you through some practical strategies to break out of generic, predictable, and soulless interfaces — with dozens of examples of responsive art direction. But most importantly: it’s the book dedicated to headaches and solutions in the fragile, inconsistent, fragmented and wonderfully diverse web we find ourselves in today.
Table Of Contents
Want to peek inside? Download a free PDF sample (PDF, ca. 21 MB) with a chapter on bringing personality back to the web by yours truly. Overall, the book contains 10 chapters:
Making Design Systems Work In Real-Life by Laura Elizabeth
Accessibility In Times Of Single-Page Applications by Marcy Sutton
Production-Ready CSS Grid Layouts by Rachel Andrew
Strategic Guide To CSS Custom Properties by Mike Riethmueller
Building An Advanced Service Worker by Lyza Gardner
Loading Assets On The Web by Yoav Weiss
Conversation Interface Design Patterns by Adrian Zumbrunnen
Building Chatbots And Designing For Watches by Greg Nudelman
Cross Reality And The Web (AR/VR) by Ada Rose Cannon
The cover was designed with love from Italy by one-and-only Chiara Aliotta. She founded the design studio Until Sunday and has directed the overall artistic look and feel of different tech companies and not-for-profit organizations around the world. We’re very happy that she gave Smashing Book 6 that special, magical touch.
Behind The Scenes Of The Design Process
We asked Chiara to share some insights into the design process of the cover and the interior design and she was very kind to share some thoughts with us:
"It all started with a few exchanges of emails and a Skype meeting where Vitaly shared his idea of the book and the general content. I had a lot of freedom, which is always exciting and scary at the same time. The only bond (if we want to call it like this) was that the "S" of Smashing Magazine should be the main protagonist of the cover, reinvented and creatively presented as per all the other previous Smashing Books.
I worked around few keywords that Vitaly was using to describe the book during our meetings and then developed an idea around classical novels of adventure where the main hero leaves home, encounters great hazards, risks, and then eventually returns wiser and/or richer than he/she was before.
So I thought of Smashing Book 6 as a way to propose this basic and mythic structure under a new light: through the articles of this book, the modern web designer will be experiencing true and deep adventures.
I imagined the "S" as an engine, the starting point of this experience, from where different worlds were creating and expanding. So the cover was the map of these uncharted territories that the book explores.
Every element on the cover has a particular meaning that constructs the S. Large view.
I am a person who judges books by its cover and having read some of the chapters and knowing some of the well-established writers, I wanted to honour its content and their work by creating a gorgeous cover and chapter illustrations.
For this edition of Smashing Book, I imagined a textile cover in deep blue, where the graphic is printed using a very old technique, the hot gold foil stamping.
Together with Markus, part of the Smashing Magazine team and responsible for the publishing of all the Smashing Books, we worked closely to choose the final details of the binding and guarantee an elegant and sophisticated result, adding a touch of glam to the book.
Smashing Book 6 comes wrapped with a little bookmark. Photo by our dear friend Marc Thiele.
As a final touch, I added a paper wrap around the book that invites the readers to "unlock their adventure", suggesting a physical action: the reader needs to tear off the paper before starting reading the book.
And for this only version, we introduced a customise Smashing Magazine bookmark, also in printed on gold paper. Few more reasons to prefer the paperback version over the digital ones!"
A huge round of applause to Chiara for her wonderful work and sharing the thoughts with us. We were remarkably happy with everything from design to content. But what did readers think? Well, I’m glad that you asked!
We've sent the shiny new book to over 200 people to peek through and read, and we were able to gather some first insights. We'd love to hear your thoughts, too!
“Web design is getting pretty darned complicated. The new book from SmashingMag aims to bring the learning curve down to an accessible level.”
“Just got the new Smashing Book 6 by SmashingMag. What a blast! From CSS Grid Layout, CSS Custom Properties and service workers all the way to the HTTP/2 and conversational interfaces and many more. I recommend it to all the people who build interfaces.”
“The books published by SmashingMag and team are getting better each time. I was thrilled to be able to preview it... EVERY CHAPTER IS GOOD! Having focused on a11y for much of my career, Marcy Sutton’s chapter is a personal favorite.”
The Smashing Book 6, with 536 pages on real-life challenges and solutions for the web. Huge thank-you note to the smashing community for supporting the book and out little magazine all these years. (Large preview)
Thank You For Your Support!
We’re very honored and proud to have worked with wonderful people from the industry who shared what they’ve learned in their work. We kindly thank all the hard-working people involved in making this book reality. We kindly thank you for your ongoing support of the book and our little magazine as well. It would be wonderful if you could mention the book by any chance as well in your social circles and perhaps link to this very post.
We’ve also prepared a little media kit .zip with a few photos and illustrations that you could use if you wanted to — just sayin’!
We can’t wait to hear your thoughts about the book! Happy reading, and we hope that you’ll find the book as useful as we do. Just have a cup of coffee (or tea) ready before you start reading, of course, stay smashing and... meow!
The cover was designed with love from Italy by one-and-only 
