さて、今日は EPoch IT 事業部がよく使う、
CSS フレームワークをご紹介します。
CSS フレームワークを使うことで、
ブラウザごとの差異を吸収したり、
開発の初期工数を大幅に削減したりすることが出来ます。
それでは早速紹介してまいりましょう。
Bootstrap
世界でも最も広汎的に利用されている CSS フレームワークのひとつです。
モダンでフラットな CSS が利用でき、コンポーネントやグリッドも使いやすく、
汎用性に優れています。
Javascript を必要としますが、
レスポンシブに対応したナビゲーションなどが用意されております。
Kraken
軽量で導入しやすい CSS フレームワークです。
Wordpress に対応したバージョンや、
最適化された HTML のテンプレートなども用意されています。
Semantic UI
サイドから飛び出すメニューがステキですが、
CSS のフォントサイズの指定に rem が使用されているため、
対応ブラウザに注意する必要があります。
フラットではありますが、陰影の綺麗なコンポーネントが多く、
要素に彩りの幅を持たせることが出来ます。
Pure
とても軽量で 4.4 kB ぐらいしかありません。(執筆時点)
また、自分が使いたいコンポーネントの CSS だけを
読み込むことも出来るようになっています。
開発元が Yahoo! なので信頼性もありますし、
Javascript も必要ありません。
Materialize
他の CSS フレームワークではあまりサポートされていない、
Flow Text という機能があります。
PC のモニタとスマホの画面では、
最適なテキストサイズも異なります。
画面幅に合わせて font-size もレスポンシブになります。
コンポーネントはあまり多くありませんが、
フォーム要素はカッコいいです。
※ 各機能の説明は、執筆時点のもので、最新版の仕様は本記事の内容と異なる場合があります。
さて、ここに紹介した以外にも様々な CSS フレームワークが存在します。
本当に沢山のフレームワークがありますので、
それぞれの設計思想や構成を理解して
使い分けられるほどに深く知るのは難しいと思います。
まずは、お気に入りの CSS フレームワークを
見つけてみるのがいいのではないでしょうか。
