How we could improve markup in our project

https://gist.github.com/dmons/847fd0a35afdee9b3ccf

Current Issues

Lots of inline CSS

Lots of code duplication

Lots of unnecessary nested elements

Lots of absolute position elements

Wrong approach of CSS class nesting

Lots of data-url images

Negative outcomes from current approach

No possibility to quick switch to responsive design

Hard to maintain

Need more time to create new pages

Issue details

Lots of inline CSS

Inline CSS

Scope classes in CSS and lets use SASS

Convert to HAML

Optimize code

Removed unnecessary nested elements

No need in absolute positions for link and container

No need to use image tag for logo and index it in google

Data-url images

Longer time for browsers css parsing and big file

Incomplete support in IE8 (data: URIs must not be larger than 32 kilobytes there)

Possible solution sprites with compass gem

Arguments for Bootstrap

Semantic class names .active, .warning, .important, .info and .alert

Compositional classes

Grid systemFixed and fluid layouts, 12 columns grid

Responsive utilities

Typography

Etc.

Wide community and lots of extensions

Click to edit the title text format

Click to edit the outline text formatSecond Outline LevelThird Outline LevelFourth Outline LevelFifth Outline LevelSixth Outline LevelSeventh Outline Level