Cntlog > スキルアップ・ノウハウ > コーディング > Sassの人気に嫉妬!でもLESSにだっていいとこあるんだよ

Sassの人気に嫉妬!でもLESSにだっていいとこあるんだよ

最近「Web制作者のためのSassの教科書 これからのWebデザインの現場で必須のCSSメタ言語 」という本が出版されてSassがさらに注目されていますね。
個人的にはいよいよSass一択になってLESSが淘汰されていっちゃうのかなと心配しています。

そもそもLESSって何?って方もいるでしょうが、Sass同様CSSプリプロセッサの一つです。
私はLESSを使っており、LESSにもいいところはあるのでそれをご紹介したいです。
※別にSassディスるつもりは微塵もないです。

導入が楽

正直LESSがSassに優っていると思えるところはここしかないかも。

Sassを使い始めるにあたって最初の壁になるのは開発環境の作成と聞ききます。
かくいう私もRubyをインストールしなきゃいけないと聞いて逃げ出した経験の持ち主です。
しかしLESSはJSで動かす事ができますのですぐに開発環境を整える事ができます。
他にも優秀なGUIツールがあるのでアプリをインストールするだけで.lessファイルから.cssファイルを作ってくれる使い方もあります。
※私はこのコンパイルするやり方をしてます。ツールは「WinLess」を使ってます(Windows専用)

人に薦めやすい

導入がしやすければ、人にも薦めやすく使い始めてくれる人も多いです。

使い方等はドットインストールですぐに覚える事が可能です。
CSSプリプロセッサを使うにあたって一番の壁は「チームみんなが使えないといけない」ところにあるのでこのポイントは大きいです。
LESSを人に勧めると「だってこれからはSassでしょ」という人もいますが、CSSプリプロセッサをどれか使い始めないよりは遥かにマシです。

LESSも基本的な考え方はSassと違いはないので慣れておけばいつでもSassに移行できると伝えれば問題ないでしょう。

見本となるフレームワークがある

フレームワークを語るにあたって外せない「Bootstrap」が対応しているのは個人的にはオススメのポイントです。
そもそも私がLESSを使い始めた理由がコレ。
Bootstrapを使い始めたらLESSを覚えたのが歴史です。つまり私のLESS歴はBootstrapの愛でできています。
余談ですがBootstrapに慣れているとプログラマと仲良くなれますよ。

BootstrapはLESSの良い見本でMixinなど設定ファイルが綺麗にかかれていますのでLESSに慣れるのにも最適です。
LESSの設計の仕方もBootstrapで学びましたので、CSSプリプロセッサ使う方は見ても損はないでしょう。

まとめ

CSSプリプロセッサを使うか迷ってる人は取りあえずLESSを使ってみてはいかがでしょう。
便利さがすぐさま実感できるかと思います。
学習コストに見合ったメリットはあるはずです。
Sassを使うのはそれからでも遅くないんじゃないですかね。

関連記事

Bootstapのグリッドでcolumn崩れが起きるときの対処法... Bootstrap3でグリッドを使っているとしばしば、カラム落ちしてレイアウト崩れをおこしている状態を見かけます。 今回はその対処方を紹介します。 対処方法 Flexboxを使う gridの.rowにFlexboxを当てれば解決します。 CSS ....
【サンプル有】日本語WebFont 一歩前進! Google Fonts 日本語早期アクセスのページ... Googleが提供しているWeb FontでとうとうGoogle Fontsの日本語早期アクセスのページが公開されましたね。 これまで日本語WebFontといえばNotoFontが有名でしたが今回の8つのフォントが追加されました。 簡単にですが公開されたフォントを紹介します。 ...
スマートフォンサイトを作るときによく使うhead内のタグ... スマートフォンサイトを作るにあたってよく使うmetaタグなどheadで使う要素をまとめてみました。 スマホサイトを作り慣れていない人の参考になれば嬉しいです。 目次 viewport ...
Webデザイナーが効率よくHTMLコーディングができるPugのメリット... 2014年頃からPug(当時はjade)を使ってHTMLのコーディングを進めてました。 最初はこんな書き方もできたほうが良いのかなくらいで考えていたのですが、最近ではPugがないほうがしんどい状態になってきました。 保守が苦手だったり、修正時にミスが多い人はPugを使うことでコーディングの質...
このフレームワークに惚れたらレスポンシブデザインについて色々考えちゃいました... 先日フレームワークのResponsive Grid Systemが大幅に変更されたと知って興味があって調べてみました。 Responsive Grid Systemとはグリッドシステムを使うためのフレームワークで、レスポンシブデザインでも使用できるような設計をされているものです。 確認し...
コーディングのお供に!CSSの更新を自動で反映させてくれる便利なブックマークレート... 最近コーディングで便利なブックマークレートを見つけましたのでご紹介します。 CSSrefresh このブックマークレートは表示しているページで使われているCSSファイルの更新を自動的に確認してブラウザに反映させてくれるというものです。 コーデ...