visualgui

Web Design Doesn’t Have to be Complicated

Designer Frank Chimero has written eloquently about the increasing complexity of web design. I appreciate his honesty. As someone who has been making websites for a living for 16 years, I share his sentiment. I feel his confusion and frustration, but I would like to offer a more optimistic view. Web design doesn’t have to be complicated.

In 2002, I landed my first full-time job as a web designer at Vassar College. At the time, I was transitioning from Flash to table-based web design. ActionScript overwhelmed me. Flash was no longer a fun animation tool for me. Table-based layout was a pain to code, but Dreamweaver came to rescue. I still remember slicing and dicing up Photoshop mockups with spacer GIFs all over the layout.

In 2003, I made another important transition from table-based to CSS layout after reading Jeffrey Zeldman’s indispensable Designing with Web Standards. Between 2003 to 2004, I spent most of my working hours retrofitting Vassar’s websites from table-based to table-less using floats. Like Frank, I did not quite understand clearfix either. My workaround was using Dan Cederholm’s “group” suggestion.

I came to web design without any design background; therefore, my approach has always been simple and clean—not only with the visual layout but also the markup. I was a proponent of separating structure and presentation. In the first decade of my professional career, I kept myself on top of the game by reading blogs, articles, and books. I made the transition from fixed layout to responsive web design with ease and excitement.

As I was getting older and starting a family, I began to fall behind. The web just kept on growing without me. I recalled listening to the ShopTalk show and had no clue what Dave Rupert and Chris Coyier were talking about. What the heck were Angular, Backbone, Dojo, and React? What were Broccoli, Gulp, and Beanstalk? I knew they weren’t talking about vegetables and drink. Eventually I just stopped listening altogether to save me from depression.

I had recognized that web design had become too complicated and overwhelming for me; therefore, I decided to refocus my energy on the parts that are important to me. I did not need to follow the latest trends. I was not into parallax scrolling. I did not want to use any frameworks. I wanted to create websites that focus on speed, legibility, readability, accessibility, and simplicity. My main tools are HTML and CSS. I use JavaScript only when I have to. Responsive navigation is an example that required JavaScript to work.

Typography matters a great deal to me and I understand that using web fonts could be complicated. As Frank rightly pointed out, Bram Stein has written an entire handbook on the subject. In my own book, I also pointed out various methods of delivering web fonts. To get started, however, I just need one line of markup:

<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">

I knew that I would miss out the nuances of font-loading techniques, but I am OK with that. Frank pointed out that CSS Grid is daunting to learn and I agree. The complexity that CSS Grid can handle is mind-boggling, but it doesn’t have to be complicated. As demonstrated in my book, I could accomplish a solid grid layout with a few lines of CSS:

.grid-layout {
display: grid;
grid-template-columns: 2fr 1fr;
grid-gap: 1em;
}

Again, web design doesn’t have to be complicated. With HTML, CSS, and PHP includes, I can put together decent websites. I don’t need a CMS. Even WordPress has become too complicated for me over the years. I started using WordPress before WordPress launched. Remember B2? Back in the B2 and WordPress 1.0 days, creating a theme was a breeze. I just needed 2 files (index.php and style.css) and an optional image (screenshot.png) for the screenshot of the theme. Parts that needed to be dynamic, I just needed to hook up some PHP snippets. In fact, this blog is still built using this approach so that I know exactly the pieces of codes go into my theme.

Now, an official theme from WordPress, such as Twenty Seventeen and Twenty Sixteen, has about 100 files. These days, creating a theme from scratch for clients is such a huge investment. In the past, I used starter themes like Underscores for client, but even that had begun to get complicated. As a result, I stopped offering WordPress to clients.

I moved away from complication and get back to the simplicity of web design. I enjoy the web more that way. I am like the Jay Z of web design.