Blog

At Organic our developers get together in a weekly 'Developer Cuddle', during which we discuss the latest in web development, discuss current technologies and the interesting things that we are working on.

This week we discussed how using SASS has improved our front end capabilities and workflow.

SASS, in the developers own words "makes CSS fun again". It allows developers to now code their front end styling in a more intelligent and programmatical way. For those who know a bit about coding CSS styles for a website you will be aware that it can be an often laborious and repetative task. Your HTML code can end up bloated with multiple styling classes that inherit a style defined in your stylesheet. SASS takes a giant leap in eliminating this from happenning.

For a start you can create "mixins". These are basically global methods that include hyrachical styling that can be reused. e.g.

@mixin myMixin {...}

to assign that mixin styling to an element use :

.my-element { @include myMixin(); }

You can also use progrmming syntax such as @if, @else, @for & @while. This allows you to eliminate repetition and apply styling conditionally. e.g.:

@for $i from 1 through 10 {...}

You can also use variables using the $ syntax, this allows you to do things such as create styles based on those variables. You can combine these in loops (e.g. @for) to create style rules with less code. Strings can also be created using variables, for example:

#{'element-' + $my_var}

SASS on it's own improves your styling workflow, but there are apps out there that can improve things even more for you!

Compass is an application that allows you to create styling projects. This creates a basic level framework for you and allows you to choose to start projects from existing frameworks, such as Twitter Bootstrap and Foundation. Compass aslo comes packaged with some pre-built SASS mixins for you to use. These mixins primarily (but not limited to) handle cross browser compatibility for you. If you have had to create styles only to have to reptitively type out all the browser vendor prefixes (e.g. -webkit, -moz), then fret no more! You can just include a mixin for these tasks, e.g:

@include border-radius(10px);

That is all the code you need to apply a border radius for all current browsers with, amazing!

We also use an application called Codekit. Codekit works with Compass and will watch your SASS projects (and javascript amongst other things) and compile your SASS code into CSS that gets packaged with your website and gets processed by browsers. It even tells you where you have errors in your code, there is no need for you to do anything other than code in SASS. Just let these apps do the hard work for you.

This is just scratching the surface of what you can do with SASS and apps such as Compass and Codekit. There is plenty of documentation on all of this, so it is easy to pick up. If you know CSS it will not be too big a leap for you.

It is now up to you to explore these things and have a play, which is the best way I personally find to learn these things.

Financial Services remains one of the most highly regulated industries in the world simply because, when things go wrong, it can have devastating effects not just on individuals but on whole national economies (as in 2008 when Lehmans Bank collapsed).

It comes as no surprise therefore that strict rules surrounding the promotion and sale of financial products have been extended to cover all new media channels including social networking sites, forums, blogs and smart phone /iPhone applications.

The Evolving World

As a software developer with experience in software engineering and testing on large scale high performance websites, I've had the privilege of being involved in development processes from conception to completion and revision multiple times over. One observation remains true within each development cycle; the web is truly a very exciting place to work. The formation of this awareness changes with each project however, due to emerging technology and the fast paced environment in which we choose to live. That is..

Digital marketing has taken leaps and bounds in the past few years, with social media now dominating how people hear about your organization and share their thoughts, feelings or images with friends.

At the Arts Council England workshop delegates discovered the best way to use digital marketing for their organization, how to avoid the pitfalls and 5 handy tips on engagement, content, and analysis of campaigns.

What did the workshop cover?

• The 4 key areas on your website
• Tracking success with Google Analytics
• Tweeting and tools for Twitter
• Five top tips for digital marketing

Watch the video of the workshop (it may take a few moments to load).

Leading the workshop is Claire Bryden, who is a digital consultant and social media expert at Organic Development, with a passion for marketing in the arts.

Whether you’re a digital beginner or know your hashtags from your retweets, this workshop with provide you with useful examples, take-away tips and ways to implement examples.

P. s. Ask questions and join the coversation on twitter with Claire @ShinyShoeClaire and Organic Developement @GrowWithOrganic.