An Event Apart Seattle 2017: Let’s Build a Website (and Talk About The Job of Front-End Design and Development) by Chris Coyier

The last session of the conference was what Chris referred to as an “all-day session”. Chris spoke extensively on multiple topics throughout the day, all of which centered around the idea that writing a website today has a lot of complexity.

Truth be told, most of us in the audience know perfectly well how to build a website, at least to the point that we can build something and get it into publication. Some days it seems like everyone and a whole bunch of things (looking at you, frameworks) believe they know how to build a website.

But best practices are harder to identify and codify, especially with the industry moving on so many topics in so many directions at once. The result: this session was a fantastic use of my time, even having been in the industry for over 20 years.

It’s worth nothing that the session was very geared toward front-end development and developers. This was not the session where you were going to learn how to design a website or how to brand or even at the other end how to test. In that sense, it was the most focused session of the conference.

Since it was an all-day session, and since Chris spent a significant amount of that time actively coding, I did my best to capture the highest concepts and did not get every detail. If you’d like ever detail, Chris is teaching another session in Chicago in August.
Continue reading

The Zoo Story philosophy, and when it doesn’t work.

In his play The Zoo Story, Edward Albee once wrote, “Sometimes a person has to go a very long distance out of his way to come back a short distance correctly.”

I’ve always seen that as a bit of a motto for my design work. As designers, it’s rare that we get handed a problem to solve that has a straightforward easy-to-implement solution. It’s all about the context of the problem, especially when we’re creating the context as we go. A thoroughly researched and implemented design requires capability strategy, iteration, research, iteration, design, iteration, testing, iteration, iteration, and iteration. You can try to cut off somewhere in the middle or skip a few steps, but you’ll usually come out of it with something that feels just a bit like you installed shelves with only some of the pieces that were supposed to be in the box. There’s nothing wrong with approaching complex problems with the mindset that the journey will be long, but the destination might be two blocks over from where you started.

Today, though, I’m thinking of rethinking the Zoo Story approach to this blog.

I’ve been going a long distance out of my way to design and develop a visually-attractive responsive theme for this blog, so I could come back the short distance of “provide evidence that you can produce a quality blog” correctly. I want to prove to myself that I could work on mobile-first content-first responsive design projects by making this a responsive-design (responsively-designed?) blog about design, development, and user experience.

I’ve hand-coded the theme(s) to my other blog since I moved to WordPress in 2004, and before that I hand-coded all the pages. I learned most of my CSS and all of my PHP developing for my now-sleeping comic. When I started, there was no good canned theme solution for comic presentation in WordPress. (There still isn’t. That’s a rant for another day and one that requires responsive images to be solved.)

The problems I ran into were threefold:

First, WordPress’s crack development team beat me to it. Their 2011 theme is already responsive. So to make my! very! own! responsive design theme, I had to cover my eyes and LALALALA a lot to pretend I hadn’t seen anything in their code. Even though it’s excellent, and it works for my site structure.

Second, the development of a responsive design layout takes a lot of work. It is an absolutely great experience from an educational standpoint, and one I plan to continue. It’s just not something I can produce fast enough to also blog on a regular basis, which was the point of having a blog.

Third, I’ve had a stubborn blind spot about using other peoples’ code for my website(s) since the beginning. I was “raised” in the world of apps producing truly crap code “for me” (see Microsoft Word, FrontPage, and even Dreamweaver to a certain extent). I struggle against using any code-generation system because my gut says it must be full of bloat. Why use WordPress’s image uploader when a simple <img src> declaration would be enough to meet my needs?

But the fact is that, for a responsive site with responsive images, they’ve got a damn good system going here.

It might be worth noting that in The Zoo Story the “right” solution involves forcing an unsuspecting stranger to knife you. So, y’know, there’s an argument to be made for staying local and not provoking others into violence.

Sometimes, you have to go a long way out of your way to come back a short distance correctly. But sometimes, sometimes you can walk two blocks and reach the same destination, without any fuss or heartache at all.