CSS is the New C - Sass is the Future

Wed 08 July 2009 · tools · Tags:

So the other day I started to look for tools that let me use variables in CSS. This mainly was because it really gets old to copy paste the same colors over and over again. Thanks to Twitter soon I was pointed in the direction of LESS.

After playing around with LESS a bit I came to the conclusion that it was nice and allowed for variables and a shortened syntax but overall didn't offer enough flexibility.

Played with some more tools and finally tried Sass. And to spoil the surprise: In my humble opinion that thing is the future of CSS. It allows to use variables, mixins (which can work a bit like functions), imports and uses a syntax that reminds me of Python (which always is a major factor) and saves heaps of unnecessary typing work.

The only gripe I had with it was that it didn't allow for a --watch parameter that takes care of always recompiling my CSS files when the SASS source changes. But that was quickly taken care of by using Compass which sees itself as a kind of meta-framework.

Really liking the idea I dumped my 960gs CSS files and replaced them with the 960gs Compass plugin. This really impacted my site big time - but not in a positive way. After kicking out the 960gs plugin again and reinstalling my old official CSS files all was back to normal.

Closing thoughts: We have frameworks for everything in web development today, so why not have a real one for CSS, too? I mean just think about how much CSS we write all the time - all the same stuff over and over again. And thanks to the syntax of CSS most of what we write could be put into a library and reused. That's where Sass and Compass come into play. Though Compass might not Just Work™ its approach is definitely right and should be watched closely.

Want to talk about it?

Photo of Christian Kaula

I make stuff simple.
Code, interfaces, things.
You can hire me.

Christian Kaula · Thieraufstrasse 2 · 95028 Hof · Germany
Twitter · Xing · GitHub · BitBucket · Django People · Djangogigs
· Mobile +49 179 9709833
http://christiankaula.com

Archive

  1. RESTful Web Applications: Code Less, Do More

  2. How to Handle Database Views in Django/South

  3. Entrepreneurship Summit 2011 Thoughts

  4. Improving Copy: EntryDNS

    misc · Tags:
  5. How to Come Up With a Good Product Idea (As a Coder)

    misc · Tags:
  6. Siri is from the Future

    interfaces · Tags:
  7. How to Make a Better Analog Watch

    interfaces · Tags:
  8. Where to Not Put Django Templates

    code · Tags:
  9. Camila-overload.de

  10. Studi-tools.de

  11. On CSS Structure

    code · Tags:
  12. My Take on Indention

  13. Why Web Development is Done in PHP or Java

    misc · Tags:
  14. Yay for Lanyon

    misc · Tags:
  15. Why My Mac Made My Sansa Clip+ Hang

    misc · Tags:
  16. Python: Decorate a Method That Gets Passed the Class Instance

    code · Tags:
  17. Django Template Tag to Shorten URLs Like Google

    code · Tags:
  18. Studi-tools.de is Online

  19. Nice to Know About Virtualenvwrapper

  20. Having been at Tschitschereengreen

    misc · Tags:
  21. A Howto on Django Syndication

  22. The Difference Between Work and Play

    tools · Tags:
  23. Nginx is Even Better Than I Thought

    misc · Tags:
  24. Clear Up Gelato CMS' Gibberish

    code · Tags:
  25. Don't Listen to the Idiot

    misc · Tags:
  26. Snow Leopards' Bad Sides

    misc · Tags:
  27. Make Django Send Mails to Admins Only

    code · Tags:
  28. How to Fix Portage

    code · Tags:
  29. Archive Twitter Stuff With Python

    code · Tags:
  30. Wee Free Icons

    tools · Tags:
  31. The Problem With Django, Nginx and FCGI

    misc · Tags:
  32. New Design

    misc · Tags:
  33. Pink Ponies for Everybody!

  34. Whoosh Makes the Haystack

  35. Selenium is Pretty Neat

  36. OpenID for Free

    tools · Tags:
  37. Multi-Object-Edit With Django FormSets

    code · Tags:
  38. CSS is the New C - Sass is the Future

  39. Where Asimov was Right

    misc · Tags:
  40. The Webdesigners Arch Fiend: IE6

  41. Die Cache, Die

    code · Tags:
  42. What if Twitter Stopped to be Tomorrow?

    misc · Tags:
  43. Django Performance Tuning - Speed Up!

  44. Django Members That are in Fact Raw SQL

    code · Tags:
  45. What to Do if You Have to 'Make All Strings Editable'

    code · Tags:
  46. Twitter is Even Worse Than I Thought

    misc · Tags:
  47. A Little Birdy Told Me…

    misc · Tags:
  48. With Django Debug Toolbar You Can Debug Django… Duh

  49. Lackeying Some Trading Card Fun?

    tools · Tags:
  50. By the Power of CSS… I Revisit You

  51. Jabberbot is Coming

  52. MacS are Like Tools

    misc · Tags:
  53. Jabber With Me Over XMPP

    projects · Tags:
  54. By the Power of CSS…

  55. Why I Barely Ever Read Comments

    misc · Tags:
  56. Internet Explorer 6 on Mac - Actually Easier Than IE on Windows

  57. Bash and the Secret of the Lost Folders

    misc · Tags:
  58. MAME on Mac - Already Like the Sound

    misc · Tags:
  59. Python - Strings Very Much Attached

    code · Tags:
  60. Fun With Forms in Django

    code · Tags:
  61. Subversion: Ignore More

    code · Tags:
  62. It's Time for Python Dateutils

    tools · Tags:
  63. That is Why Developers Aren't Called Testers

  64. Now With Legacy Tag-URLs

    misc · Tags:
  65. Html Validator - Valid HTML - Profit

  66. More Fun With Tracebacks

    tools · Tags:
  67. jQuery That Python

  68. Django Can be Too Convenient

  69. Long Live the South

    code · Tags:
  70. Get Windows for Free (For Internet Explorer Testing on Mac)

  71. Viva! Vista! Worms Armageddon!

    misc · Tags:
  72. Fun With Python Stracktraces

    tools · Tags:
  73. So Sweet the Crons - Sweetcron

    tools · Tags:
  74. News From the South

    code · Tags:
  75. VoodooPad - Its a Wiki on Your Desktop

    tools · Tags:
  76. Heeyoo, SEO

    misc · Tags:
  77. Take a Note on the Side With Sidenote

    tools · Tags:
  78. Piwik Even Sounds Cooler Than Google Analytics

  79. Pixen, Pixel… Editor

    tools · Tags:
  80. Long Hard Road Out of Hell

    misc · Tags:
  81. Suspicious SuspiciousOperation Exceptions

    code · Tags:
  82. Apple Mail AKA Hides-Best-Things

    misc · Tags:
  83. Don't Bring Me Down…

  84. Me and the Boys

    misc · Tags:
  85. I Have a Dream

    misc · Tags:
  86. Compress This Mess

  87. Ack, Knowledged

    tools · Tags:
  88. Plug in TextMate

    tools · Tags:
  89. Put Into Grand Perspective

  90. Code-A-Robot

    misc · Tags:
  91. Sub Fine Mecum Nemo Non Consentiet

    misc · Tags:
  92. DNS - the DNA of the Web

    misc · Tags:
  93. Open a Can of Worms

    misc · Tags:
  94. You Don't Print the Web Do You?

    misc · Tags:
  95. Postgres on Mac Revisted

  96. What the Heck is a KeePass?

    tools · Tags:
  97. Saving and Its Massive Effects

    misc · Tags:
  98. I'm Too Cheap for .Mac

    tools · Tags:
  99. You Can Even Calibrate Batteries These Days

    misc · Tags:
  100. Don't Mind Me - Just Passing Through

    misc · Tags:
  101. Virtual Python Revisited

  102. Going South

    code · Tags:
  103. These Windows Aren't Clear at All

    misc · Tags:
  104. Database Switcheroo

  105. Django? Isn't That Something Like Rails?

    misc · Tags:
  106. Magical Ponies

    misc · Tags:
  107. Yay for Automatic Deployment

    misc · Tags:
  108. A Quick Comparison of JavaScript Frameworks

  109. Apples and Pears

    misc · Tags:
  110. What I Forgot to Mention…

    misc · Tags:
  111. Good Friends

  112. Me vs Virtualenv

    misc · Tags:
  113. Where to Buy Apples Cheap

    misc · Tags:
  114. First Post!

    misc · Tags:
  115. MacGre

    misc · Tags: