Menu Search
Jump to the content X X
SmashingConf London Avatar

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf London, dedicated to all things web performance.

A Comprehensive Guide To Web Design

(This is a sponsored post). Web design is tricky. Designers and developers have to take a lot of things into account when designing a website, from visual appearance (how the website looks) to functional design (how the website works). To simplify the task, we’ve prepared this guide.

A Comprehensive Guide To Web Design

In this article, I’ll focus on the main principles, heuristics and approaches that will help you to create a great user experience for your website. I’ll start with global things like the user journey (how to define the “skeleton” of the website) and work down to the individual page (what should be considered during web page design). We’ll also cover other essential aspects of design, such as mobile considerations and testing.

Read more...

Monthly Web Development Update 11/2017: Browser News, KRACK and Vary Header Caching

Editor’s Note: Our dear friend Anselm Hannemann summarizes what happened in the web community in the past few weeks in one handy list, so that you can catch up on everything new and important. Enjoy!

Monthly Web Development Update November 2017

Welcome back to our monthly reading list. Before we dive right into all the amazing content I stumbled upon — admittedly, this one is going to be quite a long update — I want to make a personal announcement. This week I launched a personal project called Colloq, a new conference and event service for users and organizers. If you’re going to events or are organizing one or if you’re interested in the recorded content of conferences, this could be for you. So if you like, go ahead and check it out.

Read more...

Advertise with us!

Using CSS Grid: Supporting Browsers Without Grid

When using any new CSS, the question of browser support has to be addressed. This is even more of a consideration when new CSS is used for layout as with Flexbox and CSS Grid, rather than things we might consider an enhancement.

Using CSS Grid: Supporting Browsers Without Grid

In this article, I explore approaches to dealing with browser support today. What are the practical things we can do to allow us to use new CSS now and still give a great experience to the browsers that don't support it?

Read more...

“You Must Unlearn What You Have Learned” — Meet SmashingConf San Francisco #breakout (April 17-18)

Meet SmashingConf San Francisco, packed with smart front-end and UX techniques to challenge everything about how you design and code. We’ll unlearn old habits and dig into strategies for breaking out: leaving behind the generic solutions, exploring new design workflows, understanding new performance techniques, and all the capabilities that we have at our hands already and in the near future. Super-early-bird tickets are available today.

A standoff between Yoda Cat and Darth Mouse beneath a cheese death star. Yup, we talk about a Smashing Conference in San Francisco here. Taking place on April 17th to 18th, next year

At SmashingConf San Francisco, we’ll find out find out how we all — as designers and developers — can be more productive today and how we can make smarter decisions tomorrow. To the the schedule.

Read more...

Mobile Interface Myths You Should Throw Out The Window

If anything’s clear in 2017, it’s that lying is back in fashion (if it ever left us at all). From the heated fake news debate to the false data provided by Facebook, lying is all the rage these days. A white lie here and there is no big deal. We’re all guilty of it. The problem arises when lies turn into full-grown myths, then become accepted as truths.

Mobile Interface Myths You Should Throw Out The Window

In an era of digital chaos, we understandably gravitate to our trusted sources of information. For us designers, this usually means guidelines as defined by juggernauts such as Google and Apple.

Read more...

Creating Secure Password Resets With JSON Web Tokens

When a user of your application has forgotten their password, it can and should be reset securely. To accomplish a secure password reset, I will demonstrate how to use JSON Web Tokens (JWT) to generate a URL-safe token. The JWT contains encoded information about the user and a signature that, when decoded, is validated to ensure that the token has not been tampered with.

Illustration showing mobile, medium and wide viewports, where the layout of the header and sidebar change as the viewport widens.

Once the JWT is validated, your application can securely allow the user to generate a new password, instead of sending them their forgotten one.

Read more...

10 Simple Tips To Improve User Testing

(This is a sponsored post). Testing is a fundamental part of the UX designer’s job and a core part of the overall UX design process. Testing provides the inspiration, guidance and validation that product teams need in order to design great products. That’s why the most effective teams make testing a habit.

An example of a low-fidelity prototype made in Adobe XD.

Usability testing involves observing users as they use a product. It helps you find where users struggle and what they like. There are two ways to run a usability test:

Read more...

Maximizing The Design Sprint

Following a summer of Wonder Woman, Spiderman, and other superhero blockbusters, it’s natural to fantasize about having a superpower of your own. Luckily for designers, innovators, and customer-centric thinkers, the design sprint process allows you to see into the future to learn in just five days what customers think about your finished product.

A design print schedule which involve scheduling participants and interviews for all of its three weeks

As a UX consultant and in-house design strategist, I have facilitated dozens upon dozens of design workshops (ranging from rapid prototyping sessions to, of course, sprints). The sprint is by far the most effective process I’ve seen to drive customer-first decision making in a design thinky way.

Read more...

Right-To-Left Development In Mobile Design

The Middle Eastern market is growing at a rapid pace, and, as a result, demand for IT products is also booming in the region. What is peculiar, though, is that Middle Eastern countries require design that is not only compatible with their needs and comfortable for their users, but that is also suitable to their language standards, making a serious adaptation process very important. Given that most languages spoken in the Middle East are written and read from right to left (such as Arabic, Hebrew, and Urdu), developers often face a range of problems when creating products in those languages.

The Arabic version of Facebook.com, with a reversed order of the site’s elements

Although this might seem like not that big of a deal, IT development for right-to-left (RTL) languages entails paying attention to a number of peculiarities. This is only further complicated by the fact that the RTL market is relatively new, and not many resources are available to help developers.

Read more...

Level-Up Email Campaigns With Customer Journey Mapping

I became a huge fan of customer journey mapping the first time I was introduced to it. And after a few years of mapping, tweaking and presenting maps, my team and I started looking for other more exotic uses of this technique. Well, seek and ye shall find.

an example of customer journey map.

Customer journey mapping is a visualization technique that helps marketing specialists, user experience designers, and product and business owners see the journey people take when interacting with products and services. It is a great way to put on your customer's shoes and see where your business fails to deliver a great user experience.

Read more...

Understanding The Vary Header

The Vary HTTP header is sent in billions of HTTP responses every day. But its use has never fulfilled its original vision, and many developers misunderstand what it does or don't even realize that their web server is sending it. With the coming of the Client Hints, Variants and Key specifications, varied responses are getting a fresh start.

Illustration of content-negotiated conversation between user and bank

In principle, a URL represents not a web page, but a conceptual resource, like your bank statement. Imagine that you want to see your bank statement: You go to bank.com and send a GET request for /statement. So far so good, but you didn't say what format you want the statement in. This is why your browser will also include something like Accept: text/html in your request. In theory, this means you could say Accept: text/csv instead and get the same resource in a different format.

Read more...

SmashingConf 2018: Fetch Those Early-Bird Tickets! 🇬🇧 🇺🇸 🇨🇦

Great conferences are all about learning new skills and making new connections. That’s why we’ve set up a couple of new adventures for SmashingConf 2018 — just practical sessions, new formats, new lightning talks, evening sessions and genuine, interesting conversations — with a dash of friendly networking! Taking place in London, San Francisco, Toronto. Tickets? Glad you asked!

A queen cat welcoming you a Smashing Conference in London, February 7 to 8, 2018

Performance matters. Next year, we’re thrilled to venture to London for our brand new conference fully dedicated to everything front-end performance. Dealing with ads, third-party scripts, A/B testing, HTTP/2, debugging, JAM stack, PWA, web fonts loading, memory/CPU perf, service workers. Plus lightning community talks.

Read more...

↑ Back to top