Site rebuild

Like a Phoneix from the flames the Clawg Blog has risen once more. Formely on clawg.co.uk my hosting lapsed during my immigration to New Zealand, but thanks to the wayback machine I have managed to salvage most of my old content.

As part of the resurrection I've recoded the blog and tried out a few new techniques along the way. Techniques that I want to add to my workflow in my new job with the New Zealand Post. So what's new?

SASS

I now preprocess the CSS using SASS. I've used LESS on several projects but SASS intrigured me as it feels there's a larger community behind it than LESS.

I've enjoyed the shift, I feel SASS is more powerful than LESS. The features like silent classes, more programing like syntax, the breakpoint handling and of cousre Compass make this a real winner for me.

The SASS v LESS debate reminds me of the browser wars or framework wars and I am backing SASS to win this one.

The use of SAAS or LESS really helps with responsive design. They make the maths involved in setting column widths and gutters much easier and changing values is simple.

Another bonus for SASS is the SUSY grid system it's an excellent SASS plugin for putting reponsive grids together quickly.

OO CSS OO SCSS

This is one of the things I love about SASS. You can use the @extend or even better $silent class to add presentational values without messing with the markup and keeping the classnames semantic.

This article explain it well.

Mobile First

Whilst the old site was responsive it was never built mobile first and you could tell, the mobile version was a bit half arsed whereas the newer version takes into consideration several breakpoints and conditional loading of content (sidebars).

New section

I've added a work section that showcases some of the projects I have been working on.

CSS3

More CSS3 fun with the use of :nth-child() pseudo selector. I like this bad boy li:nth-child(3n-5) which selects every 4th item, Chris Coyier explains it well.

Using Normalise

instead of using a CSS reset I gave Normalise a shot. The jury is still out on this one for me, I find that I can end up overwritting more styling than I would with the reset, but I like the text size and line spacing you get out the box.

No more Wordpress

I just dont need the hassle of setting up a Wordpress template again. I figured I could spend hours disecting Wordpress templates or just get on with it, so that what I done. If I feel the need for CMS in the future I will just Perch it up

Previous updates

This adds to some of the features I mentioned in a previous post:

  • Made use of CSS3 sudo selctor :last-child
  • Added trasparency to the content areas with CSS3 rgba
  • Drop shadows with CSS3
  • No more DD roundies for non ie users. Round corners are now handled with CSS3 border-radius
  • Pages now validate, it took a while to disect all the crap that was in wordpress but I got there
  • I added some new fonts. I started experimenting with typekit but after coming across the issue related to the flash of unstyled text I decided to simply use @font-face instead.
  • text-shadow has been added to some headers
  • Moved a lot of unnecessay markup and made some of the existing markup more semantic. There is still a few bits to go on this one.
  • Moved the dependancy of JavaScript for the twitter update which now uses PHP
  • Multiple backgroud images