Smashing Newsletter: Issue #198

Editorial

The past years have been remarkable for web technologies. Accessibility and performance have finally become established, well-recognized pillars of user experience. However, there’s still something that seems to be too often forgotten or ignored or even dismissed for the sake of business goals. It’s respect.

We’ve all faced a flashy pop-up over here, an annoying notification nagger over there, a third-party email blast every other month. There are so many shady practices and dirty little tricks that scream to keep customers’ attention or drive them to decisions that they don’t want to make. Even though we’re good at protecting ourselves against some of them with content blockers (rightfully so!), there still isn’t much one can do beyond that.

While I sincerely appreciate the efforts that go into performance and accessibility work, I’d love to see a stronger push towards respect in 2018 — towards privacy, security, inclusivity, authenticity, personality and ethics. They might not sound particularly enticing at first, but I strongly believe that they produce something that people can connect to — and hopefully will.

Arrrr! Let’s keep those nasty dark patterns out of the way!

It’s not OK when a service manipulates its customers, abusing their psychology, so that they would please-oh-please waste more time with it. It’s not OK when it’s painfully difficult to delete an account. It’s not OK when a service abuses privacy and customer’s data and happily sends them over to third-parties.

So, here’s a start-up idea: If you want to “disrupt” anything, make sure to bring the focus to privacy, inclusivity and ethics of your product. Design your principles, stick to them and make them noticeable. Don’t try to outperform with features. Outperform by being authentic in your small niche, and have values that people can genuinely connect to. Think about offboarding and the data you collect. Think about third-party scripts, and contain them.

And share. Share what you’ve learned. Share case studies on how this focus has helped your company get better. I would love to see more websites demonstrate the impact of ethics and privacy on user experience metrics and business metrics (like WPO Stats does). It’s about time to take a strong stand against all the shady and dark practices that have found their way into our interfaces over the years — at least that’s the mission I’m strongly committed to.

Stay on the bright side of things!
Vitaly (@smashingmag)

The Laws Of UX
Improve Your Webpack Build Performance
Get To Grips With The Tough Parts Of JavaScript
An Open-Source, Community-Driven Linting Tool
Source Code Made Beautiful
Tips For Dealing With Third-Party Scripts
No, You Go
Dada Data: Avant-Garde Brought To The Web

1. The Laws Of UX

Fitt’s Law, Miller’s Law, the Serial Position Effect. Do you know what’s lies behind those names? If not, Laws Of UX will shed more light on their meaning. This lovely website explains the ten key maxims that designers can consider when building user interfaces. (cm)

2. Improve Your Webpack Build Performance

Webpack is a fantastic, versatile tool, but it can be difficult to optimize. If you want to tackle the challenge of giving your Webpack setup a power boost, Rowan Oulton has prepared just the right read for you: A “Field Guide For Better Build Performance” that shares what the Slack engineering team learned on their optimization endeavour.

The efforts were worth it: The techniques helped reduce the median build from 170 to 17 seconds and, thus, improved the experience for the team’s engineers by far. (cm)

3. Get To Grips With The Tough Parts Of JavaScript

You think you know JavaScript? Kyle Simpson claims you don’t. Or, well, that’s at least the title of his book series “You Don’t Know JavaScript”, and the reason why he offers the books about the core mechanisms of the language for free online reading.

The series consists of six books which are still in draft mode but which will be edited, produced and published with the support of O’Reilly. (cm)

4. An Open-Source, Community-Driven Linting Tool

Narwhals have one of the best sonars in the animal kingdom, and now they are also name givers for a new linting tool that wants to help you build better websites: Sonarwhal. Just like its animal brother, the tool is a master when it comes to detecting things that easily stay unseen: accessibility burdens, interoperability, performance or security pitfalls.

To lint your code for best practices and common errors, Sonarwhal relies on existing tools and services instead of trying to reinvent the wheel. aXe is built in for accessibility, for example, SSL Server Test to check certificate configuration. To get the most out of the whale’s mighty powers, you can adapt the linter to your needs and customize which aspects you want to get feedback on. (cm)

5. Source Code Made Beautiful

Let’s say you’ve coded an impressive workaround or another piece of code you’re proud of and want to share it on Twitter or in a blog post. You might want to use an image with it, but feel that a screenshot of your code editor window isn’t, well, aesthetically pleasing enough? That’s exactly what the folks at design and development studio Dawn Labs had in mind when they created Carbon.

Carbon provides a way to create beautiful images of your source code. Just drop a file into the browser-based editor, paste your code directly, or append a GitHub gist to the URL, and Carbon turns your source code into an image that looks a lot sleeker than a simple screenshot. To customize the image, you can change the syntax theme, background color, window theme and even padding. No more ugly screenshots to back up a brilliant code snippet. (cm)

6. Tips For Dealing With Third-Party Scripts

“There’s nothing quite so crushing as building a beautifully performant website only to have it infested with a plague of third-party scripts that add to the weight of each page and reduce the responsiveness, making a mockery of your well-considered performance budget.” The statement comes from Jeremy Keith. But what can you do to keep invisible performance costs low?

Trent Walton also has a precious tip to share on dealing with third-party scripts. To see all the third-party requests included with a webpage, we have several options, but if we want to itemize that information and make it portable, the process, unfortunately, isn’t as straightforward. The solution: From inside your browser’s inspector, save the requests in a HAR file, and open it with a tool that can parse JSON. Now you have all requests in one place, ready to be examined further. (cm)

7. No, You Go

A CEO, an engineer, and an author walk into a bar. Sounds good? Well, replace the bar with a couch, add some wine, and you’ve got the basis for a brand-new podcast which is definitely worth tuning into: “No, You Go”.

Every week, Katel LeDû (CEO of A Book Apart), front-end developer Jenn Lukas, and author and content specialist Sara Wachter-Boettcher invite a guest to talk about being ambitious, building a career and navigating life’s uncertainties. (cm)

January 30, 2018 Smashing Newsletter: Issue #198

Previous Issues