I’m very happy to announce the redesign. Over the past year or so since the last update things have really been progressing and my portfolio is looking very respectable with a few projects that I am very happy to be a part of. However, I have been so busy that the simple task of launching a new and improved version of this site has been something of a challenge. I wanted to completely rewrite the code and make the design as awesome as I could with the spare time I had, but I also wanted to keep the logo and expand on the colors and not change the overall feel of the site. As far as I can tell from my extremely biased eyes things are looking good and the enhancements convey my vision.
The code behind this WordPress web site is very custom to say the least and I took every chance to build upon my personal WordPress functions library. Some of the code behind the site I will be sharing in a few articles over the next few weeks. But to give you an idea of what powers this site is a short list of features I have cooked up. But before I go to far into this I have to say that I removed probably 20 or so pages if you’ve been here before and are wondering, basically the whole services section was removed because most people, based on my analytics, only want to see the portfolio section anyhow. As well, I’m trying to focus mostly on WordPress based projects for a while. Not to say I will automatically turn something down it’s just what I excel at. WordPress themes, plugins, and functions with some sexy designs for good measure. Moving on.
The XHTML/CSS
100% valid, if you find a page that doesn’t validate please I encourage you to let me know. I am a big stickler for valid semantic code and do my best in client projects but you can’t always control what people do after you build the thing. So for that very reason I make damn sure my site is valid. I always write my code in XHTML 1.0 Strict. It’s very important to me that you separate the content from the presentation and only use tables for tabular content. However, you will find that I use some CSS3 that will not validate but I keep it in a file names invalid.css which is basically the rounded borders you see scattered around the site.
The WordPress
In the functions.php file for this WordPress theme you’d find some serious hidden gems. I have for example, a function that queries my portfolio page and finds all of it’s children and allows me to dynamically pull information from them and display it back as a gallery of thumbnail images, titles and a short descriptions for each child. In addition to never having to update my portfolio page because it’s completely dynamic, I can also use the same code to show the last two projects in my portfolio on the home page. Basically, it drastically reduces the amount of work needed to maintain a portfolio web site without turning my pages into blog posts like many of the other themes you find on the internet. I think it’s important to separate your blog posts from your pages. It’s just seems unnatural to me to try and fool your blog into being two things at the same time., but that’s just my opinion.
Another great feature that I wrote a while back and refined into what it is now, is the ability to know if you are on a certain page or any of it’s children, including grandchildren. With that, you can do some pretty sweet conditional stuff like show only certain scripts on a set of pages or maybe a different sidebar than regular pages have. Also, I did the same thing for categories. The functions are: is_category_or_sub() and is_page_or_sub() and work just like their WordPress counterparts is_page() and is_category(), but just with the added ability to check if it’s a child, as well. Something that I think WordPress is seriously lacking and should consider adding to the core.
There is tons of things I could go into that make up this theme and it’s very custom little bits but I’ll save some for a tutorial or two very shortly. If you want to see the is_page_or_sub(); functions I wrote about that the other day.
The JavaScript
Oh yes, I use a lot of custom written JavaScript piggy backed on the fantastic jQuery library. It’s such an awesome library that you would have to be blind not to see how fantastic it is. Anyhow, The forms are AJAX driven with a custom tooltips script that displays a little extra info to direct my users and help to make the form data a little more meaningful. And the form will work with JavaScript turned off, which is extremely important if you want to make sure people can contact you regardless of if they want to be anti awesome or not.
A feature that I’m really proud to have on my site is on the home page. It’s not blindingly noticeable but if you click one of the three large images in the header they rotate in both right and left directions. A very sweet effect if I say so myself. Subtle, but if for some reason you get the feeling to click one of those images you’re not disappointing.
In summation I love the new site and am extremely happy to roll it out for everyone to critique and hopefully enjoy. I hope you love it as much as I do and if you don’t, well that’s just OK, I can live with that.
Comments
Brilliant work as always Derek! The new site is looking really fantastic!
Thank You! Got to fix some redirection issues and things should be all switched over. The site has been like 99% done for a few weeks but I have been busy so it had to wait.
Great work, the site is looking really nice. Smooth, cohesive and clear.
I like the design a lot. It’s a big improvement from the previous design and showcases the added skill sets you’ve been featuring in your tuts+ designs and various other work. A+ in my book
A beautiful site – quite elegant and simple – yet all visual element are strong functional, or story telling elements. Seeing your portfolio, you have created many of the sites that I find most appealing on many of the CSS galleries.
Other than the fact that it looks very similar in every way, including headings, to http://envato.com/... Yeah, nice.
;-)
Really? I would have to disagree with that statement cause the only thing they have in common is the green. And to clarify, this site has been green for a couple years now. I just don’t think they look the same but I’ll take it as a compliment cause the Envato site is a nice site.
I agree, this is rather close to the Envato site, right down to your leaf logo.
I love some of the details though, the way you present the blog index page and the meta-data for each post is very nice.
My logo has been a leaf since I stated this company a few years back and way before I had ever heard of Envato. It’s just coincidental that we both have a leaf. However, I can’t stress enough the fact that the two sites do not look anything alike. You’re hung up on the fact that they are in the same color family (green) and have a leaf in their logo, that’s it. Nothing else is even remotely close. The new design is also very similar to the old design except the typography was improved and layout of the page elements but the logo and color scheme is still the exact same.
nice site. love all the details on the forms.
Love your site – especially the little carousel effect on the home page. What sIFR technique did you use for the headlines?
Thank you and I used sIFR 3
Nice.
I like your work. You’re doing good things. Keep it up!
this page doesnt validate lol ;)
It’s an issue with the comment form having an extra attribute that’s not supported. It’s to make the JavaScript find the defaultvalue of the field and manipulate it accordingly. I’m working on a fix. But in the great scheme of things that is a small validation issue and one that will be fixed.
Other than the comments form the site is valid. I’ll rewrite the JavaScript when I get a second and fix the form so it validates too. Just been busy and forgot.
FIXED! Every page should be valid now.
Why don’t you use 4.01 Strict?
Why would I? Do you have a reason that would be more beneficial.