A List Apart

Menu
Issue № 338

Dark Patterns: Deception vs. Honesty in UI Design

by Harry Brignull · 20 Comments

Deception is entwined with life on this planet. Insects deceive, animals deceive, and of course, we human beings use deception to manipulate, control, and profit from each other. It’s no surprise, then, that deception appears in web user interfaces; what is surprising is how little we talk about it. All the guidelines, principles, and methods ethical designers employ to design usable websites can be subverted to benefit business owners at the expense of users. Study the dark side so you can take a stand against unethical web design practices and banish them from your work.

Expanding Text Areas Made Elegant

by Neil Jenkins · 29 Comments

An expanding text area is a multi-line text input field that expands in height to fit its contents. Commonly found in both desktop and mobile applications, such as the SMS composition field on the iPhone, it’s a good choice when you don’t know how much text the user will write and you want to keep the layout compact; as such, it’s especially useful on interfaces targeted at smartphones. Yet despite the ubiquity of this control, there’s no way to create it using only HTML and CSS, and most JavaScript solutions have suffered from guesswork, inaccuracy, or a lack of elegance "¦ until now.

More from A List Apart

Columnists

Matt Griffin on How We Work

Pricing the Web

If you plan to bill your clients, you need a method for putting a price on what you do. The variables are always money, time, and scope of work, but the way they relate to each other can bring different client motivations to the foreground and fit different agency needs.

From the Blog

Driving Phantom from Grunt

For this example, we're going to build a Grunt task that takes a screen shot of the pages we're building (similar to Wraith, but far less advanced). There are multiple parts to make this work, so let's break it down. First, we will write a PhantomJS script that renders each page. Second, we make a NodeJS function that calls this script. Finally, we make a GruntJS task that calls that Node function. Fun!