web-dev-qa-db-ja.com

レスポンシブデザイン：どのフレームワークを使用する必要がありますか？ CSS3＆HTML5

新しいプロジェクトを開始するのに適したHTML5/CSS3基礎ファイルのセットを探していました。私は自分のファイルをつなぎ合わせることから始めましたが、堅実でかなり互換性のある（私と）CSS3/HTML5フレームワークを見つけて、自分のプロセスに最適ではない特定のことを微調整する方が良いと思います。

レスポンシブで、レイアウト、タイプ（horとvertのベースライン）、フォームとインターフェイスコンポーネント、クロスブラウザの問題に焦点を当て、できれば単なるcssリセット以外の何かに基づいて構築されたものを見つけたいと思いますが、これには、ブラウザ全体で一貫した要素の再構築が含まれ、クリーンな作業状態になります。ポリフィルなどの追加機能は、優れたドキュメントや例と同様に優れています。

これまでのところ、私が知っている私の頭の上から、

  • スケルトン
  • 1140グリッド
  • 320以上（BPを含む）
  • HTML5 Boilerplate 2.0およびモバイル
  • Inuit.css
  • 少ないフレームワーク
  • フルール
  • パーキンス
  • いくつかのWPテーマ

私が知らない素晴らしいものはありますか？私はWPで多くの仕事をしていますが、簡単に組み込むことができます（ただし、スタンドアロンでもあります）。必要なときにそれを削減する能力を維持しながらプラグインとワイドセット機能（柔軟性）も大きなプラスであり、すぐに見つけたものを使い始めたいので、より速い学習と同等です。

あなたが推薦できるかもしれないより良いオプションのいくつかは何ですか？システムまたはスクリプト、プラグイン、その他の関連ツールも歓迎します、ありがとう！

html5css3css-framework
7
Jayhal

'Less'フレームワークの作成者であるJoni Korpiは、彼の 'Golden Grid System' をリリースしました。これは、伸縮性のある溝とズーム可能なベースライングリッドで有名な適応型フレームワークです。

ただし、それ以上に人気のあるものについて言及しました。ニーズに合わない場合は、独自のフレームワークの構築を検討するのが賢明です。私がお勧めする2冊の本が役立ちます：

独自のフレームワーク（または開始テンプレート）を構築する際には、多くのことを学び、特定の好みや要件を満たすものになります。フレームワークは素晴らしいものですが、多くの場合、ニーズに合わせて多くの変更を加えることになります。単にゼロから始めてみませんか？

5
Nick

Twitter Bootstrapは、 http://Twitter.github.com/bootstrap/ から構築するのに最適なフレームワークです。念頭に置いておくべき1つのことは、構築する予定のものです。 wordpressがアプリで探している機能の大部分を処理できる場合は、WPテンプレートを調べる必要があります。

バックエンドの何かからアプリをゼロから構築している場合、Twitter bootstrapおよびあなたがリストした他のいくつかは良いでしょう。 wordpressをフロントエンドとして使用してサイトのコンテンツを管理していますが、バックエンドはjquery uiを使用したzendフレームワークです（bootstrap次のコミットに移動）。

3
Anagio

先週、あなたが言及した人たちと仕事をしました。また、TwitterのBootstrap、HTML5 Boilerplate Mobile、ZURBのFoundationも試しました。それらはすべて肥大化していて、私が本当に望んでいたもの以上のものでした。

私はGithubで私に興味を持っているすべての人々の分岐したプロジェクトを探し始めました。それから、私は自分自身のために何かを構築するために、上記のすべての「フレームワーク」からより良い部分を取りました。 Meyers Resetの代わりにNormalize.cssになりました。 Preboot.less bootstrapには、多くの.LESSミックスインが含まれています。 Twitter Bootstrapの一部のコンポーネント。そして、それらすべてをSemantic.gsのレスポンシブな.LESS 960にインスパイアされたフレームワークに入れます。

私は幸せになることができませんでした！

最良の部分は、すべてのファイル内のコードのすべての単一行を知っていることであり、実際には残りに比べて非常に小さいです。

そのようなことをした方がいいかもしれません。私も「車輪の再発明」という考えに反対でした。しかし、私は本当に自分のものを呼び出すものが欲しかった。

2
OrganizedFellow

私はしばらくの間960gsを使用していましたが、かなり慣れてきました。私は寸法が好きで、優れたレイアウトをすばやく簡単に作成できます。

すべての新しいデバイスで、960gsはすべてのデバイスに常に適合するとは限らないため、私にとって少し時代遅れになりました。また、私はJavaScriptを使用してブラウザをスニッフィングし、CSSをロードすることも好きではありませんでした。

レスポンシブウェスバイトは、さまざまなデバイスの問題を解決するための優れたエレガントなソリューションです。私は960gsの使用に慣れていたので、似たようなものを探しましたが、Skeleton frameworkが私の勝者として判明しました。 960システムにレスポンシブレイヤーを追加するだけです。

私が気に入っていることの1つは、4つの固定された記述があるという事実です。一部のフレームワークでは、ブラウザーのサイズが変更されるたびにレイアウトが変更されます。スケルトンフレームワークは、4つの状態にのみスナップします。

市長のマイナス面の1つは、ピンチズームがフレームワークで機能しないことです。画面のサイズを変更しますが、layourは同じままです。

1
Saif Bechan