• A Time Of Transition (October 2021 Desktop Wallpapers Edition)

    Inspiration lies everywhere. In the fall leaves shining in the most beautiful colors these days, in the misty mornings and golden afternoons that October might bring along, or taking a walk on a windy day. Whatever it is that gets you inspired, our monthly wallpapers series is bound to give you a little inspiration boost, […]

    READ MORE
  • Using Modern Image Formats: AVIF And WebP

    Images are the most popular resource type on the web and are often the largest. Users appreciate high-quality visuals, but care needs to be taken to deliver those hero images, product photos and cat memes as efficiently and effectively as possible. If you’re optimizing for the Web Vitals, you might be interested to hear that […]

    READ MORE
  • Improving The Accessibility Of Your Markdown

    Markdown is a small text to HTML conversion language. It was created by John Gruber in 2004 with the goal of making writing formatted text in a plain text editor easier. You can find Markdown in many places on the internet, especially in locations where developers are present. Two notable examples are comments on GitHub […]

    READ MORE
  • Let’s Dive Into Cypress For End-to-End Testing

    Software development without automated testing is hard to imagine today. A good variety of different test procedures will ensure a high level of quality. As a foundation for testing, we can use a number of unit tests. On top of that, in the middle of the pyramid, so to speak, are integration tests. End-to-end tests […]

    READ MORE
  • Rebuilding A Large E-Commerce Website With Next.js (Case Study)

    At our company, Unplatform, we have been building e-commerce sites for decades now. Over those years, we have seen the technology stack evolve from server-rendered pages with some minor JavaScript and CSS to full-blown JavaScript applications. The platform we used for our e-commerce sites was based on ASP.NET and when visitors started to expect more […]

    READ MORE
  • Free Online Workshop: Frustrating Design Patterns And How To Fix Them

    Disabled buttons. Infinite scroll. Poor inline validation. Parallax. Carousels. Modals. Mega-dropdown hover menus. There is plenty of frustration on the web. Let’s fix that. Join us for a free online workshop on Frustrating Design Patterns on Monday, September 27 at 9:00 AM PDT / 6PM CET. In the 2.5h live session we’ll take a close […]

    READ MORE
  • Simplifying Form Styles With `accent-color`

    I don’t know about you, but I love it when new CSS properties arrive that make our daily lives as developers simpler and enable us to remove a whole lot of redundant code. aspect-ratio is one such property (recently eliminating the need for the padding hack). accent-color just might be the next. Styling Form Inputs […]

    READ MORE
  • Getting Your `head` Straight: A New CSS Performance Diagnostics Snippet

    There are plenty of ways to detect performance bottlenecks and audit CSS. We can look into common performance bottlenecks and the complexity of stylesheets, the way we load assets, and the order in which it happens. One helpful way to spot common problems easily is to use some sort of a performance diagnostics CSS — […]

    READ MORE
  • How To Build Your Own Mouseless Development Environment

    Once upon a time, in the magical land of Software development, there was a young developer, your humble servant, discovering Linux for the first time. Suddenly, I had access to the Linux shell, a tool offering many ways to automate everything I didn’t want to do again and again. But Ubuntu wasn’t without drawbacks. I […]

    READ MORE
  • How Web Development Tools Are Helping Users Keep Pace With Rapid Change

    Several years ago, I wrote about website builders for a living. Yes, that’s a thing. Back then there seemed to be a gulf between drag-and-drop tools and full-blown web development. Today, it’s heartening to see the likes of Wix adding more code-heavy options to their repertoire. Judging by Velo by Wix’s report, I’m not alone […]

    READ MORE
  • Are Imposter Domains Re-Publishing Your Website?

    We think of web scraping as a tool used to harvest web content for information analysis purposes, sometimes to the detriment of the site owner. For example, someone might web scrape all the product pages of a competitor’s retail site to harvest information about products being offered and current pricing to try to gain a […]

    READ MORE
  • Monetize Open-Source Software With Gatsby Functions And Stripe

    In this article, I’ll be explaining how I’ve used Gatsby Functions and the Stripe API to enable secure “Pay what you want” contributions that help fund my open-source project MDX Embed. Note: MDX Embed allows you to easily embed popular third-party media content such as YouTube videos, Tweets, Instagram posts, Egghead lessons, Spotify, TikTok and […]

    READ MORE
  • Web Quality Assurance: From User Requirements To Web Risk Management

    As a chemist by trade, I received a Master’s degree in Quality Management and Quality Control from Bordeaux University. My initial career was in the wine industry, ensuring the quality of the laboratory’s operations and the analyses that came out of it. As a side note, the last question of my job interview as quality […]

    READ MORE
  • Reasons To Build A CRM-Powered Website For Your Business

    Most businesses today rely on simple brochure websites for their online presence. These tend to be static websites with a few pages giving core information about the business and details on products and services offered. Although these are relatively cheap and less complicated to develop than a site that offers more advanced user experiences, a […]

    READ MORE
  • Reducing The Need For Pseudo-Elements

    Per the W3C spec, “a pseudo-element represents an element not directly present in the document tree”. They have been around since version 1 of the CSS specification, when ::first-letter and ::first-line were introduced. The popular ::before and ::after pseudo-elements were added in version 2 — these represent content that does not exist in the source […]

    READ MORE
  • The Power Of Pen And Paper Sketching

    Need to design something? It can be tempting to start with a computer-based tool, e.g. wireframing software like Balsamiq, or design tools like Photoshop or Figma. These have their place, but I would recommend stepping back and starting with the humble pen and paper. Sketching by hand can feel unfamiliar and uncomfortable to those who […]

    READ MORE
  • Orchestrating Complexity With Web Animations API

    There’s no middle ground between simple transitions and complex animations. You’re either fine with what CSS Transitions and Animations provide or you suddenly need all the power you can get. Web Animations API gives you a lot of tools to work with animations. But you need to know how to handle them. This article will […]

    READ MORE
  • Web Design Done Well: Excellent Editorial

    A lot of web design talk concerns itself with what goes on around content. Page speed, design systems, search engine optimization, frameworks, accessibility — the list goes on and on. This gives us at Smashing Magazine plenty to write about, which is great, though it’s worth reminding ourselves what it’s all in service of. In […]

    READ MORE
  • Using SWR React Hooks With Next.js’ Incremental Static Regeneration (ISR)

    If you’ve ever used Incremental Static Regeneration (ISR) with Next.js, you may have found yourself sending stale data to the client. This occurs when you are revalidating the page on the server. For some websites this works, but for others (such as Hack Club’s Scrapbook, a site built by @lachlanjc that I help maintain), the […]

    READ MORE
  • Developer Decisions For Building Flexible Components

    In the real world, content often differs vastly from the neat, perfectly fitting content presented in designs. Added to that, on the modern web, users have an ever-increasing range of options for how they access the sites we build. In this article, we’ll walk through the process of taking a seemingly simple design for a […]

    READ MORE