2011. A very good year. At least it was if you create websites. For us at Kindleman 2011 was a year jam packed full of power-ups, refinements, revolutions and improvements as we adopted technologies that are ready for mainstream use. Here is just a taster of what has been happening down in the KindleLab.

Fancy pants Visual Joy

The first half of the year was all about the things that control how sites look and behave. The stuff designers get excited about.

Content and Meaning

In January we decided HTML5's time had come. It's the new standard and brings a new pragmatic approach to markup. More semantic tags, rich media, more meaningful forms. It allows for web sites that behave like native apps within phones & tablets. Less reliance on flash. It's super awesome.

Making it look good

Css defines the presentation of your content. It's where the style is defined. There is a new Spec available, and in Febuary we set down some procedures to use it via progressive enhancement. That means that browsers that can support it display it, whilst less capable browsers gracefully show a slightly less whizzy version. We like to use it in a subtle way, with tiny improvements you can hardly see. Little fades, subtle fonts, transitions, soft corners and shadows. Css3 has allowed us to improve the experience for users and decrease the cruft in the mark up - boosting maintainability, SEO and speed.

Shaking the web

Ethan Marcote published his responsive design article in the previous year, pointing the way to building sites that intelligently respond to their environment. Flexing and fitting into the desktop, tablet or phone they are delivered to.

In June we bought his book, updated our Css frameworks to take advantage of this brave new world and set off. The results are amazing. The uptake of mobile devices for web use is huge. So is responsive designs' ability to meet that challenge. Check out Tim's post for more details.

Tools

The experience can come to the forefront.

All this change requires management. Previous Css frameworks worked to a fixed grid and browsers with different capabilities require intelligent detection and responses.

We updated our front end frameworks to deal with these new challenges, taking on board best practices from community projects like the HTML5 Boilerplate and incorporating capability detection with  Modernizer, fixing browser weakness with polyfills like  CSSPie and using frameworks that deliver a flexible grid in place of a fixed width.

This stuff eliminates a lot of human error, browser quirks and confusing code.  We don't have to re-invent the wheel all the time, instead bootstrapping each project with an appropriate selection or standard tools. We can focus on the end result rather than the nitty gritty details on a day to day basis.

Collaboration and workflow

The design thinks.

All this change has brought about some changes in how we work. The design is no longer a fixed thing in a psd file.   Shadows and fonts and border radius are more accurately depicted by rendering them in the browser now that they aren't composed with bandwidth heavy images.  Effects and transitions allow us to shape how a site feels.  Movement is almost impossible to show in "final" artwork. The design itself; the actual layout moves.

More collaboration is required now than ever between the design and development team. Workflow will  become more agile and more of the design is beginning to happen in the browser.

What about the Grunt?

Never mind all that fancy visual stuff. What about the grunt? What about what powers your website or application? Time to muscle up.

We have been using Cakephp for a while to deliver capable & robust online applications. In October CakePHP released version 2. Cake2 is a complete rework. It's more mature, adopts standards & uses the latest php features. It is a massive improvement. Updating a couple of apps to the new version saw a page processing speed increased by 200%. It's smooth and stable. It further enables us to develop elegant solutions - which is nice.

So what?

Less struggle, more elegance

So what does all this mean for Kindleman and our clients?

• More powerful, feature-full and faster websites
• Sites apps that work on any device
• More visually appealing, accessible, semantic sites
• Better workflow: less repetition, more structure, more robust websites.

In 2011 we made some awesome stuff. We built a multisite platform that powers a clients ecosystem of websites. We have helped clients set off into the world of ecommerce with modern & capable platforms. We have made business applications that improve peoples daily workflow and communication and developed our CMS that powers complex sites with meaningful content structures without limitations to the presentation.

We have also discovered so much, and next year there will be more. It will be completely awesome - see you there.