Give me file hierarchies, or give me chaos.

IN “HOW DROPBOX Remains Relevant,” Khoi Vinh explains why Dropbox owes much of its success to subtly faceted, user-focused design:

Even in an age when the biggest operating systems in the world actively eschew file hierarchies, Dropbox is thriving—its service matters deeply to countless users. Why? In part it’s because the company works hard at making file hierarchies useful, that they focus on the outcomes of file management and not just on the files and folders.

Absolutely. Dropbox sweats the user experience details as commendably as it masters the considerable engineering challenges required to reliably sync files everywhere a user may need them.

But there’s another reason Dropbox succeeds. And it isn’t despite its emphasis on old-fashioned file hierarchies. It’s because of that emphasis.

⇛ ALTHOUGH Khoi may well be right that “smart passive management of design assets and working files seems inevitable,” I, for one, do not look forward to the day I no longer have direct access to my files and the ability to control where and how they are stored. To my way of thinking, passive management of file assets is okay for screwing around with iPads, where we’re mainly watching TV on Netflix or obsessive-compulsively checking the popularity of our Instagram uploads. But for real work, and even for passionate hobby work (like managing family photos), give me files and folders any day.

Stay with photos a moment. Consider snapshots. For my money, apps like Photos (and, formerly, iPhoto) that “save” me from the “inconvenience” of knowing where my images are do me no favors. Thanks, but no thanks. Let me save photos where I want to save them, not where the system thinks I should save them—typically on a laptop’s rapidly filling solid state hard drive with minimal storage capacity.

Dropbox, with its emphasis on good old-fashioned hierarchies, is superb at automatically saving one original of each photo I take, whether shot with a phone or a fancy camera. No loops, no duplicates, no confusion. In contrast, Photo’s cloud sync options, designed to spare the user the trouble of thinking, always trip me up. Like when, after syncing my phone to my home desktop computer, I tell Photos to delete the photos I’ve just sync’d from my phone. Photos obeys my command, and then instantly restores the photos to my phone from the “cloud.”

Why would a system expect a user who has deleted files to want those files restored a moment later? In what universe of scenarios can that possibly be what the user expects? [Your system may work differently from mine. Your deletes may stick. If so, good on you. You may have checked a different box in a hidden drawer of a preferences dialog, possibly in the app preferences you can set in the app itself, or possibly in the app preferences you set in the phone’s Settings app, or possibly online—say, in iCloud, or possibly in the iCloud settings in the phone’s Settings app. This is simplicity?]

Because my phone and iCloud restore photos as soon as they’re deleted, my Camera Roll is an unwieldly monster—despite my applying common sense, logic, years of design and computer using experience, and hours of conversation with a rapidly dwindling circle of friends—not to mention the hours I’ve spent scouring the web for hints. The whole situation reminds me of an article I saw on the cover of PC World years ago: “Plug ‘n Play: How To Make It Work.” (Hint: If you have to learn how to make it work, it ain’t plug ‘n play. And that’s kind of how I feel about the current state of passive file management.)

⇛ SYSTEMS designed to relieve you of thinking too often end up forcing you to think, and think, and think, without ever solving the problems their supposed simplicity has created for you. How much easier would photo maintenance on my phone be if Photos, like Dropbox, used file hierarchies? I could solve the problem myself in a second, with the click of a checkbox, if only Apple weren’t committed to chasing a future where nobody needs to know anything about how their computer works—and, as a result, some of us have no clue what to do when the computer doesn’t work quite right.

⇛ I UNDERSTAND that these are difficult problems to solve, and that confusion and frustration are the price consumers pay for innovation that may benefit them in the long run, once all the kinks are out. I’m not anti-innovation or anti-Apple.

But I’m a web person. I like files. I like editing a CSS file without necessarily having to edit an HTML file. I like fixing a problem by replacing a corrupted file with a clean one. Maybe I’m set in my ways, but I don’t consider it a hardship to open a folder or replace a file. I wouldn’t be quite as happy with a web where I didn’t “need” to “bother” writing CSS.

In the same way, I like deciding where files go—saving an image for Project A in a Project A folder, a text document for Project B in a Project B folder (and all of it in Dropbox). I’m glad Adobe Lightroom maintains a picture of my photo folder hierarchy in a sidebar of its interface, enabling me to see where my files live, and instantly choose a group of photos by date (instead of, say, scrolling through thousands of files visually). When it’s time to get dressed in the morning, I don’t throw myself into a giant room full of clothes. I pull socks from my sock drawer and shirts from my shirt drawer. I’ve been doing this since I was five years old. It’s not a challenge.

Khoi ends his excellent Dropbox piece thusly:

Maybe we’re all just set in our ways, but people seem at least resigned, and more likely just plain comfortable with managing their files. It may not be what future workflows are built around, but for working designers, the future is hypothetical, and Dropbox works today.

To which I say Amen. And add the hope that, so long as my career lasts, I can keep using a workflow I find easy and comprehensible.

Don’t make me think.” Absolutely. But, equally, don’t treat me like an idiot. Folders über alles.

Also published in Medium

Big Web Show: Squarespace

Squarespace founder Anthony Casalena

SQUARESPACE CEO and founder Anthony Casalena is my guest in Episode 87 of The Big Web Show (“everything web that matters”).

We discuss the platform’s capabilities and the three markets it serves (consumer, designer, developer); the journey from one-person start-up to 120-person company; the launch of Squarespace’s ecommerce platform; how to design a start-up that makes money the day it launches; ways to build community around a non-open-source platform; the effectiveness of good old-fashioned traditional advertising in marketing an internet company like Squarespace; staffing up and laying people off; and much more.

Anthony is the founder and CEO of Squarespace, which he started from his dorm room in 2003. During the company’s early years, Anthony acted as the sole engineer, designer and support representative for the entire Squarespace platform, allowing for it to be a stable and profitable business from the outset.

In addition to his main responsibilities in running the company and setting overall product strategy, he remains actively involved in the engineering, design, and product teams within the organization. Anthony holds a Bachelor of Science in Computer Science from the University of Maryland.

This episode of The Big Web Show is sponsored by Use offer code “BIGWEBSHOW3” to save 30% off any Shutterstock photo package.

Facebook goes native

“IF I WERE advising them on these decisions, I would have had them look at what people actually want from Facebook — fast access to their friends’ photos and posts — and … helped them design an HTML5 web experience that actually works for mobile.”

.net magazine: Facebook iPhone app to go native By Tanya Combrinck on June 28, 2012

Designing Apps With Web Standards (HTML is the API)

The Web OS is Already Here… Luke Wroblewski, November 8, 2011

Mobile First Responsive Web Design, Brad Frost, June, 2011

320 and up – prevents mobile devices from downloading desktop assets by using a tiny screen’s stylesheet as its starting point. Andy Clarke and Keith Clark.

Gridless, HTML5/CSS3 boilerplate for mobile-first, responsive designs “with beautiful typography”

HTML5 Boilerplate – 3.02, Feb. 19, 2012, Paul Irish ,Divya Manian, Shichuan, Matthias Bynens, Nicholas Gallagher

HTML5 Reset v 2, Tim Murtaugh, Mike Pick, 2011

CSS Reset, Eric Meyer, v 2.0b1, January 2011

Less Framework 4 – an adaptive CSS grid system, Joni Korpi (@lessframework)

Responsive Web Design by Ethan Marcotte, 2011

Adaptive Web Design by Aaron Gustafson, 2011

Web Standards Curriculum – Opera

Getting Started With Sass by David Demaree, 2011, A List Apart

Dive into Responsive Prototyping with Foundation by Jonathan Smiley, A List Apart, 2012

Future-Ready Content Sara Wachter-Boettcher, February 28, 2012, A List Apart

For a Future Friendly Web Brad Frost, March 13, 2012, A List Apart

Orbital Content Cameron Koczon, April 19, 2011, A List Apart

Web standards win, Windows whimpers in 2012, Neil McAllister, InfoWorld, December 29, 2011

Thoughts on Flash – Steve Jobs, April, 2010

Did We Just Win the Web Standards Battle? ppk, July 2006

Web Standards: Wikipedia

The Web Standards Project: FAQ (updated), February 27, 2002

To Hell With Bad Browsers, A List Apart, 2001

The Web Standards Project: FAQ, 1998

The Web Standards Project: Mission, 1998

HTML5 at A List Apart

Mobile at A List Apart

Browsers at A List Apart

Web Type Will Save Us (Or, Who’s Afraid of the Big, Bad Retina Display?)

WITH RETINA DISPLAY technology on the verge of ubiquity and some of today’s best web design minds rightfully fretting about it (see PPK, Stephanie Rieger, Brad Frost, and Stuntbox if you’ve missed this latest Topic Of Concern), it seems to this old web slinger that web type is poised to replace photography as the dominant element of web design aesthetic appeal in the next few years.

After all, responsive web design already called upon us to create and swap multiple versions of the same image. And now Retina Displays reveal the lack of quality in all web images — compelling us, perhaps, to create high-resolution image versions which some users lack the bandwidth to download, and to lather our sites with yet more JavaScript as we try to detect whether or not each user’s device requires a higher-res image (shades of 1999!).

But type is type is type, and the higher the resolution of the device, the better that type will look, with no bandwidth overhead.

In that spirit, although we haven’t yet worked with it ourselves, we welcome the launch of TypeButter. Developed by David Hudson and designed by Joel Richardson, TypeButter is a plug-in that “allows you to set optical kerning for any font on your website.”

Soon, CSS and browsers will let us set type properly without the need for widgets and plug-ins. Until then, widgets and plug-ins fill the gap. Thank you, David and Joel, and all you beautiful web type designers and polyfill wizards.

State of the web: of apps, devices, and breakpoints

IN The ‘trouble’ with Android, Stephanie Rieger points out the ludicrous number of Android screen sizes on a typical UK client’s website and comes to this conclusion:

If … you have built your mobile site using fixed widths (believing that you’ve designed to suit the most ‘popular’ screen size), or are planning to serve specific sites to specific devices based on detection of screen size, Android’s settings should serve to reconfirm how counterproductive a practice this can be. Designing to fixed screen sizes is in fact never a good idea…there is just too much variation, even amongst ‘popular’ devices. Alternatively, attempting to track, calculate, and adjust layout dimensions dynamically to suit user-configured settings or serendipitous conditions is just asking for trouble.

I urge you to read the entire article—it’s brief yet filled with rich chocolatey goodness.

Responding to it, Marc Drummond concludes that responsive web design default breakpoints are dead and urges designers to “use awkwardness as your guideline, not ephemeral default device widths” and return to fluid design. (I believe he may actually be thinking of liquid layout—the kind we practiced back in the early mid-1990s when cross-platform and multi-manufacturer desktop screen sizes and pixel-per-inch ratios—not to mention strong user font, size, and color preference options—made fixed-width layout design challenging if not impossible. As I understand fluid design, it is merely another word for responsive design, in that it relies on CSS3 media queries set to breakpoints.)

We’ve lost our compass

Rieger and Drummond are hardly alone in feeling that “our existing standards, workflows, and infrastructure” cannot support “today’s incredibly exciting yet overwhelming world of connected digital devices” ( and that something new must be done to move the web forward. And of course ppk has been warning us about the multiplicity of platforms and viewports on mobile since 2009.

Agreed: that is an exciting and challenging time; that fixed width layouts do not address, and adaptive layouts (multiple fixed-width layouts set to common breakpoints) do not go far enough in addressing, the challenges posed by our current plethora of mobile screen sizes, zoom settings, embedded views (i.e. “browser” windows inside app windows, often with additional chrome) and what Rieger calls “the unintended consequences” that occur as these various settings clash in ways their creators could not have anticipated.

As consumers, we’ve all had the experience of seeing the wrong layout at the wrong time. (Think of a site with both mobile and desktop versions—whether these versions are triggered by CSS3 media queries or JavaScript and back-end magic is beside the point because technology is beside the point—good user experience is all this is supposed to be about. On a Twitter app on a mobile device, the user follows a link; the link opens in the browser built into the Twitter app. Which version of the site does the user see? The mobile one or the desktop? Often it is the desktop, and that can be a problem if the app’s version of the browser does not permit zoom. Even if it is a mobile version, it may be the wrong mobile version, or it may not fit comfortably inside the app’s browser window.) Considering our own experiences and reviewing Rieger’s chart, it is easy to share Drummond’s conclusion that breakpoints are dead and that all sites should be designed as minimally as possible.

If breakpoints are dead, responsive design is dead

Of course, if breakpoints are dead, responsive design is dead, because responsive design relies on breakpoints both in creative workflow and as a key to establishing user-need-and-context-based master layouts, i.e. a minimal layout for the user with a tiny screen and not much bandwidth, a more fleshed-out one for the netbook user, and so on.

But responsive design is not dead; it has only begun. It is not a panacea but was never intended to be. It is simply the beginnings of an approach.

I respect those colleagues who say breakpoints are dead, understand how they reached this conclusion, and am eager to see where it takes them in the coming months as they experiment with new methods, perhaps developing wonderful and unforeseen best practices. I hope design will be a brilliant part of these new methods, not something that gets abandoned to create a bland but workable lightweight experience for all.

But I also believe it is possible to draw a different conclusion from the same data. It is even possible, I believe, to say the present data doesn’t matter—at least not in the long run.

Tale of the chart

There was a time in the late 1990s when industrious web designers showed how atrocious CSS support was in browsers. Eric Meyer’s Master Compatability Chart for Web Review, formerly at, was one of the best, but is no longer available for your historical viewing pleasure—not even at the mighty Wayback Machine. That’s too bad, as it would have perfectly illustrated my point. The chart used a variety of colors to show how each detail of the entire CSS specification was or was not supported (and if supported, whether it was supported correctly and completely, partially and correctly, partially and somewhat incorrectly, or completely incorrectly) in every browser which was available at the time, including, if memory serves, close to a dozen versions of Netscape, Explorer, and Opera.

Looking at that chart induced nausea and vertigo. It was easy to draw the conclusion that CSS wasn’t ready for primetime. (That was the correct conclusion at the time.) It was also easy to look at the table and decide that table layouts and font tags were the way to go.

That’s what most designers who even bothered looking at Eric’s chart decided, but a few (Eric and me included) drew a completely other inference. Instead of trying to memorize all the things that could go wrong in each browser, we created general rules for what worked across all browsers (e.g. font-size in px, floats for layout) and advocated design based on the things that work. This, I believe, is exactly what the and Move the Web Forward folks are doing now: trying to figure out commonalities instead of bogging down in details. (This is why some in our community have labeled and Move the Web Forward “WaSP II.”)

The other inference Eric, I, and others in the 1990s drew from Eric’s chart was that browser makers must be petitioned to support CSS accurately and correctly. We and many of you reading this engaged in said petitioning, and thanks largely to help from with the browser engineering community (from people like Tantek Çelik and Chris Wilson and organizations like Mozilla) it came to pass.

Of mice and markets

We cannot, of course, petition all the makers of, say, Android devices to agree to a set of standard breakpoints, because there are over 500 different Android devices out there, many of which will fail in the coming months—or if not outright fail, simply be replaced in the course of planned obsolescence AKA upgrading that drives the hardware segment. And each new product will in turn introduce new incompatibilities (AKA “features”).

In the short run it’s going to be hell, just as the browser wars and their lack of support for common standards were hell. But it is the short run.

500 standards is no standard. Give a consumer 500 choices and the price-driven consumer picks what comes with her plan, while the selective consumer begins gravitating toward a handful of emerging market leaders. Eventually this nutty market will stabilize around a few winning Android platforms (e.g. Kindle Fire) and common breakpoints will emerge. What The Web Standards Project achieved with browser makers, the market will achieve with phones.

Until that time, designers certain can abandon breakpoints if they can find a way to do good design under purely fluid conditions—design that pleases the user, satisfies the client, and moves the industry forward aesthetically. But designers who persist in responsive or even adaptive design based on iPhone, iPad, and leading Android breakpoints will help accelerate the settling out of the market and its resolution toward a semi-standard set of viewports. This I believe.

When I see fragmentation, I remind myself that it is unsustainable by its very nature, and that standards always emerge, whether through community action, market struggle, or some combination of the two. This is a frustrating time to be a web designer, but it’s also the most exciting time in ten years. We are on the edge of something very new. Some of us will get there via all new thinking, and others through a combination of new and classic approaches. Happy New Year, web designers!

Migrate if you like, but Touristeye is not a Gowalla partner.

RECENTLY A COMPANY CALLED Touristeye has been emailing Gowalla users, encouraging them to migrate their data to Touristeye now that the Gowalla service is closing down. The emails tell you how a Gowalla friend (who is named) has just migrated her/his data to Touristeye and invite you to join her or him. Although Touristeye does not claim to be a Gowalla partner, there is a strong implication that the migration is seamless and that it was authorized by Gowalla. Not so.

Gowalla has not created a migration tool for Touristeye or released any migration tool as yet; the Austin-based check-in tool has no affiliation with Touristeye, and did not authorize Touristeye to reach out to Gowalla customers.

I can’t fault Touristeye for trying to increase its customer base by reaching out to the abandoned Gowalla community, and I have no opinion on Touristeye’s service, as I haven’t tried it. If Touristeye appeals to you, by all means check it out. Personally, I have replaced my Gowalla fix with (yes, four) four apps: Foursquare (for social check-ins and tips about places), Instagram (for photos and seamless Foursquare integration), Path (for the aesthetic rush I miss), and Facebook (because my people who don’t know from Foursquare, Instagram, and Path are there; and Facebook’s new Timeline even makes it fun).

An official Gowalla migration tool is coming is coming soon.

New MobiUs Browser For iOS Makes Mobile Web Apps Act More Like Native Apps

Mobile development firm appMobi is launching a new HTML5-powered browser for iOS on Monday which will bring additional capabilities typically found only in native apps to the mobile Web. The MobiUs Web App Browser, as it’s being called, works both as a standalone browser alternative or in conjunction with Apple’s mobile Safari, similar to the way browser extensions work on the desktop Web.

“…The browser integrates two full sets of APIs from both appMobi and from PhoneGap (1.0) to give the Web apps a native look-and-feel, plus the ability to access all the hardware features of the smartphone.”

More: New MobiUs Browser For iOS Makes Mobile Web Apps Act More Like Native Apps | TechCrunch.

An Event Apart Atlanta 2011

YOU FIND ME ENSCONCED in the fabulous Buckhead, Atlanta Intercontinental Hotel, preparing to unleash An Event Apart Atlanta 2011, three days of design, code, and content strategy for people who make websites. Eric Meyer and I co-founded our traveling web conference in December, 2005; in 2006 we chose Atlanta for our second event, and it was the worst show we’ve ever done. We hosted at Turner Field, not realizing that half the audience would be forced to crane their necks around pillars if they wanted to see our speakers or the screen on which slides were projected.

Also not realizing that Turner Field’s promised contractual ability to deliver Wi-Fi was more theoretical than factual: the venue’s A/V guy spent the entire show trying to get an internet connection going. You could watch audience members twitchily check their laptops for email every fourteen seconds, then make the “no internet” face that is not unlike the face addicts make when the crack dealer is late, then check their laptops again.

The food was good, our speakers (including local hero Todd Dominey) had wise lessons to impart, and most attendees had a pretty good time, but Eric and I still shudder to remember everything that went wrong with that gig.

Not to jinx anything, but times have changed. We are now a major three-day event, thanks to a kick-ass staff and the wonderful community that has made this show its home. We thank you from the bottoms of our big grateful hearts.

I will see several hundred of you for the next three days. Those not attending may follow along: