2k50: An Experimental Project

I've been working on a personal side project called "2k50: The 50 Best Songs of the Decade," which just went up a few days ago. I spent weeks compiling my 50 favorite songs of 2000-2009, and am now posting 5 more every day until December 30 (50-26 are up as of this writing). This project also served as an opportunity to further explore Wordpress as a site management solution. It worked wonderfully, and has given me a lot of insight into how to build sites that clients can update themselves even if they don't know how to code. Furthermore, I even learned a new thing or two about CSS layouts. This may not mean much to those who don't know coding, but I was able to design the site using solely text and CSS-scripted boxes of color -- this is a great technique in general as it not only makes pages load faster, but improves searchability.

Check it out: 2k50: The 50 Best Songs of the Decade

Introducing the color switcher

I've just relaunched my portfolio website, and one of the main new features is the color switcher (pictured above). I realized a few things about my site as I was considering a redesign:

• My site has a very simple color pallette - black, white, and green - but the green was chosen somewhat arbitrarily. Why not a different color?
• My site should be more than just a place to show images of my work, it should show some of my coding ability as well.
• Some of the best design firm/portfolio sites I've seen add a level of interactivity that engages the visitor.

Those three concepts tied together quite well in the concept of the color switcher. I used the code from this helpful tutorial at A List Apart and removed all color declarations from my primary CSS style sheet (sorry if this is a bit codey for the non-coders), and then created seven style sheets that dealt only with colors. It also creates a cookie which remembers what color you last chose when you return to the site.

All in all, it is a fairly simple concept that can be executed in larger ways for other sites, such as changing font sizes or allowing re-skinning for users, and can extend well beyond colors into entirely reformatting the visual structure. CSS Zen Garden is a good example of this taken to the extreme, although unlike CSS Zen Garden, my color switcher requires no page refresh.

Pretty neat, huh?

How much can you know?

Confession time: I don't know everything. I know, you're shocked. But seriously, I was talking with a couple friends who are in web design, shooting the shit about various techniques and CSS and JavaScript (you know you're a nerd when...), and at one point I blurted out, "sometimes I feel like I don't know nearly as much as I should and I'm just making it up as I go along." My friend, who has had a few years more experience than I have, didn't miss a beat: "You just described everyone in our industry."

That was comforting, and probably true, as there are so many different things any individual could know in the field of web design that it's pretty much impossible to expect anyone to know it all. I'd argue that the greatest advancements in design have come from people who were making it up as they went along.

It seems to me that a good designer -- or perhaps more specifically a coder/developer -- doesn't necessarily need to know how to do every idea or assignment that comes their way. They just need to know how to LEARN how to do it.

I'll give an example of a recent project I did. There were a number of techniques I wanted to do, yet didn't know specifically how to do them off the top of my head. Among them: tabbed content within a page (rather than clicking to a new page for every tab), an automatic rotating image slideshow, a form that calculated various fees and totals in real time as you select different options, and a method to display content only if it exists on the server and how to present an alternative if it doesn't -- these are all things I had never done before, but knew I could figure them out, and I managed all of them successfully. Admittedly these are smaller features, and allowed me to learn in chunks rather than being presented with something as complex as "build us an online stock trading system." I felt confident tackling them because I at least knew enough about the various languages and techniques involved to know that they were all achievable, and as I worked on them, I learned more about other underlying concepts that will help me with the next new idea/design.

I think too many people, when given a challenge they don't already know how to complete, simply give up and think it's outside of their abilities. This is rarely true. There are still coding languages and techniques that seem so complex to me that I can't help but feel intimidated -- but breaking them down, and remembering that everyone who is now an "expert" was once in my shoes as well, has made me realize that knowing "how to know" is a skill that lets you do just about anything.