With so many applications and services and people and machines and chatbots fighting for our attention, staying focused is a luxury that needs to be savored and protected, and so no wonder notifications don’t enjoy a decent reputation these days. More than that, often they feel off the point and manipulative, too. In this series of articles, Vitaly Friedman will talk about privacy-related design patterns. He’ll be exploring some of the respectful ways to approach privacy and data collection, and how to deal with those notorious cookie consent prompts, intrusive push notifications, glorious permission requests, malicious third-party tracking and offboarding experience.
Read more…
Many performance optimizations can be made when we can predict what users might do before they actually do it. Resource Hints are a simple but effective way that web developers can help the browser to stay one step ahead of the user and keep pages fast. Think of them as a way for the developer to tell the browser about what’s likely to happen in the future so that the browser can factor that into its choices for how it loads resources. In this article Drew McLellan will take a look at the main types of Resource Hints and when and where we can use them in our pages.
Read more…
Story structure can be the lens through which we view websites. It helps us step into the user’s shoes and understand where and how users interact with our websites. The user finds themselves on a journey through your website on the way to their goal. If you can see this journey from their perspective, you can better understand what they need at each step, and align your goals with theirs. We, web professionals and site owners, are characters in their story and it’s about time we acted like it.
Read more…
Whether you’re a designer or developer, it can be challenging to stay current in this fast-paced world where it feels like new tools are Product Hunted on a weekly basis. If you’re working in a larger team, and especially if you’re working in an enterprise or b2b (business-to-business) context, being able to make even small improvements in efficiency can lead to huge increases in the effectiveness of your design organization. In this article Paul Hanaoka will show you how large teams can benefit from using more open, collaborative tooling and how to make adoption and migration feasible and pleasant.
Read more…
Implementing design ethics, tech ethics, or business ethics as individual responsibilities might seem like a quick and easy solution, however, it’s not a very effective one as they all lack context when they don’t have support from other people who provide the foundation for their work. From browser news to UI/UX advice and handy tips, tricks, and tools, Anselm Hannemann summarized the latest resources to help you master your daily front-end and design challenges.
Read more…
Last year, Rachel Andrew wrote “Take A New Look At CSS Shapes” where she reintroduced readers to the basics of using CSS Shapes. In this new tutorial, Andy Clarke expands on the topic of “Art Direction for the Web” with CSS Shapes to create exciting and inspired new design ideas. Andy is going to show you how to use CSS Shapes to create the following five different types of layout: v-shapes, z-patterns, curved shapes, diagonal shapes, and rotated shapes.
Read more…
Now cookie prompts aren’t particularly useful, but they certainly helped raise awareness about privacy and data collection on the web. In fact, users now know that websites track their data, which they weren’t aware of a few years ago. But they often see it as a necessary evil in exchange for accessing the content “for free.” This series of articles is about privacy-related design patterns. Vitaly Friedman will be exploring some of the respectful ways to approach privacy and data collection, and how to deal with those notorious cookie consent prompts, intrusive push notifications, glorious permission requests, malicious third-party tracking and offboarding experience.
Read more…
Exploiting a security flaw is often about getting multiple small pieces to line up. Every bit of JavaScript you add to a site is a potential way in for a hacker. This is doubly true if that JavaScript is hosted by someone else, such as on a public CDN. Subresource Integrity is a browser feature you can use to make sure that the code being used is exactly what you intended. In this article, Drew McLellan will take a look at what SRI is, how it can help protect you, and how you can start using it in your own projects, not just for files hosted on CDNs.
Read more…
We talk a lot about Flexbox and CSS Grid Layout, but these layout methods are essentially values of the CSS display property, a workhorse of a property that doesn’t get a lot of attention. Rachel Andrew takes a better look in a short series. Rachel is going to take a look at the way that the values of display are defined in the Level 3 specification. This is a change to how we defined display in earlier versions of CSS. While it may seem unusual at first, we think these changes really help to explain what is going on when we change the value of display on an element.
Read more…
WebAssembly is a new language that runs in the browser alongside JavaScript. In this article, Robert Aboukhalil explores how you can speed up web applications by replacing slow JavaScript calculations with compiled WebAssembly. This is a case study on using WebAssembly to speed up a data analysis web tool. To that end, Robert will take an existing tool written in C that performs the same computations, compile it to WebAssembly, and use it to replace slow JavaScript calculations.
Read more…