This category features articles on general design principles, Web design, typography, user interface design and related topics. It also presents design showcases and practical pieces on the business side of design. Curated by Alma Hoffmann.
As Web designers, we face a daily struggle to keep pace with advances in technology, new standards and new user expectations. We spend a large part of our working life dipping in and out of recent developments in an attempt to stay both relevant and competitive, and while this is what makes our industry so exciting to be a part of, it often becomes all too easy to get caught up in the finer details.
Responsive Web design, improved semantics and Web typography have all seen their fair share of the limelight over the last year, but two trends in particular mark true milestones in the maturation of the Web: “real-time data” and a more “personalized Web.”
I’m always fumbling with the A/C controls in my car. My daily commute is in hot, sunny Southern California, home of the courteous freeway driver. I can’t afford to take my eyes off the road for too long to find the control I’m looking for. Half of the time when I'm trying to adjust the temperature, I end up blowing my beard off because I’ve spun the wrong dial. If my wife’s in the car with me, I usually resort to asking her to do it for me.
There’s a simple design principle that, had it been given greater attention, could have made this needlessly confusing interface much easier to use: proximity.
For instance, many recent promo websites are essentially single page websites with an array of animation effects used to make navigation a smoother and richer user experience. We need to be very careful and cautious when using these dynamic effects in our designs. A simple, calm navigation is usually much more user-friendly than an evolved, dynamic one. Users want to use the website, not be baffled by the weird and hardly usable navigation. But that's not to say that a creative navigation should be avoided at all costs.
Content, content, content. It’s an obvious part of any interactive experience. In fact, you’ve probably heard content is king, or queen, or some sort of royalty. Yet, content is elusive. Often, you don’t realize your content isn’t cutting it until it’s too late. Does any of this sound familiar? Delayer projects, broken designs, uneven voice or low-performing landing pages.
These problems and more are documented extensively, so I won’t dwell on them. What I will dwell on is the solution. But, first, let's discuss the false ones. Just because someone articulates a problem well does not mean someone knows the solution. That’s when we’re susceptible to a false solution. In my many years of experience, I’ve found these two fake solutions to be very common, very distracting — and very disappointing.
"Look at her: so beautiful, so friendly, so smart. And what a personality. She must be mine. Hooking up with her would make me the envy of all my friends. Sure, she's young and she's gorgeous. Besides, I can easily try something new if I get bored or something better comes along."
No, that’s not an excerpt from Lolita. As cruel and inappropriate as they might seem, these thoughts are fairly common in our society. In fact, in the past year, millions of people have entered into exactly that type of relationship. Don’t bother calling the Special Victims Unit; what we’re discussing here is not what you think it is. It’s the Apple iPad.
In a previous article on Smashing Magazine, I described A/B testing and various resources related to it. I have also covered the basics of multivariate testing in the past, yet in this post I’ll go deeper in the technical details of multivariate testing which is similar to A/B testing but with crucial differences.
In a multivariate test, a Web page is treated as a combination of elements (including headlines, images, buttons and text) that affect the conversion rate. Essentially, you decompose a Web page into distinct units and create variations of those units. For example, if your page is composed of a headline, an image and accompanying text, then you would create variations for each of them. To illustrate the example, let’s assume you make the following variations.
Designing for the future Web. That’s a big subject. Where do we start when we’re talking about something that isn’t here yet? In this article, we’ll look at what the future Web might look like and how we can adapt our current skills to this new environment, as well as how to create fluid websites that are built around a consistent core and that adapt to the limitations and features of the device on which they are viewed.
We’ll also look at how our conceptual approach to designing websites should evolve: designing from the simplest design upwards, and not from the richest website down. But before we get to that, let’s start with a question. What do we mean by the “future Web”?