Review: New Frontiers in Web Design

Last week I had the chance to read New Frontiers in Web Design, the latest in the series of Smashing Books. It just came out and is full of interesting knowledge for people who work on the web in 2018. From CSS custom properties to advanced service workers to bringing personality back to the web.

What’s it about?

Let’s dive right into it. The book consists of 10 chapters, all about different subjects.

Design systems

No elephants in the room were avoided in this chapter about design systems. I loved reading what Laura Elizabeth said about the idea some have of design systems: that they are somehow quite trivial. Creating, promoting and maintaining design systems isn’t simple, and Laura brilliantly shows this. The list of questions to answer for management is very useful.

Accessibility in SPAs

Marcy Sutton writes about the accessibility of Single Page Applications. She shows common pitfalls and how to avoid them. Marcy also goes into managing focus, focusless announcements and when to use which. Later in the chapter she explains how to do automated tests and what they can test for.

Grid Layout in production

In this chapter, Rachel Andrew talks about Grid Layout in the real world. She explains most if not all of the cool things Grids let you do, and explains what one can do about fallbacks using Grid Layout’s built-in scenarios (‘new layout knows about old layout’).

Custom Properties in CSS

Mike Riethmuller contributed a chapter about Custom Properties. I learned various things, like that the var() function takes a fallback value, and that you could use calc() to give unitless custom property values a unit. His examples of writing way fewer CSS rules, by updating values, not which property is being used, are an invitation to go and use this stuff now.

Service Workers

Lyza D. Gardner’s chapter about Advanced Service Workers is great: it is advanced, but explains basic concepts, too. That made it easier to follow along. It reminds of how hard caching can be, and contains some nifty tricks, like giving your Service Worker an ID, that you can use when cleaning out old caches. The chapter also does a great job explaining push notifications and background sync.

Loading resources

‘Loading resources on the web is hard’, concludes Yoav Weiss in his chapter about loading our websites faster. He talks about how websites load and discusses a wide variety of strategies to optimise loading. Both old school classics and fancy new features. One interesting reminder early in this chapter is that HTML is progressive, which makes it load faster than anything as browsers can start processing it when only part of it was downloaded.

Designing conversations

Adrian Zumbrunnen explains what’s important when designing a bot to talk to, and behaving human-like is one of those things, he says. It made me think about how human customer service often offers a robot-like experience, in that their agents strictly stick to their scripts. If we design conversations with bots to be more human, will all conversations end up being very similar?

Chatbots and virtual assistents

Continuing from designing conversations, the next chapter is about engineering them. Greg Nudelman talks about creating plugins for voice assistants as well as standalone bots. As an engineer, I found it a fascinating insight in how this stuff works. As a citizen slash consumer, I would dislike any services that replace their friendly and smart humans with statistical analysis. That may be just me.

Cross reality

Cross reality is the umbrella term for virtual, augmented and mixed reality. In this chapter Ada Rose Cannon explains how to create scenes in browsers, using web standards and some libraries that abstract them. She also goes into improving rendering performance and there’s a useful list of things she wished she had known when she began.

Making it more personal

The last chapter in the book is written by Mr Smashing himself. Vitaly Friedman tells us all about how to put more personality into our work. Earlier this year, I saw him talk about the same at ICONS in Amsterdam. Vitaly encourages us all to create more interesting things. The theme resonates a lot with me. Yes, we need more things that are visually interesting and different. We also need more things that have well considered UI patterns, that ‘exceed expectations’, as Vitaly writes.

My thoughts

Reading this book feels a bit like going to a good conference. There is lots of variety, plenty to learn and you get away with stuff to try out on your project when you get back to work.

There is also lots of variety within each chapter. I felt some chapters covered too much, they could have been more concise. The upside is that you get a lot of content for your money, so there’s that.

One other thing that could be improved is the way references work: footnotes contain just (shortened) URLs, which obfuscates their original address. It may be just me, but I like seeing the name of the author and the name of the post/page being cited, to connect dots quicker.

If a majority of the covered subjects piques your interest, don’t hesitate to buy Smashing Book #6. There will be plenty of new things to learn. Regarding the physical book: I have not seen it yet, but going by the tweets, the hardcover edition is beautiful, so that is one to consider.