Können Sie ein CSS Framework (oder UI Framework) für Unternehmenswebanwendungen empfehlen? [geschlossen]

Gibt es ein CSS-Framework, das speziell für Geschäftsanwendungen versucht?

Ich habe mir die Mocha-Benutzeroberfläche angesehen, die auf MooTools basiert. Ehrlich gesagt möchte ich jedoch vermeiden, mich mit Javascript und Moo (oder jQuery / jQuery UI) zu befassen. Ich neige dazu zu glauben, dass das meiste, was Sie für eine einfache Web-App benötigen, in CSS ohne die dazugehörigen Javascript-Mods verarbeitet werden kann.

Viele der ausgefeilten CSS-Funktionen richten sich an Blogging- oder Web-Publishing-Anforderungen, die sich von den UI-Anforderungen einer Business-App unterscheiden. Es scheint, dass dies ein Problem sein muss, das jemand gelöst hat, aber ich kann anscheinend keine Lösung finden.

Ich hoffe, dass die vorgeschlagenen Lösungen sprachunabhängig sind (Arbeit mit PHP, ASP, CF usw.). Wenn es jedoch ein Framework gibt, das in einer Sprache verwurzelt ist, die die Benutzeroberfläche in einem sehr "fertigen" Sinne handhabt, dann wäre ich daran interessiert, dies zu betrachten, selbst wenn es die Einführung eines Frameworks bedeutete, das die Verwendung eines bestimmten Servers erzwang. Seitensprache.

Mein Ziel ist es nicht, MVC zu verwenden, sondern nur ein gut aussehendes CSS zu haben, das zu einer Anwendung passt.

BOUNTY: Ich habe beschlossen, eine Prämie für diese Frage zu erheben, weil ich denke, dass es einige nützliche "Ausgangspunkte" (minimal angegeben) für CSS geben muss, die auf Web-Apps ausgerichtet sind, wobei ich es vorziehen würde, dass sie hoffentlich:

1. plattformunabhängig oder für verschiedene Entwicklungsplattformen geeignet, und
2. kostenlos oder fast kostenlos (wie in, nicht 1000 $ für eine Sammlung von Kontrollen)

"Inspirierend" Beispiel: (Wortspiel absichtlich, sorry) Ich habe eine Entwicklungsfirma für Kirchenwebsites gefunden, die eine Design Patterns Library und Code Standards veröffentlicht hat, was sehr verlockend ist, aber es scheint, dass es nur für diejenigen verwendbar ist, die Kirchenstandorte mit ihren entwickeln Software als Dienstleistung (?). Unabhängig davon sind das CSS und die ergänzenden Grafiken nicht für den öffentlichen Gebrauch verfügbar.

Ich stimme früheren Antworten (Chris Lively und Lèse majestè) zu. Und auch ich fand den Link, den Sie zur Verfügung stellen, sehr cool.

Aber gehen wir zu meiner Antwort. Ich denke, du solltest es auf deine eigene Weise schaffen. Es gibt viele Ressourcen, die Sie verwenden können. Ich werde meine zitieren.

Während ich mein eigenes Framework und meine eigenen Generatoren entwickelte, wurde die Notwendigkeit eines UI-Frameworks offensichtlich, sodass alle Klassen und IDs in HTML-Vorlagen automatisch generiert wurden.

Nachdem ich die von mir verwendeten Kommunikationsmuster studiert habe, habe ich mein eigenes CSS-UI-Dienstprogramm (sowie einige JS-Dienstprogramme) erstellt. Der entscheidende Punkt in meinem Ansatz ist die Verwendung vieler verschiedener Klassen.

.erforderlich, .relaxed, .warning, .error, .success, .roundedBox, .gradient, .white70 [rgba (255,255,255,0.7)], .black30, .padded, sind einige Beispiele.

auf der HTML-Seite:

Außerdem ist es über 960 Grid implementiert und verfügt über viele andere Dienstprogramme, wie z. B. @ font-face-Kits. Tatsächlich führt mich dies mit nur wenigen Arbeiten. Hinzufügen korrekter Klassen und möglicherweise geringfügige Anpassungen für jedes Projekt.

Neben mehreren Klassen besteht der andere Kern darin, sicherzustellen, dass alles an ein Schwarz-Weiß-Grau-Schema gebunden bleibt und mit Trübungen arbeitet. Dies dient dazu, die für jedes Projekt erforderlichen Codeänderungen zu reduzieren. Daher verfügt jedes Projekt normalerweise über ein eigenes Farbschema.

Das Problem ist, dass "fertig" für verschiedene Menschen verschiedene Dinge bedeutet.

Vielleicht möchten Sie, dass ein hübscher kleiner Rand um Ihre Eingabeelemente eingeblendet wird, nachdem sie den Fokus erhalten haben. Vielleicht möchten Sie, dass alle Ihre Absatzelemente einen Rand von 4 Pixeln haben. Oder vielleicht möchten Sie sicherstellen, dass alle Schaltflächen blauen Text mit einem Glanzgefühl haben.

Sie sehen, es gibt keine einzige Lösung. Es ist alles eine Frage des Designs und des Geschmacks, die keineswegs für alle gleich ist UND sich weiterentwickelt. Web 2.0 brachte uns größere Schriftarten, größere Felder zum Eingeben und einen Mangel an verschachtelten Dropdown-Menüs (zum Glück). Wer weiß, was die UI-Geeks für "3.0" herausfinden werden ... Was auch immer es ist, es wird hoffentlich so radikal anders sein als das 2.0-Zeug von den Sites aus den 90ern.

Bestimmte Technologien wie WPF, Flash und Silverlight sind teilweise vorhanden, um einer Site ein völlig anderes Gefühl zu verleihen. Aber auch dies sind nur Ausgangspunkte, damit Ihre eigene Kreativität gedeihen kann. jQuery UI und Mocha UI fallen in die gleichen Kategorien.

Abhängig von der von Ihnen verwendeten Backend-Technologie gibt es nun Steuerungsanbieter (wie Telerik und DevExpress ), die sofort Skins für ihre Steuerungsbibliotheken bereitstellen, und sie sind eine großartige Möglichkeit, etwas zusammenzufügen, das tatsächlich ziemlich gut aussieht.

Ich bin überrascht, bis jetzt hat niemand eine Blaupause vorgeschlagen . Gut! Dies ist nur ein CSS-Framework, das Ihren Entwurfsaufwand verringern kann.

[Okt 2013]

Heute sind Foundation- und Bootstarp- Frameworks für die Webentwicklung inaktiv . Mit ihnen können Sie reaktionsschnelle Webseiten entwerfen.

Mocha UI und jQuery UI sind JavaScript-UI-Bibliotheken, die einen ganz anderen Zweck haben als ein CSS-Framework. Ich glaube nicht, dass Sie ein CSS-Framework finden werden, das genau das kann, was diese Bibliotheken leisten.

Erstens ist die Benutzeroberfläche mehr als nur Ästhetik oder visuelles Design. Es enthält eine definierte Reihe von Verhaltensweisen und Interaktionen. Aus diesem Grund ist JavaScript erforderlich, um eine UI-Bibliothek wie Mocha UI oder YUI zu erstellen. CSS ist einfach nicht in der Lage, eigenständig umfangreiche UI-Widgets zu generieren. Aus diesem Grund haben Nicht-AJAX-Apps keine sehr umfangreichen Benutzeroberflächen.

Die andere Sache ist, selbst wenn Sie nur an einem vorgefertigten Satz von UI-Grafiken interessiert sind, muss die Ästhetik einer UI mit dem Webdesign übereinstimmen, in dem sie platziert ist. Abgesehen von Rapid Prototyping würde es also nicht viel Sinn machen für ein vorgefertigtes UI "Thema". Aus diesem Grund können Sie in den meisten JavaScript-UI-Bibliotheken das Erscheinungsbild der mitgelieferten UI-Komponenten anpassen. Dazu müssen zusätzlich zu den CSS-Stilen auch Bilder bearbeitet werden.

Aus diesen Gründen sind die meisten CSS-Frameworks Frameworks zum Schreiben von CSS und keine UI-Frameworks, die Sie einfach in eine Anwendung einfügen können, damit sie gut aussieht. Solche Frameworks können das Schreiben von CSS für große Anwendungen sicherlich einfacher machen, aber am Ende benötigen Sie noch einen UI-Designer und einen Front-End-Programmierer, um die UI zu entwerfen und zu implementieren.

Nun, wenn Sie ein beliebtes CMS verwenden Sie könnte ein Thema für sie herunterladen oder kaufen. Ich kenne jedoch kein CSS-Theming / Skinning-Framework, das in einer benutzerdefinierten Anwendung verwendet werden kann. Außerdem haben die meisten Unternehmenswebanwendungen benutzerdefinierte Benutzeroberflächen, die keine vorgefertigten Themen sind.

Sie können jedoch das tun, was viele UX-Designer und Interaktionsdesigner tun. Erstellen Sie also eine unternehmensweite benutzerdefinierte UI-Bibliothek (oder lassen Sie eine für Sie erstellen), die alle Ihre Anwendungen verwenden. Dadurch wird sichergestellt, dass alle Ihre Anwendungen ein einheitliches "Signatur" -Look haben, das auf Ihre Marke abgestimmt ist. Dies erspart Ihren Front-End-Entwicklern die Zeit, die UI-Stile für jede App neu schreiben zu müssen.

Als freies und sprachunabhängiges Framework wird immer das Compass- Framework verwendet, das in Verbindung mit der Sass- Sprache sehr gut funktioniert , wodurch Ihr CSS viel thematischer und wiederverwendbarer wird.

Wenn Sie Linux verwenden, kann es einfach über Rubygems installiert werden (beachten Sie, dass Sie nichts über Ruby wissen müssen, ich schreibe PHP und verwende Sass - jetzt bekannt als Scss für Sass3), obwohl es möglicherweise einfach ist, auf eines zuzugreifen andere Plattform auch, aber ich habe nicht überprüft.

Ich benutze Bootstrap , es ist erstaunlich.