Dear Friend,
Over the last months we've been exploring the idea of arranging a little Smashing stand at conferences. Not a big deal really — a few stickers, postcards, goodies and of course our printed books; somewhere in a remote corner of those long exhibition areas. We thought it would be a great opportunity to be visible for our wonderful community, and talk to people shaping it across the world.
And so as I was standing at those little stands during the breaks, I'd see people floating by with a cup of coffee, picking up a few cat stickers and moving on. Some would ask where we are from, and some would flip through the books. Every now and again somebody would approach the stand slowly, with an incredibly kind, warm and caring smile.
They would say hello and strike a conversation. They would share their story — their smashing story. The first sleepless nights spent on resolving our infamous Mystery Riddles, the good ol' days of Smashing Book 1, the anticipation of the new monthly desktop wallpapers, the first newsletter issue they subscribed to, and those CSS articles that made a difference on a tight deadline back in 2010.
I was overwhelmed by remarkable personal and professional stories on how our little publication helped during hard financial times for families or in tough projects at work, or in schools, universities and even in remote book clubs in Serbia, Portugal, Philippines and Brazil. As the conversations would fade away, I felt incredibly grateful for those stories, and couldn't say anything but thank you with a smile on my face.
In the end, that's what matters. Not endless A/B tests, nor the exact border-radius
values for rounded corners, nor the shade of blue for that fancy button. It's about standing for something that matters, being honest, kind and respectful, and being helpful for somebody out there.
Pixels do matter after all. You never know how something you're working on this very moment might affect somebody's life, work, career and even family. So let's design good pixels — the ones that help people make a positive contribution to their work and their life.
Especially in times when we all are running somewhere, stop and think for 10 seconds of how you could help people working with you, and what you could do for them, rather than what they could do for you. Be positive, and stream warmth and energy at people around you. Care about them. Make their lives a bit better every day. And don't forget to say thank you to all the wonderful people who help you get stronger, better, smarter and kinder every now and again.
So thank you. And please drop by at the next events if you see us somewhere in a remote corner of the conference hall. I can't wait to hear your smashing stories.
Here's one for the good pixels!
— Vitaly (@smashingmag)
Table of Contents
1. Get Ready For Gutenberg
The upcoming WordPress 5.0 release, namely the new Gutenberg Editor, which is scheduled for November 19, causes a lot of controversies. From the editor to third-party plugins, and even your theme — the new version is about to change everything, marking WordPress' attempt to push itself from being a CMS towards a website building space.
Most themes and plugins have to be updated to work with Gutenberg, so testing is crucial these days to prevent your site from breaking as soon as the update rolls out. The folks at Kinsta summarized how you can prepare for this major change.
If you're not ready for Gutenberg yet, our former WordPress editor Jeff Star built a plugin that lets you replace the Gutenberg Editor with the Classic Editor. You can also enable the new editor selectively for only a few posts or pages. (cm)
2. Making The World Wide Web Worldwide
How should you tackle an international project that goes beyond the usual left-to-right reading direction and standard Latin character set? The W3C compiled a comprehensive guide to internationalization techniques that help you author HTML and CSS for international audiences.
It includes tips for everything from choosing and declaring the character encoding and identifying in-document language changes to adapting the markup, styling, layout, and navigation to the project's needs. Handy! (cm)
3. SmashingConf San Francisco 2019 (Apr 16-17)
Here we go again! After a wonderful NYC event, we're getting ready for the next adventure: SmashingConf SF. We're happy to welcome Miriam Suzanne, Chris Coyier, Jennifer Brook, and Sara Soueidan among the first confirmed speakers. We'll be exploring practical front-end techniques and design strategies — mostly in live design and live coding sessions.
Tickets? Glad you asked! Just 2 super-early-birds are left!
SmashingConfs are friendly, inclusive events focused on real-world problems and solutions.
We'll dive into new challenges, solutions, and opportunities: from front-end performance and serverless to design workflow, refactoring and moving to a static site setup — all the way to CSS Grid techniques, better estimates and deployment patterns for HTTP/2. Plus a bunch of hands-on workshops on design, front-end and UX. Ah, need to convince your boss? Download the "Convince Your Boss" PDF (602 KB).
And if you can't make it to SF, we'd love to welcome you at SmashingConf Toronto 2019 later that year. We'd love to see you there! ❤️ (cr)
From our sponsor
Convince Stakeholders About UX
Ever had stakeholders argue with your design decisions? Or, struggle to get a seat at the strategy table? Stakeholders won't invest in UX without proven results. That's why it's so crucial to learn how to measure its value.
Get yourself a seat at The Quantitative UX Blueprint Masterclass, where you will learn:
• The #1 reason most UX designers don't track metrics.
• How to identify key metrics for your projects that make the business case for UX.
• Exactly where to find the numbers you need to get your hands on.
It's time to get data-driven so you can finally get buy in for UX. Sign up for free →
4. Open-Source Contributions Visualized
If you want to understand how people and organizations are interacting with your open-source project on GitHub, the contributor relationship management system Measure is for you. It provides easy-to-understand widgets which you can assemble into dashboards to get an overview of your repositories as well as statistics on pull requests, issues, and responses. Please note that Measure is still a prototype. As the creators point out, everything should work as expected, but documentation is lacking and setup is still manual. (cm)
5. CSS Houdini: Random Irregular Grid
Vincent De Oliveira shows us some cool CSS Houdini magic: a random irregular grid. Each item on the grid is clipped by a mask generated by the paint worklet. The grid is fully responsive and works in Chrome and Opera. In browsers which don't support the Paint API or if JavaScript is disabled, you get a classic grid. Clever! (cm)
From our sponsor
New Adobe XD CC 13.0 — The Future Of Experience Design Is Here
Adobe XD is made for designers like you, by designers like us. It's the fastest way to design, prototype, and share any user experience, from websites and mobile apps to voice interactions. Easily create beautiful animations that move, scale and blur across artboards. Build realistic voice prototypes for Amazon Alexa, Google Assistant, and more. Design and resize elements for different screens. And extend your design versatility with new plugins and app integrations for Slack, JIRA, Microsoft Teams, and more. Download for free →
6. Intersecting Columns With CSS Grid
Imagine you want to build a layout which allows you to have an aside column for sidenotes, but at the same time offers a way to place something to the full width of the grid or in the place of both content and aside columns. Roman Komarov shares a trick with grid-template-areas that helps you put your idea of intersecting columns or rows to practice.
Speaking of CSS Grid: If the Grid syntax still feels a bit daunting to you, Zell Liew shares some useful tips to help you remember Grid properties and values for good. (cm)
7. How To Organize Your Git Branches
There are many ways to organize your Git branches. Darío Kondratiuk gives a nice overview over possible approaches: Gitflow with steroids, Branch-Push-Merge-Prune, Version-based, and even Emoji-based, to name a few. Maybe it's time to rethink your workflow? (cm)
8. The Deliverable That Matters
Detailed wireframes, high-fidelity comps, and motion prototypes. Often they are considered critical deliverables, but, as Josh Clark argues, those design artifacts are unimportant; the only deliverable that matters is the product itself. A good read about how Josh has shifted his process to enable better collaboration between designers and developers. And how you can do too, of course. (cm)
From our sponsor
Online Masters in Information Design and Strategy
Earn your master's degree online.
9. Kill Your Old Idols, Find Something New
Who doesn't love to discover a new book or a new playlist to send your mind on a journey and spark your imagination? The social platform insp.re helps you find such new treasures and collect the books and music you'd love to share with others. Once you signed up, you can follow people, browse through their collections, and add your discoveries to your profile. The focus lies on releases of small and independent publishers, so chances to discover a real treasure look quite good. (cm)
10. Upcoming In Smashing Membership
We recently added our newest book Form Design Patterns to the Smashing Membership, an eBook on designing and coding accessible and progressively enhanced web forms. The eBook is included in the Smashing Membership. Each member makes a difference and gets valuable content from it, too!
Coming up today:
We are very grateful for the kind and generous support of 1,275 members. Thank you so much for making it happen!
11. Our Next Smashing Workshops
In our workshops, we are looking into the current state of front-end and interface design, covering advanced challenges and actual real-life solutions to front-end problems. Coming up next:
🇧🇬 Sofia, Bulgaria, UX Sofia, Nov. 7th, 2018
🇬🇧 Belfast, Northern Ireland, Pixel Pioneers, Nov. 22nd, 2018
Or, if you'd like to run an in-house workshop at your office, please get in touch with Vitaly at vitaly@smashingconf.com and briefly describe what problems you're facing and would like to solve. Don't worry about the costs — we'll find a fair price for sure. Get in touch — it's that easy!
12. New On Smashing Job Board
- Sr UX/UI Designer-Mobile at Funding Circle (San Francisco, CA)
"Close-knit in-house design team seeks a talented UX/UI Mobile Designer who shares our passion for creating the best in-class user experiences. You will be responsible for all stages of design in a given product area." - UX/UI Junior Designer (C2H) at XUMO (Los Angeles, CA or Irvine, CA)
"This is a unique opportunity for a young professional with exceptional communication skills, a passion for television and/or streaming media, and a desire to develop their career in UI/UX design at the intersection of the entertainment media and technology industries." - Digital Designer at The Nature Conservancy (Arlington, VA)
"The Nature Conservancy is looking for a talented, innovative and collaborative visual designer. He/She will join a small, creative team leading the effort to build and evolve The Nature Conservancy's online brand identity and visual vocabulary."
13. Popular Articles This Month
- Splicing HTML's DNA With CSS Attribute Selectors
Attribute selectors are magical. They can get you out of sticky problems, help you avoid adding classes and point out some problems in your code. But don't worry, while attribute selectors are complex and powerful, they're easy to learn and easy to utilize. - Smart Bundling: How To Serve Legacy Code Only To Legacy Browsers
While effective bundling of resources on the web has received a great deal of mindshare in recent times, how we ship front-end resources to our users has remained pretty much the same. Is it time we rethink asset delivery for the modern web? - Photoshop Workflows And Shortcuts For Digital Artists
Photoshop is what many digital artists, photographers, graphic designers, and even some web developers have in common. What sets us apart is how we use the tool. In this tutorial, Yoanna Victorova shares her most often used Photoshop shortcuts.
This newsletter issue was written and researched by Cosima Mielke, Iris Lješnjanin, Vitaly Friedman, Markus Seyfferth and Christiane Rosenberger.
Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You rock.
Follow us on Twitter • Join us on Facebook