I’ve borrowed pretty heavily from Dan Cederholm’s Handcrafted CSS for the initial css import structure and some tricks to hide styles from IE.

I had been using Eric Meyer’s reset.css method before I came across and Jonathan Snook’s articles arguing against them. So, this framework uses the reset.css file to set default styles rather than reset them.

In that reset.css file, I’m using html{font-size: 16px;} and body{font-size: 62.5%} to set my measurements to a 1:10 ems:pixels ratio. I believe that idea originated with Richard Rutter in this article.

I’m using SASS to compile my CSS these days (I’ll make a separate post about why), and I couldn’t find many other frameworks that have the SASS already set up. In my file structure, the “sass” folder compiles within the “css” structure. Depending on the CMS I’m using, I’ll usually move the “sass” folder outside of that CMS’s file structure, but at the framework stage, it’s sitting in the root.

There are more people that have influenced it, of course, but these are the biggies (and the ones I know of/can track down). The download file is a work in progress, of course. As I change it, I’ll update git with the new framework. Feel free to fork and make adjustments for your own. Questions/Comments? Let me know in the FB comments below.

Download my framework.

Having recently filled my 250 gig external hard drive, I figured it was time to upgrade. I dropped something like $200 on a decent 1 terabyte drive and moved all my music, photographs and designs to the new drive. I even formatted my old drive and planned on backing up my finalized files to the old drive on a weekly-ish basis.

Emphasis on the word “planned.”

Stupid. So, recently my aging 1T drive flatlined. And three weeks later, after a number of visits to the local computer-magic-recovery-workers, I’m coming to the realization that most of my important, valuable files are gone.

This has caused an all-out, heightened and accelerated ride through the Kübler-Ross model. This blows.

So I urge you all to back up your files. Right now. Quit reading and back everything up.

Interestingly, though, this has given me the opportunity to step outside of my own little design world and do some honest reflection on my work. As I’m pouring through hundreds of arbitrarily named files, I’m realizing that a lot of work that I once had in my portfolio—stuff that I was once really proud of—sucks.

It’s just not that good. It’s not the type of work that I stumble upon online and gets my heart racing and my fingers itching for a mouse (go ahead, mock me for not using a tablet yet) or my camera. It’s not the type of work I want to be producing.

Maybe it’s that I’m too close to it. Maybe because I have intimate knowledge of each piece—I know exactly the methods I used to produce each one or I know roughly how much Cold Smoke I had consumed the night I made it—it’s lacking the mystery and ambiguity of others’ work.

But then there’s the occasional piece that pulls at my heartstrings, because I know it’s among the best I’ve created, or there’s the pit in my stomach because I’m still not sure if my “Property of the State of Montana” pano has been recovered.

This has been a roller-coaster ride, to say the least. Out of it, though, I hope to be producing better work, with less bullshit. That’s the work that I’ll populate this new blog with.

In the meantime, my new backup plan is to store a “Current Jobs” folder on my local hard drive which would be mirrored on a new external hard drive (containing everything). Finished files will be backed up in an online storage system. I still haven’t figured out which online storage system is best, so if anyone has recommendations, let me know in the comments, on Facebook or shoot me an email.

P.S. Go back up your shit.

We’re so obsessed with answers, the end product, that the process, the development often gets lost. I’m trying to change that, at least for myself. And I thought I’d start with this website.

Sometimes I wonder what clients think about the web design process. They see designs fairly early in the timeline, sign off on a direction then wait for the final product. I’m going to let you peek behind the curtain.

If you’re viewing this shortly after this post was published, this might look like a website void of any styling or design whatsoever. You’re right. I’m starting from scratch and am going to work through the design and development process. All live.

So, if you check in often, you’ll see my progress, process, and mistakes. Here’s to being transparent in my design process.

Timeline-wise, this could be a bit slow. I’m no longer a full-time freelancer, so (at least) eight hours of my day are dedicated to my current, wonderful employer, Wendt. Feel free to give me a hard time about my snail’s pace via the comments on this post.

On the tech side, this is going to be one of the first sites I develop using HTML5. I’ll be using various CSS3 properties and will be integrating everything, beginning with this post, with WordPress.

If you want to view my work, feel free to visit the old site. Drop me a line in the comments area or shoot me an email, if you like. Otherwise, enjoy the process.

3.29.11 Update: I divided my <article> into two columns using CSS3. If you only see one column of text, it’s time to update your browser. I also added the lovely orange bar to the top, some texture behind and started playing with @font-face to stylize my headline text. Hooray, Chunk!

9.6.11 Update: Hoofta. I had a floating issue that effectively killed my CSS for a while there. Fixed now, so I can get back to business. Told you this would be slow…

10.14.11 Update: Still missing some essential pieces, obviously. But I published the second post I had been sitting on and incorporated the Facebook comments widget. It’s different from your typical “comments” area on blogs, but I think it may be more effective, at least initially. Agree? Disagree?

jP