web-dev-qa-db-ja.com

エンタープライズWebアプリにCSSフレームワーク(またはUIフレームワーク)を推奨できますか?

具体的には、ビジネスアプリケーションを提供しようとするCSSフレームワークはありますか?

MooToolsに基づいたMocha UIを見てきました。正直なところ、JavascriptとMoo(またはjQuery/jQuery UI)を扱うことは避けたいと思います。単純なWebアプリに必要なもののほとんどは、JavaScriptの修正なしでCSSで処理できると信じがちです。

洗練されたCSSの多くは、ビジネスアプリのUIニーズとは異なるブログやWeb公開のニーズを対象としています。これはsomeoneが解決した問題であるに違いないようですが、解決策が見つからないようです。

私の希望は、提案されたソリューションが言語に依存しないことです(PHP、ASP、CFなどで動作します)。ただし、UIを非常に「完成した」意味で処理する言語に根ざしたフレームワークがある場合は、特定のサーバーの使用を強制するフレームワークを採用することを意味していても、それを見てみたいと思います。サイドランゲージ。

私の目標はMVCに行くことではなく、アプリケーションに合う素敵なCSSを用意することです。

BOUNTY:CSSのいくつかの有用な「出発点」(最小限に述べられている)が連動しているに違いないと思うので、この質問に対して賞金を開始することにしました。私の好みでは、ウェブアプリに向かっています。

  1. プラットフォームに依存しない、またはさまざまな開発プラットフォームに対応している
  2. 無料またはほぼ無料(たとえば、コントロールのコレクションで1000ドルではない)

"Inspirational"例:(意図的な言葉で遊ぶ、ごめんなさい) Design Patterns LibraryとCode Standards これは非常に魅力的ですが、サービスとしてソフトウェアを使用して教会のサイトを開発する人(?)だけが使用できるようです。とにかく、CSSと補完的なグラフィックスは、一般消費者向けにはありません。

7
Chris Adragna

以前の(Chris LivelyとLèsemajestè)の回答に同意します。また、あなたが提供するリンクがとてもクールだとわかりました。

しかし、私の答えに行きましょう。自分のやり方で作るべきだと思います。使用できるリソースは多数あります。私は私を引用します。

独自のフレームワークとジェネレーターを開発している間に、UIフレームワークが必要であることが明らかになり、HTMLテンプレートのすべてのクラスとIDが自動的に生成されました。

次に、使用した共通パターンを調べた後、独自のCSS UIユーティリティ(およびいくつかのJSユーティリティ)を作成しました。私のアプローチの重要なポイントは、多くの異なるクラスを使用することです。

.required、.relaxed、.warning、.error、.success、.roundedBox、.gradient、.white70 [rgba(255,255,255,0.7)] 、. black30、.paddedは、いくつかの例です。

hTML側:

また、960グリッドを超えて実装されており、@ font-faceキットのような他の多くのユーティリティがあります。実際、これはほんの少しの作業で私を導きます。正しいクラスを追加し、おそらくプロジェクトごとに若干の調整を行います。

複数のクラスに加えて、もう1つの中核となるポイントは、すべてが黒白グレーのスキーマにバインドされ、不透明度が機能するようにすることです。これは、各プロジェクトに必要なコード変更を減らすためです。したがって、通常、各プロジェクトには独自のカラースキーマがあります。

3
Dave

びっくりしましたが、今まで誰も blueprint を提案していませんでした。まあ!これは単なるCSSフレームワークであり、設計作業を軽減できます。


[2013年10月]

今では Foundation および Bootstarp フレームワークはWeb開発のためにアイドル状態です。レスポンシブWebページを設計できます。

3

問題は、「完成した」とは人によって異なることを意味するということです。

入力要素がフォーカスを受けた後、入力要素の周りに素敵な小さな境界線をフェードインさせたいかもしれません。すべての段落要素に4ピクセルのマージンを持たせたい場合があります。または、すべてのボタンに光沢感のある青いテキストが含まれるようにすることもできます。

おわかりのように、単一のソリューションはありません。それはすべてデザインと趣味の問題であり、誰にとっても決して同じではなく、進化し続けます。 Web 2.0により、フォントが大きくなり、入力するボックスが大きくなり、ドロップダウンメニューがネストされなくなりました(ありがたいことに)。 UIオタクが「3.0」で何を計算するかを誰が知っているか...それが何であれ、2.0のものが90年代のサイトのものと同じくらい根本的に異なることを願っています。

WPF、Flash、Silverlightなどの特定のテクノロジーは、一部はサイトにまったく異なる雰囲気を与えるために存在します。しかし、再び、これらはあなた自身の創造性を繁栄させるための単なる出発点です。 jQuery UIとMocha UIは同じカテゴリに分類されます。

現在、使用しているバックエンド技術に応じて、コントロールベンダー用のコントロールベンダー( telerikDevExpress など)があります。実際にかなりよく見える何かを一緒に平手打ちする方法。

3
NotMe

Mocha UIとjQuery UIはJavaScript UIライブラリであり、CSSフレームワークの目的とは非常に異なる目的を持っています。これらのライブラリが行うことを実行できるCSSフレームワークを見つけるとは思わない。

まず、UIは単なる美学や視覚的なデザインではありません。定義された一連の動作と相互作用が含まれます。そのため、Mocha UIやYUIなどのUIライブラリを作成するにはJavaScriptが必要です。 CSSは、独自のリッチUIウィジェットを生成することができません。そのため、非AJAXアプリにはあまりリッチなUIがありません。

もう1つは、事前にパッケージ化されたUIグラフィックセットのみに関心がある場合でも、UIの外観は配置されているWebデザインと一致する必要があります。あらかじめパッケージ化されたUI「テーマ」用。そのため、ほとんどのJavaScript UIライブラリでは、付属のUIコンポーネントのルックアンドフィールをカスタマイズできます。そして、CSSスタイルに加えて画像を編集する必要があります。

これらの理由から、ほとんどのCSSフレームワークはCSSを記述するためのフレームワークであり、見栄えを良くするためにアプリケーションにドロップするだけのUIフレームワークではありません。このようなフレームワークを使用すると、大規模なアプリケーションのCSSをより管理しやすくすることができますが、最終的には、UIを設計および実装するためのUIデザイナーとフロントエンドプログラマーが必要になります。

現在、人気のあるCMSを使用している場合は、couldテーマをダウンロードまたは購入します。しかし、カスタムアプリケーションで使用できるCSSテーマ/スキンフレームワークはありません。また、ほとんどのエンタープライズWebアプリケーションには、事前に構築されたテーマではなく、カスタム設計のUIがあります。

つまり、あなたがcouldすることは、多くのUXデザイナーやインタラクションデザイナーが行うことです。つまり、すべてのアプリケーションが使用する会社全体のカスタムUIライブラリを作成します(または作成します)。これにより、すべてのアプリケーションがブランドに合わせて統一された「署名」の外観になります。また、フロントエンドの開発者は、各アプリのUIスタイルを書き直す時間を節約できます。

2
Lèse majesté

無料で言語にとらわれないフレームワークとして、 Sass 言語と連携して非常にうまく機能する Compass フレームワークが常に使用されます。それらおよび再利用可能。

Linuxを使用している場合、rubygemsを使用して簡単にインストールできます(Rubyについて何も知る必要がないことに注意してください。PHPを記述し、Sassを使用します。他のプラットフォームでも簡単に取得できますが、チェックしていません。

2
Steven Rosato

私は Bootstrap を使用していますが、それは驚くべきことです。

1
Chris Kluis