When you’re playing around with code, there’s nothing quite like doing it in a browser based sandbox.
If you’ve used JSFiddle, you may want to give Tinkerbin a try.
Tinkerbin is the same, except it also supports Sass (with Compass), Less, Haml and CoffeeScript.
It looks good and is easy to use.
When you’re dealing with HTML and CSS, you’ll notice that while HTML has a standard format and syntax, CSS is like the wild wild west. There are many different ways of organizing your code: Single line, multi-line, order – it doesn’t matter much.
Harry Roberts wrote a helpful guide for Smashing Magazine on Writing CSS For Others, and although the tips are focused on writing CSS that’s easy to read by other developers and team members, there’s a lot that can be learned here for “Lone Rangers.”
If you’ve ever gone back to make an edit in your own CSS markup on a project that you haven’t looked at for some time, you can easily get lost in your own code.
Here are a few great tips to help make your own code more manageable.
A handy way to develop websites and debug them is to have live CSS editing. Add the code, get the result. It can also be a fast way to create prototypes, and even play around with code on someone else’s work to learn new techniques (or simply goof-around and play jokes on others).
With CSS Terminal, you can do this with a simple click of a bookmarklet!
This week, I’ve been doing some website re-tooling.
I’m converting my WordPress site from a self-built theme to a fully awesome and optimized Standard Theme without changing my overall design. Of course, I am making some minor changes here and there with things I didn’t like or could be better. Some changes you can’t even see the difference, but if you looked under the hood, the change is huge.
Take for instance, my rounded corners on each page and blog post. Standard Theme already had them baked in, so switching from an inferior method of using graphic files to create rounded corners, all I had to do was tweak the CSS. This significantly speeds up the page load time, and you can’t even see the difference:
A little over a year ago, Tom introduced us to a piece of JavaScript that really can streamline your CSS and make it more dynamic.
At the time, it hadn’t been officially released and was only available from the GitHub. It has since been released and may be the perfect thing to begin implementing into your projects.
LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the client-side (IE 6+, Webkit, Firefox) and server-side, with Node.js.
Take a look:
You can now build a mobile, multiplatform app using HTML5, CSS3 and JavaScript!
PhoneGap is the only open source mobile framework that supports six platforms.
This is awesome.
With all decent browsers now being able to use some of the funky new features of CSS3 (so basically all browsers except IE6-8) we can start using rounded corners, box shadows and linear gradients.
We might be ok with letting IE8 (and lower) users just have a slightly less pretty version of the site. However, if you want to give IE uses the full lovely experience, then CSS PIE comes to the rescue!
The concept is simple, the result is brilliant.
Just include Live.js and it will monitor the current page including local CSS and Javascript by sending consecutive HEAD requests to the server. Changes to CSS will be applied dynamically and HTML or Javascript changes will reload the page.
Sweet.
CSS3 is here and we all want to dive-in and start using it, but no browser supports it all, yet.
So, what can you start using, right now?
Here are five great CSS3 features you can start using in your websites – RIGHT NOW!
Continue Reading…
See all of the awesomeness that HTML5 and CSS3 bring to your browser.
This site is a resource and showcase of some of the newest, and most expressive features being added to the web today.
Mostly, it’s fun 
Copyright 2013 · ChurchMag
