正直しんどいコーディングを快適に〈フレームワーク〉

CSSフレームワーク

Bootstrapや、Foundation/Pure/など色々な「フレームワーク」が配布されています。
CSSフレームワークは、コーディングの際に、簡略化するという「フレームワーク」です。
CSSフレームワークは、ビジュアルに関する事前定義が指定されています。

いくつかボックスのパターンが定義されています。

cssで作成されたボタンのパターンが多くあり、フリーでダウンロードできます!!

Buttons
サイト詳細はこちらから「http://unicorn-ui.com/buttons/builder/」

では実際に配布されている「フレームワーク」のご紹介をしていきます!!

「BootstrapはレスポンシブかつモバイルファーストなWebプロジェクトのための、
一番人気のHTML、CSS、JavaScriptフレームワークです」

Bootstrapサイト詳細はこちらから「https://getbootstrap.com/」

世界でもっとも進んだフロントエンドのレスポンシブフレームワークです。

Foundationサイト詳細はこちらから「https://foundation.zurb.com/」

開発者：ZURB
リリース：2011年
現行バージョン：6.3.1
人気度：GitHubスター254,000個
コンセプト・原則：RWD、モバイルファースト、セマンティック
サイズ：197.5KB
プリプロセッサー：Sass
レスポンシブデザイン：あり
モジュール化：あり
初期テンプレート：あり
アイコンセット：Foundation Icon Fonts
拡張・アドオン：あり
特徴的なコンポーネント：Icon Bar、Clearing Lightbox、Flex Video、Keystrokes、Joyride、Pricing Tables
ドキュメント類：良好。公式以外の参考リソースも多数あり
カスタマイズ：Bootstrapのものに似た基本的なGUIカスタムツール
ブラウザー対応：Chrome、Firefox、Safari、IE9以上、iOS、Android、 Windows Phone 7以上
ライセンス形態：MIT

自然言語の法則にもとづいたUIコンポーネントフレームワーク

Semantic UIサイト詳細はこちらから「https://semantic-ui.com/」

開発者：Jack Lukic
リリース：2013年
現行バージョン：2.2
人気度：GitHubスター34,762個
コンセプト・原則：セマンティック、使用するHTMLタグの自由さ、レスポンシブ
サイズ：806KB
プリプロセッサー：Less
レスポンシブデザイン：あり
モジュール化：あり
初期テンプレート：あり、基本的なものは提供
アイコンセット：Font Awesome
拡張・アドオン：なし
特徴的なコンポーネント：Divider、Flag、Rail、Reveal、Step、Advertisement、Card、Feed、Item、Statistic、Dimmer、Rating, Shape
ドキュメント類：非常に良い。整理された公式ドキュメントに加え、専用Webサイトで開始の手引き、カスタマイズ、テーマの作成を解説している
カスタマイズ：GUIカスタムツールなし、自力で変更するのみ
ブラウザー対応：Firefox、Chrome、Safari、IE10以上（IE9はプレフィックスが必要）、Android 4以上、Blackberry 10
ライセンス形態：MIT