Fronteers 2011 – Divya Manian “The New Developer Workflow”

From Opera Divya Manian (@divya) showed us how we can change our web-development workflow to better cope with new browser, html an css features.

The web used to be simple: HTML + CSS and the hardest problem was choosing what element to use
In 2011 the web consists of so many parts, choosing the right element has become the least of our problems
Our workflow still consists of: cutting up a PSD, test in current browsers, deliver to client
Webdesign with all it’s facets can’t be captured in just PSD anymore
Proper workflow allows us to abstract us from trivial tasks andn allows us to focus on what matters

The 2012 workflow

Learn about them and use them. Not just debuggers for css/js but also emulators/simulators, remote debuggers and documentation.

See what (browser)features we can use and deliberately make design-choices based upon their availability
Use polyfills for functionality thas is essential for the core experience of your website
Always use all vendor-prefixes if they are necessary. Know the css vendor-prefix lifecycle (See Divya’s slide on vendor-prefix lifecycle) and drop them if they aren’t necessary anymore
Drop vendor-prefixes for: box-shadow, border-radius, background-clip

They make coding a lot easier with features like auto-spriting and mathematical calculations
Incorporated in a build-script they make deployment of your assets to production very simple

Learn to love the specs, learn them by heart and make it part of your work
If you’re proficient in the specs, submit bugs to browser vendors and participate in the working-group discussions

Divya’s sheets from her presentation can be found here: http://nimbu.in/fronteers/#intro