It’s here! After many months of deliberating and indecisiveness my new Webknit site is finally live!

For those of you who don’t know, Webknit Is the outlet for all my freelance work. It’s become my ‘name’ on the web, in addition to being my ‘web workshop’. Last years design was good enough to be featured on a few inspiration sites and nominated for a .Net award in the  “best online portfolio” category. I’m hoping this years site is much better than last years. I certainly feel like it is.

About the site

I’m pleased to say that this website is completely static. There is no CMS involved whatsoever. Unfortunately I found myself in a routine of using WP for just about every website I made – there’s no blog on this site and therefore no need for a CMS. Adopting this approach means that I have total control of the site with static page templates, changing the layout, colours or whatever on a page is easily achieved with a bit of extra markup and styling.

I’ve recently started to take code and its performance very seriously. This site is my best code to date and it’s super fast compared to my last one. The site is currently relatively small and features three main pages, about, work and contributions. The latter is a newly introduced page that describes the personal/open source projects that I have created.

The site is responsive and ‘retina ready’. I’ve used standard CSS for the larger background images and served the larger images to retina screens. I also wrote some JS that switches the paths of foreground images if a retina screen is detected.

I used a fantastic tool called Hammer, which enabled me to build a static site that has the capabilities to pull partials in and do a ton of other stuff. I would highly recommend it! The CSS was written using SASS and some fonts were supplied by Typekit.

I have the following people to thank for their generosity as I made use of some of their open source stuff.

Some vector icons and inspiration for others – http://www.elegantthemes.com/blog/freebie-of-the-week/beautiful-flat-icons-for-free

Vector illustration – http://www.bearduo.com/

Mac Illustration – http://coletownsend.com/

Vecor Macbook – http://uispace.net/view.php?id=66

Photo – http://unsplash.com/

Have fun!

http://webknit.co.uk/

You may also like