Ever since I decided to quit my job, creating a new site for my freelance business was at the top of my list. As days, weeks and months passed after giving my two-week's notice, other priorities popped up and paying the bills became paramount. My site, meanwhile, became the admonishing voice in my head reminding me that it's rather pathetic when a web designer doesn't have a site.
So when September started, I committed myself to getting a new site designed, developed and into ExpressionEngine. I put everything that didn't earn me money on hold. Naively, I didn't think it would take too long. My content was simple, my personal aesthetic tends toward minimal, and I'm a wiz with markup and CSS … two weeks, tops, I told myself.
Five weeks later, I'm relieved to say I'm 99.9% done … I give you Emily Lewis Design.
Twice the Time
Why did it take me almost twice the time I expected to design and develop my site? Part of the extra time was coming up with some sort of "brand" for myself. And, frankly, I didn't even really do that. I made a logo, selected some typefaces and a color palette. Nowhere does that qualify as branding. Yet, it still took me forever to finalize those basics.
But most of the extra time spent can be chalked up to the fact that I'm my worst client.
I kept having new ideas. And I tried each and every idea, sometimes spending hours with an idea only to decide it wouldn't work out in the long run. Scope creep doesn't even begin to cover it.
And then I wanted to be fully creative and inspired … developing markup and CSS that I was never allowed to use in my corporate job. Sounds awesome (and it was), but it took more time to plan, research and implement.
I pretty much allowed myself to be that PITA client who keeps changing her mind about the colors and the content and the functionality.
I strayed from the process I use for every other client, and it screwed me. Lesson learned.
But Tons of Fun
Even though the process got fucked up along the way, I had so much fun with it. Between using HTML5 and some (relatively) advanced CSS, I was in geek heaven.
HTML5 (with a dash of WAI-ARIA) feeds my love of semantic markup. Being able to take my markup to a new level, making it even more semantic is better than chocolate and champagne. I also loved getting a better understanding of the outline algorithm.
And using CSS that I knew would bork in IE, was refreshing. I almost never had the option of ignoring IE in my former job, so it was a treat to use what I wanted and simply forget about IE.
I also experimented with
@font-face, which was a useful learning experience and (almost) delivered what I wanted.
No Love for IE?
I originally planned on giving IE the finger and just ignoring it entirely. But then I considered who my clients and prospects are … many of them still use IE.
So I started waffling on my original intention and did a little hacking a la conditional comments. IE was getting acceptable, but I wasn't sure if acceptable was good enough.
I gave CSS3PIE a whirl. Fairly impressive. Not only did it take care of the little CSS properties like
border-radius, but it also gave me transparent PNGs and advanced selector support.
I was quite happy until I realized the addition of PIE significantly increased page load time in IE, especially IE 6. And then it turns out PIE has some (as yet unidentified) conflict with jQuery tabs, which I'm using all over my site. On pages with jQuery tabs, PIE simply doesn't work. Period.
CSS3PIE went out the window and, to be honest, I'm still not sure what I'm going to do about IE. For now, the conditional CSS I threw at it is fine. But I don't like straddling the fence … I'd prefer to make up my mind and just go with whatever I decide. I've installed Google Analytics, so I'm going to keep an eye on browser stats and let that dictate direction.
OSes and Fonts
Another frustration with my site design was with the Mahalia font I used with
@font-face. As it turns out, the line-height and size renders differently on PC browsers than Mac browsers.
So, where I'm using Mahalia for my
<aside> headings, the vertical position differs from my intended design if you are on a PC browser. Granted, a small issue, but ridiculously annoying. And I hope one that I can eventually find an acceptable solution for.
Smooth Sailing With EE
The one simple and straightforward phase of my site development was ExpressionEngine. I've said it before, I'll say it again: the fact that EE lets me dictate my markup is the primary reason I love it.
Once I upgraded to EE 2.1 and installed Multiple Site Manager, I just dropped in my markup and got my custom fields set up, and everything worked as planned. Couldn't have been easier.
Well, I lied a little bit there … I did have some issues with displaying child categories for a single entry. I think the Child Categories add-on would do what I needed, except it isn't for EE 2. So, I hacked a solution and I'm going to pray the plugin gets upgraded.
I do still have a few more things I'd like to address:
- My CSS is a hot mess. I need to go back in, clean it up and optimize it.
- I also want to mess around with media queries and the uber-trendy "responsive design."
- I'm using sprites, but I suspect I could be using them a bit more efficiently. I need to revisit those.
- As I mentioned, I need to get off the fence about IE. Whatever I decide will likely mean a bit more tweaking of something.
- I haven't done all the user and accessibility testing I'd like to do, so more time needs to be spent there. I already know of a CSS change I need to make to my jQuery tabs.
Aside from those relatively minor issues, I'm satisfied. It is a solid site, and I learned a lot while creating it. Best of all, I can now return to focusing on projects that make me money.