• A Showcase Of Lovely Little Websites

    A map that blends past and present, a musical time machine bringing back distant memories, or an interactive graphic novel pulling you deeper and deeper into a powerful story — sometimes you come across a lovely little website that, well, instantly conquers your heart. It doesn’t necessarily have to be overly useful or practical. Instead, […]

    READ MORE
  • Adding A Dyslexia-Friendly Mode To A Website

    Dyslexia is perhaps the most common learning disorder in the world, affecting somewhere between 10–20% of the world’s population. It can cause difficulties with reading, writing, and spelling, though the degree of impairment varies widely — some people are barely affected while others require a great deal of extra support. Existing best practices and guidance, […]

    READ MORE
  • Smashing Workshops: Winter 2021

    For many of us, personal workspace can feel quite comfortable and convenient, but nobody really wants to sign up for another full day of focused screen time. That’s why we break our online Smashing workshops down into 2.5h-sessions — with one session per day. This way, you always have enough time take it all in, […]

    READ MORE
  • Improving The Performance Of Wix Websites (Case Study)

    A website’s performance can make or break its success, yet in August 2020, despite many improvements we had previously made, such as implementing Server-Side Rendering (SSR), the ratio of Wix websites with good Google Core Web Vitals (CWV) scores was only 4%. It was at this point that we realized we needed to make a […]

    READ MORE
  • Next.js Wildcard Subdomains

    A “wildcard”? What in the world? Great question, these types of domain stem from Wildcard DNS Records which look like this: *.example. 3600 TXT “Wild! You have found a wildcard.” When used, this DNS record will cause any subdomain that matches with the wildcard to hold a TXT value of: “Wild! You have found a […]

    READ MORE
  • A Guide To Modern CSS Colors With RGB, HSL, HWL, LAB and LCH

    There’s more to color on the web than meets the eye, and it’s about to get a lot more interesting! Today, we’ll take a look at the best ways to use colors in a design system, and what we can expect from our colors in the not-too-distant future. Well-Known Color Values There are many different […]

    READ MORE
  • Meet Touch Design For Mobile Interfaces, A New Smashing Book By Steven Hoober

    Mobile and touch are the new normal for computing, but there remain a lot of myths, rumors, errors, bias, and out-of-date information on how portable touchscreens are used. Let’s change that!In our brand-new book Touch Design for Mobile Interfaces, Steven Hoober shares his in-depth research about designing for touch as well as tips, tricks, trends, […]

    READ MORE
  • Powerful Terminal And Command-Line (CLI) Tools For Modern Web Development

    Many modern programmers, including front-end and full-stack developers, work daily with the command line. Even those who are relatively new to web development are picking up command-line skills early and finding practical tools and utilities to enhance their productivity in the terminal. This post presents a categorized list of many command-line apps I’ve personally discovered […]

    READ MORE
  • Useful React Hooks That You Can Use In Your Projects

    Hooks are simply functions that allow you to hook into or make use of React features. They were introduced at the React Conf 2018 to address three major problems of class components: wrapper hell, huge components, and confusing classes. Hooks give power to React functional components, making it possible to develop an entire application with […]

    READ MORE
  • From Good To Great In Dashboard Design: Research, Decluttering And Data Viz

    Even if it’s a blessing in disguise, discarding elements of your work is no fun. Tossing out suboptimal parts of our design can be a daunting task, especially after you’ve invested hours of work into it. But make no mistake, this is a bias most designers are prone to. We can get too attached to […]

    READ MORE
  • Localizing Your Next.js App

    Instructing Next.js your app intends to have routes for different locales (or countries, or both) could not be more smooth. On the root of your project, create a next.config.js if you have not had the need for one. You can copy from this snippet. /** @type {import(‘next’).NextConfig} */ module.exports = { reactStrictMode: true, i18n: { […]

    READ MORE
  • Automatically Transforming And Optimizing Images And Videos On Your WordPress Website

    So, you want to give personality to your site by making it stand out from all other websites out there. To do that, you develop a personalized design style, including a certain combination of colors, typography, spacing, animations, and others, and apply the style consistently throughout your site. An example in case is this same […]

    READ MORE
  • Meet Hydrogen: A React Framework For Dynamic, Contextual And Personalized E-Commerce

    As developers, we rightfully obsess about the customer experience, relentlessly working to squeeze every millisecond out of the critical rendering path, optimize input latency, and eliminate jank. At the limit, statically generated, edge delivered, and HTML-first pages look like the optimal strategy. That is until you are confronted with the realization that the next step […]

    READ MORE
  • The Value Of Concept Testing As Part Of Product Design

    UX design teams are passionate about our approach to solving problems and providing users with experiences that lead to their desired outcomes. Without some type of user input guiding our process, we are left being directed by the same high-level stakeholder assumptions we often rally against as being the antithesis to UX: those holding the […]

    READ MORE
  • Smashing Podcast Episode 43 With Matthew Phillips: What Is Astro?

    In this episode, we’re talking about Astro. Will this modern static site builder launch you into the stratosphere? Drew McLellan talks to developer Matthew Phillips to find out. Show Notes Astro Matthew’s personal site Matthew on Twitter Weekly Update Optimizing Next.js Applications With Nx written by Melvin Kosisochukwu Eye-Tracking In Mobile UX Research written by […]

    READ MORE
  • GraphQL On The Front-End (React And Apollo)

    One of the main benefits of GraphQL is the client’s ability to request what they need from the server and receive that data exactly and predictably. Without much effort, one can easily pull nested data by just adding more properties to our queries instead of adding multiple endpoints. This prevents issues like over-fetching that can […]

    READ MORE
  • A Deep Dive Into Serverless UI With TypeScript

    If you’ve been looking for a clear explanation of how applications can be developed and deployed to AWS with less configuration as possible, then I’ve prepared just the article for you. We’ll be breaking it all down into two parts: deploying a static web application (in this case a Notes application), and then a serverless […]

    READ MORE
  • Creating A Magento PWA: Customizing Themes vs. Coding From Scratch

    When dealing with e-commerce at some point, you probably have heard, and perhaps used Magento, an open-source e-commerce platform. However, what if you want to build a progressive web app with Magento? Is it a good idea, why would you want to build it, and how would you go around building it? Why Do Business […]

    READ MORE