Skip to: site navigation/presentation
Skip to: Thoughts From Eric

Archive: 'Projects' Category

Results of The Web Design Survey, 2010

Now available: the results from the A List Apart Survey for People Who Make Web Sites, 2010.  This is the fourth industry snapshot we’ve compiled, and the story that’s emerged over that time is proving to be pretty consistent.  You can get a high-level view from the Introduction, and then dive deeper into the results in the following chapters.  And, as is traditional, the Addendum contains links to the full (anonymized) data set in three formats for your own analytical investigations.  We’d love to see what you come up with!

Something that surprised me quite a bit was that in 2010 we got about half the number of respondents we’ve gotten in past years—not quite seventeen thousand participated in 2010 instead of just over thirty thousand as we saw in previous years.  I’m not quite sure what to make of that.  Is the industry shrinking?  Did we not get the word out as effectively?  Was it a bad time of year to run a survey?  Are people getting tired of taking the survey?  There’s no real way to know.

At least there weren’t any wild swings in the results, which might have indicated we’d lost some subgroups in disproportionate numbers.  Whatever caused the drop in participation, it appears to have done so in an evenly-distributed fashion.

Regardless, I’d like to see higher participation next year, so if anyone has good suggestions regarding how to make that happen, please do let me know in the comments.

We plan to run the 2011 survey in the next couple of months (and I’ll post a bit more about that soon) but for now, I hope you find the 2010 results an interesting and useful look at who we are.

Spinning the Web

Can CSS create art?  That’s a question I set out to explore recently, and I like to think that the answer is yes.  You can judge for yourself: Spinning the Web, a gallery on Flickr.


To be clear, when I say “Can CSS create art?” I don’t mean that in the sense of wondering if art, or artful designs, can be accomplished with CSS.  I think we all know the answer there, and have known at least since the Zen Garden got rolling.  What I’m doing here is using some basic CSS to generate art, using web sites as the medium.  For the series I linked, I spun all of the elements on a page using transform: rotate() to see what resulted.  Any time I saw something I liked, I took a screenshot.  After I was done, I winnowed the shots down to the best ones.

As some of you old-schoolers will probably have recognized, I’m absolutely following in the footsteps of Joshua Davis here, and in fact my working title for this effort was “Once Upon a Browser”.  I saw Josh speak years ago, and clearly remember his description of how he generated a lot of his art.  My process is almost identical, albeit with a bit less automation and computational complexity.

Because this is me, I built a little commentary joke into the first images in the series.  It’s not terribly subtle, but with luck one or two of you will get the same chuckle I did.

I’m already thinking about variants on this theme, so there may be more series to come.  In the meantime, as I surf around I’ll stop every now and again to spin what I see.  I’ll definitely mention any new additions via Twitter, and new series both there and here.  And of course if you follow me on Flickr, you’ll see new pieces as they go up.

I hope you enjoy them half as much as I enjoyed creating them.  And if anyone wants to use the originals as desktop wallpapers, as Tim proposed, feel free!

Seeing the matrix()

Over the weekend, Aaron Gustafson and I created a tool for anyone who wants to resolve a series of CSS transforms into a matrix() value representing the same end state.  Behold: The Matrix Resolutions.  (You knew that was coming, right?)  It should work fine in various browsers, though due to the gratuitous use of keyframe animations on the html element’s multiple background images it looks best in WebKit browsers.

The way it works is you input a series of transform functions, such as translateX(22px) rotate(33deg) scale(1.13).  The end-state and its matrix() equivalent should update whenever you hit the space bar or the return key, or else explicitly elect to take the red pill.  If you want to wipe out what you’ve input and go back to a state of blissful ignorance, take the blue pill.

There is one thing to note: the matrix() value you get from the tool is equivalent to the end-state placement of all the transforms you input.  That value most likely does not create an equivalent animation, particularly if you do any rotation.  For example, animating translateX(75px) rotate(1590deg) translateY(-75px) will not appear the same as animating matrix(-0.866025, 0.5, -0.5, -0.866025, 112.5, 64.9519).  The two values will get the element to the same destination, but via very different paths.  If you’re just transforming, not animating, then that’s irrelevant.  If you are, then you may want to stick to the transforms.

This tool grew out of the first Retreats 4 Geeks (which was AWESOME) just outside of Gatlinburg, TN.  After some side conversations betwen me and Aaron during the CSS training program, we hacked this together in a few hours on Saturday night.  Hey, who knows how to party?  Aaron of course wrote the JavaScript.  Early on we came up with the punny name, and of course once we did that the visual design was pretty well chosen for us.  A free TTF webfont (for the page title), a few background images, and a whole bunch of RGBa colors later we had arrived.  Creating the visual appearance was a lot of fun, I have to say.  CSS geeks, please feel free to view source and enjoy.  No need to say “whoa”—it’s actually not that complicated.

So anyway, there you go.  If you want to see the matrix(), remember: we can only show you the door. You’re the one that has to walk through it.

Reset v2.0

Earlier today, I updated the CSS Tools: Reset CSS page to list the final version of Reset v2.0, as well as updated the reset.css file in that directory to be v2.0.  (I wonder how many hotlinkers that will surprise.)  In other words, it’s been shipped.  Any subsequent changes will trigger version number changes.

There is one small change I made between 2.0b2 and 2.0 final, which is the replacement of the “THIS IS BETA” warning text with an explicit lack of license.  The reset CSS has been in the public domain ever since I first published it, and the Reset CSS page explicitly said it was, but the file itself never said one way or the other.  Now it does.

Thanks to everyone who contributed their thoughts and perspectives on the new reset.  Here’s to progress!

A Year Apart

It’s well past time for me to spend a few minutes reflecting on An Event Apart in 2010.  In two words: absocrazifreakiperfluously staggerblasticating[I totally stole those. —Ed.]  From the first show to the last, 2010 was an incredible year for An Event Apart, easily our best yet on every front.  Jeffrey and I stand in humbled awe of the amazing speakers and wonderful attendees who joined us this year.  I’ve said before that AEA attendees are “as much colleagues as anything else” and that continues to be so.  While I love our speakers, I love the attendees even more.  What I look forward to most at every show is time spent talking with my fellow craftspeople in the hallway, at lunch, and at the social events.

It seems like a lot of people feel the same way, because every single one of our 2010 shows sold out in advance.  We’re understandably proud of this, and also very, very grateful for your faith and trust in what we do, and hope to continue earning both into the future.  (In honor of your support, AEA recently made a donation to Computers For Youth in support of the next generation.)

So in 2011, we’re building on what we learned in 2010.  We’re going from five to six shows, including a long-delayed return to Atlanta (site of our sophmore effort), and each sporting an optional A Day Apart featuring in-depth coverage of topics like mobile web design, HTML5/CSS3, and content strategy.  If you’re interested, check out our Events page for the show nearest, or of most interest, to you.

Again, our deepest thanks to all our attendees and supporters.  We couldn’t do what we do without you, and we’re looking forward to the challenge of clearing the bar you’ve set for us!

The Survey, 2010

I TOOK IT! And so should you—THe Survey For People Who Make Websites, 2010

It’s that time again: the 2010 edition of The Survey For People Who Make Websites is open and taking your input.  If you’re someone who creates web sites,  whether all the time or some of the time or even just occasionally, please take just a little bit of your day (as I write this, the average time-to-completion is just over 10 minutes) to let us know about you.  Furthermore, please spread the word to any groups to which you belong—local SIGs, mailing lists, newsgroups, forums, message boards, and so on.  I truly believe it’s important to the profession as a whole to have as many web folks as possible participate.

I was asked a little while back why we do the survey, and my answer surprised me not just for its content but also for how much passion I felt.  I said:

I think it’s a vital investigation, a look into our profession that nobody else is even attempting and is… essential if we’re going to be taken at all seriously by anyone other than ourselves.

And even more vital than that, it tells us who we are, collectively speaking. We’re scattered. Many of us are solo. We don’t even know what kind of community we’ve joined. The Survey, though limited and imperfect, tells us something profound and essential about us.

That’s why I’ve wholeheartedly supported this effort from its very outset, putting in hours upon hours of thought and effort into its operation and approving the use of [funds] to pay for professional analysis. This matters.

Other professions have it easy: they require certification or degrees or membership in a professional organization before you can take part.  Because of that, they can often estimate to a reasonable degree, or even count directly, how many of them there are.  They can go to their membership rolls and survey a few thousand randomly picked members to find out their age, location, experience, salary, and anything else that seems interesting to know.

We who build the web don’t have that luxury.  Our profession, just like the medium it serves, has no gatekeepers, no central organization, no clear boundaries.  The Survey is our attempt to disambiguate ourselves.

So please, if you’re someone who makes web sites, take ten minutes to tell us about yourself.  If you know people who make web sites, please point them to the survey and ask them the same.  Thank you.

Seeking Hosting Advice

A friend and I have decided to build a web service/site/whatever the kids are calling them these days.  A thing on the web to help you out from time to time.

As a result, we’re looking for a web host with great service, reliability, and scalability, and I was curious about your experiences.  Here are a few details on what we need:

  • A managed server where patches are applied automatically.  Neither of us are Linux experts, and we want something secured for us without us having to worry about whether some patch breaks the system. 
  • mySQL with phpMyAdmin.  (Don’t judge.)
  • PHP w/cURL, mySQLi, and mCrypt, as well as an editable php.ini file.
  • Apache!
  • Some sort of CVS (Subversion and the like) built in.
  • Bonus: some experience on the hosting side with the ability to escalate to Memcached and other noSQL techniques.

The mySQL and PHP bits are of course incredibly common, but still, no point not mentioning those requirements.  In our case, the bigger issue is really “Who can we trust to provide support for what may turn out to be a reasonably large-scale service?”  So the features aren’t nearly as important as the reliability and trust.

Thus: what say you, friends?  Who rates as a great place to plant a web service seed that could one day grow into a mighty forest?  Let me know!


The winners of Microsoft’s MIX 10K Smart Coding Challenge (for which I was honored to serve as one of the judges) have been announced, and the Grand Prize has been awarded to…

Jimmy D‘s Frog Log.

Which is an HTML5/CSS/JS entry.

That doesn’t run in Internet Explorer.


Frog Log was my top pick, and obviously did very well with the other judges too, for a good reason: it’s a fun game.  It doesn’t play quite the same in Firefox previous to v3.5, as the drag-n-drop doesn’t work.  Instead, you click on a frog, then click where you want to place it.  I actually found that made the game a touch easier for me, but your interaction may vary.  In addition to working in Firefox, Safari, and Opera, it also runs on a number of mobile devices.

Here’s an excerpt from my judging remarks:

Just a great little game, addictive and well thought out with some interesting gameplay.  I would LOVE to see this developed further by the author…  My only ding was that drag-n-drop failed in Firefox 3.5; clicking worked fine, though.

I’m not sure why I had trouble with drag-n-drop in Firefox 3.5, since I don’t have have the same problem now.  Maybe I got confused with browser version numbers or something.  Regardless, it works fine, it’s a great game, and remember: it’s less than 10K unzipped.

I also gave high marks to the HTML5 runner-up, Chris Evans’ 100pxls, which was the source of my Dadaist tweet a couple of weeks back and lands right in my personal sweet spot for “doing odd things with popular web services”.  Here’s some of what I had to say in my remarks:

…really liked the concept here, especially the nonsensical tweets that were generated by drawing your own icon.  The icons could be made easier to see in the main display, but I suppose that’s a minor quibble.

I’d like to thank the MIX 10K crew for getting me involved as a contest judge; I really enjoyed seeing what people created and had a hard time narrowing down my votes to just a handful of winners.  More importantly, though, I offer my heartiest congratulations to all the winners, and most especially to Jimmy and Chris for doing such fun, interesting, and downright cool stuff with 10K of web standards goodness!

November 2015