My weblog work journal. »Archives »Links
Oh, dear me. That was traumatic. Everything about redesigning this site was horrid! On top of it all, I think I got a glimpse of myself if I had obsessive compulsive disorder.
The bug had been growing to redesign for several weeks now. It was time. The old MaxRiffner.com site had been one of my first sites designed completely with CSS. Many moons later, I’ve become very comfortable with CSS, and I decided I didn’t want to redesign my site into something new or cutting edge. Far from it, and if you browse through the CSS Vault, a gallery of hot new CSS websites, you’ll see that the majority of them all look the same. Gradient backgrounds, soft edges, or the rough-worn look dominate these sites.
And, if I have to be honest, I’m not exactly cool. I decided that my site should look like what I like and value, which of course doesn’t look anything like most of those sites. So, in no particular order:
After a series of sketches and thumbnails, I felt I had a good idea of how I wanted it to look. Next came the structure of the backend. Having used Textpattern as the backend which drives the Parlor, I wanted to rip it out of Parlor and expand it into the rest of my site. This would be tricky, to say the least. I decided to export all of my Parlor entries from its database and load it into a clean Textpattern install running on my personal web server on OS X.
This was where things went south quickly, mainly due to hours wasted researching why my .htaccess file wasn’t working (Apple turns it off for you, which makes sense, most people won’t need it). During this frustrating period though, Kenneth pointed me in the direction of MAMP. This is possibly one of the coolest applications ever developed for OS X thus far. MAMP is installed as an OS X native application, and it is a full local server environment that you can quickly turn on and off. Plus, if you already have your default Apache server running, it won’t compromise that installation at all. So, in a nutshell, you can have Apache, PHP, and MySQL with a phpMyAdmin frontend installed and running without knowing how to do anything. Perfect!
The next day was spent importing data into my test site and starting simple layout changes. I meant to do mockups in Photoshop for the final site, but one thing led to another and pretty soon I was looking at what I had in my mind on the screen. Next up was manipulating all of the data and outputting it into different forms and sections for the site.
Now, see, the whole time I’m building the site… this is all I am doing. I worked straight through the weekend on this, with a three day migraine no less, and I just would not stop for anything. Sleep was a luxury that I denied myself, and when I did try to sleep I’d hit that insomniac wall since I couldn’t stop thinking about all that I needed to do.
It was in that state of mind that when I was ready to upload the site to my production environment that despair set in. MySQL. My enemy. My production database would not import my SQL dump. For well over three hours, I tried and tried, cursing the world, near tears from no sleep. Kenneth again came to the rescue and walked me through the steps, just in case I was missing something. I wasn’t. However, sometime around midnight, the database took the data. I don’t know why at all. It just magically appeared, all neatly organized into its appropriate tables.
After a swift prayer to whomever granted me this boon, I quickly set to work on bringing the site up live, which with Textpattern, everything is in the database – images, CSS, you name it. Thankfully, this went quickly. Just a few minor tweaks and I removed my static HTML “We’ll Be Back Soon” page. MaxRiffner.com was ready for business!
Today, I set up some redirect rules and a custom error page, tweaking CSS rules here and there. Overall, I’m very happy with it. The site looks exactly like I had envisioned it; this is one of the first sites where I didn’t do any finished mockups. I’m very pleasantly surprised at it. Sure, there are still a few rough spots, like my little Parlor mascot – he’s not Hello Kitty enough yet (I’m obsessed with Hello Kitty right now), but I think I hit all my goals.
Tonight, I’m exhausted (and still tweaking – I’ve been messing around with Google Groups for my mailing list). It’s time to unchain myself from the computer and get some relaxation back into the equation. If you have read this entire beast of a post, thanks. Also thanks to Kenneth, the MaxRiffner.com cheerleader, and most especially thanks to the Chief for putting up with four days of insano-designer-husband.
Alright, time for a bourbon…
Well done on the redesign. The site looks super. I especially like the easy-to-read linespacing.
Thanks for the compliments, guys!
I especially like the easy-to-read linespacing.
So nice of you to notice! This was a big issue for me that I didn’t really get into in the post: achieving the right word-count-to-column-width ratio (with the appropriate amount of leading) for maximum legibility.
For those not in the know, a quick design lesson: in any column, a great rule of thumb is about 7-10 words per line, so you should adjust your type and line spacing (otherwise known as leading) sizes accordingly.
you are a nut but i love you anyway. there is a picture for you and the “chief” of jessica going to your mom’s ( i don’t have your address.) write when you can
Nice Max. I was pleasantly surprised to see a redesign of your site and it’s so clean!
The 7-10 words per line creed is good to follow and I’ll be incorporating that and a slew of other things in the redesign of kartooner. Most likely I’ll have to work through the weekend to get it finished as well.
Again, looks great!
You can also browse through the Parlor archives.
Stay up to date with my Feed in your favorite newsreader!
Check out who is linking to me with my Technorati Profile.
Feb 1, 09:28 PM
The site’s beautiful, Max, like I said last night. Seeing your new design just makes me want to redo mine even more. Maybe I’ll finally get some time to do it this weekend or next.
Good job again. Maybe you’ll start a CSS revolution.