CSSのみとSass/SCSS、Lessに対応したレイアウト系CSSフレームワークについて調べて表にしてみた | DevelopersIO
みなさまこんにちわ。 Webサイト高速化やSCSSの連載を書いている野中です。 そういえばGoogle Readerが終了するとのことでとても残念ですね。 読者のみなさまも次の引っ越し先ツール探しで忙しいところだと思います。 そこで、クラスメソッド開発ブログのRSSも忘れずに登録をお願いします。 とても更新頻度の高いブログということもあり、いろいろな切り口のRSSを用意しています。 本題 それでは本題ですが、レイアウト系のCSSフレームワークって色々ありますよね。 個人的にはHTML上のクラスにあまり意味のない文字列は入れたくないので使っていませんでした。HTMLも編集しなければならないので。 ふとSass/SCSSでExtendしたりMixinsで制御できるものであれば無駄なクラス指定を減らして可変でレスポンシブなグリッド制御ができるんじゃないか思って探してみたら色々とありました。 最初
Webアプリケーション開発に使えるJavaScriptフレームワーク·ComponentJS MOONGIFT
ComponentJSはWebアプリケーション開発用のMVC対応JavaScriptフレームワークです。 ここ数年JavaScriptのフレームワークが幾つも登場していますが、今回紹介するのはComponentJS、HTML5のリッチWebアプリケーション開発用のJavaScriptフレームワークです。 デモのログイン機能。 ビジュアルデバッガーが売りの一つです。 ComponentJSは階層化されたコンポーネント、MVC、イベント駆動型、状態管理などが特徴になっています。他のライブラリへの依存がなく、jQuery UIやSencha Touchなどとも連携できます。さらにビジュアルデバッガーという強力なライブラリが提供されています。 ComponentJSはJavaScript製、Mozilla Public Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る
HTML5/CSS3を使った多機能デザインフレームワーク·HTML KickStart MOONGIFT
HTML KickStartはBootstrapライクなデザインテンプレートフレームワークです。 最近ではWebサイトのベースにBootstrapを利用することが多いのですが、今回はその類似ソフトウェアとしてHTML KickStartを紹介します。こちらもかなり高機能です。 Typography。 リストとメニュー。 メニューは階層対応。 テーブル。 ツールチップ。上下左右自在です。 アイコン。 プログラミングコード。 ボタン。 タブ。 パン屑。 グリッド。 画像。 スライドショー。 動画、地図、カレンダー。 フォーム。 入力フィールドのサイズ。 その他色々。 極力シンプルなHTML構造設計、jQuery利用、HTML5、モーダルウィンドウなどが特徴に挙がっています。唯一残念なのは現状はレスポンシブWebデザインでないことかも知れません。しかし全てのデバイスへの対応を考えないならむしろ手
多彩なデバイスに対応したWebサイト構築に最適なデザインフレームワーク·Centurion MOONGIFT
CenturionはレスポンシブWebデザインに対応したCSSフレームワークです。 レスポンシブなWebサイトを構築するためには様々なデバイスでの表示を考慮したり、そのためのノウハウが必要になります。そこでベースとして取り入れてみたいのがCenturionです。 デスクトップでの表示です。 スマートフォンレベルまで幅を狭めた場合。 メニューはスライドして表示されます。 タブレットはこれくらい。 グリッドもあります。 Centurionはシンプルなフレームワークなので、それほど束縛は強くないと思います。カスタマイズ性も考慮されているとのことなので、Centurionをベースにしつつ独自の要素を盛り込んでWebサイトを構築できるでしょう。 CenturionはHTML5製のオープンソース・ソフトウェア（GPL/MIT License）です。 MOONGIFTはこう見る Bootstrapは個人
レスポンシブWebデザインでサイトを組む際のベースに·Wirefy MOONGIFT
WirefyはレスポンシブWebデザインを使う場合のデザインフレームワークです。 レスポンシブWebデザインで組み上げようと思うと、色々とあらかじめ考えておくべき点に出くわしてなかなか本当にやりたいデザイン作業に入れずにイライラしたりするかも知れません。そこで使ってみたいのがデザインフレームワークのWirefyです。 サンプルです。 iPhoneで見た場合。レスポンシブWebデザイン対応です。 メニューを表示した表示。 Wirefyではコンテンツファーストの原則に則って開発されています。そのため基本的なタグだけでデザインが組み上がるように考えられています。さらにWirefyをベースにすればレスポンシブWebデザインになっています。手早いワイヤーフレーム作成の際にはきっと役立つでしょう。 WirefyはHTML/スタイルシート製のオープンソース・ソフトウェア（Apache License 2
[CSS]高性能すぎてビックリしました、レスポンシブデザイン用の超軽量フレームワーク -Kube Framework
[CSS]高性能すぎてビックリしました、レスポンシブデザイン用の超軽量フレームワーク -Kube Framework
Tumblrのオリジナルテーマ作成用フレームワーク・tumblr-framework
Tumblrでオリジナルのテーマを自作 するためのフレームワーク・tumblr -frameworkのご紹介です。日本でも 企業が公式ブログ等にTumblrを使い 始めていますのでこういったフレー ムワークも確保しておくと良さそう。 女優の水野美紀さんや楽天、NISSANのキャンペーンサイトなどなど企業や著名人でも徐々に利用し始められてきたTumblrですが、テンプレートは独自の記法を用いて作成する必要が有ります。 この独自記法が予め書かれているフレームワークがtumblr-frameworkです。 Tumblrのオリジナルテーマを作成するためのフレームワーク。 以下のような、よく使われるタグや条件分岐タグなどが一通り備わっています。 <h1 title="{Title}"><a href="/">{Title}</a></h1> {block:Description} <p class=
スマートフォン向けのHTML5製フレームワーク・Lungo.js
今更ですけどLungo.jsを少し触って 見ました。Lungo.jsはHTML5+CSS3の スマートフォン向けフレームワーク です。jQueryやmootoolsなどを必要 としない非依存型のライブラリです ので覚えておいて損は無いかも。 スマフォ向けフレームワークです。GPLv3ライセンスでOSSとして公開されています。 スマフォ向けのフレームワークは相当出回っていますので珍しくないかもですけど・・触った感じはなかなか使いやすそうでした。コアファイルは非圧縮で40kbほど。 以下、公式サイトのサンプルです。 Sample スターターキット的にも使えそうです。 ↑ 実機でのスクリーンショット この手のは沢山あるので好みで選べばいいですね。詳細は以下でどうぞ。 Lungo.js
作ろう！HTML5用Webアプリケーションフレームワーク·Brunch MOONGIFT
BrunchはHTML5によるWebアプリケーション開発を支援するnode.jsフレームワークです。 HTML5をビジネス向けに率先して使っていくのは難しいと思いますが、それでも試してみたいと考えている人は多いはずです。そこでBrunchを活用してみると良いでしょう。HTML5ベースのWebアプリケーションを開発するための仕組みをまとめて提供してくれます。 Twitterのデモアプリです。 Todoアプリのデモです。 コードの記述に際してはJavaScript/CoffeeScript/IcedCoffeeScript/Royが使えます。CSSはSassやLESSを使うこともできます。ベースを作ってくれるコマンドがあるので、それを使いつつ後は既存のデモアプリを参考に作っていくとWebアプリケーションを素早く作ることができます。 Brunchはnode.js/JavaScript製、MIT
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
