Was sind die Best-Practice-Szenarien für die Verwendung eines CSS-Frameworks? Wann ist es besser, Ihr eigenes CSS von Grund auf neu zu erstellen, als Frameworks zu verwenden?
Was sind die Best-Practice-Szenarien für die Verwendung eines CSS-Frameworks? Wann ist es besser, Ihr eigenes CSS von Grund auf neu zu erstellen, als Frameworks zu verwenden?
Antworten:
CSS-Frameworks sind etwas knifflig, weil sie für mich keine wirklichen Frameworks sind. Sie sind einfach vordefinierte Klassen. Dies ist jedoch nicht Ihre Frage.
CSS-Frameworks eignen sich hervorragend für Modelle und Drahtmodelle. Ich würde nicht empfehlen, sie auf einer Live-Site zu verwenden, da sie Ihrem Markup bedeutungslose Klassen hinzufügen. ".span3" sagt mir nichts über den Inhalt, nur das Design.
Blueprint verfügt jedoch über einige coole Tools, mit denen Sie die Framework-Klassen und die semantischen Klassen kombinieren können, sobald Sie fertig sind.
Ich rolle immer mein eigenes CSS.
Vermeiden Sie sie einfach, sie sind nichts als nervig.
Besonders dieser hier.
* { margin:0; padding:0; }
Meine größte Beschwerde ist, dass Sie, wenn Sie eine Site erben / pflegen, die einen Reset und / oder ein Framework verwendet, dieses Framework kennen müssen, bevor Sie die Site ändern können.
Wenn ich ein h1-Tag hinzufüge, erwarte ich bestimmte Dinge. Bei den meisten Zurücksetzungen werden alle Auffüllungen, Ränder, Blöcke usw. entfernt, sodass ein h1-Tag standardmäßig nicht mehr so funktioniert, wie es sollte. Also muss ich zurückgehen und alles hinzufügen, was überhaupt da war.
Im Allgemeinen (meiner Erfahrung nach) sind es die Leute, die CSS nicht verstehen, die die Resets und Frameworks verwenden, und es verursacht mehr Arbeit für die Leute, die dies tun.
* {margin:0; padding:0;}
ist der wichtigste CSS-Reset von allen. Es werden margin-top/maring-bottom
unter allen Tags sogar die p
Tags entfernt, sodass zwischen den einzelnen Zeilen kein großer Abstand mehr angezeigt wird. Sogar diese Website verwendet wahrscheinlich, p {margin:0;}
sonst würde der Browser einen riesigen Raum zwischen jeder Zeile leben. Ich frage mich, wie man sagen kann, dass sie nerven.
Ich empfehle auch die Verwendung einer reset.css von Eric Meyer, aber ich denke, dass CSS- "Frameworks" für das Layout von Vorteil sein können. Mit Blueprint, YUI-Raster und 960-Raster können Sie einige sehr komplizierte Layouts erstellen, ohne das CSS selbst schreiben zu müssen.
Es wurden zwar Nachteile erwähnt, aber das Gleiche gilt für das Erstellen einer Website aus einem CMS, anstatt beispielsweise benutzerdefinierten Code zu verwenden. Sie können jedoch dennoch nützlich sein, und für viele Websites überwiegen die erzielten Vorteile alle überflüssigen CSS- oder Leistungsprobleme.
Wenn Sie tatsächlich ein eigenes Design implementieren, schreiben Sie ein eigenes CSS (es sei denn, jemand anderes hat genau das gewünschte Design geschrieben).
Angenommen, Sie schreiben einige Ihrer eigenen CSS, können "Frameworks" nützlich sein, wenn Sie Stile haben, die:
Für wirklich einfache Stile ist es besser, Klassen zu verwenden, um anzugeben, was etwas ist (z. B. class="navigation"
), und dann sein Aussehen zu definieren, indem Sie Stilregeln auf diese Klasse in Ihrem Stylesheet anwenden.
Bei komplexeren Stilen, die nicht unbedingt an ein Element gebunden sind (z. B. Layout-bezogene Stile, wie .span3
sie Frameworks gerne benennen), ist es nichts Falsches, sie in eine Klasse einzufügen und diese Klasse im CSS anzuwenden. Sie können beide Ansätze zusammen verwenden.
Bei größeren, komplexeren Sites, bei denen Elemente wahrscheinlich auf unvorhersehbare Weise kombiniert werden, kann ein Framework-ähnlicher Ansatz wirklich dazu beitragen, dass Ihr Code überschaubar bleibt.
Ich würde sagen, dass Sie genauso gut Ihr eigenes „Framework“ schreiben könnten. Ich habe "Framework" in Anführungszeichen gesetzt, weil CSS wirklich keine so große Sprache ist. Sie könnten an einem Tag CSS: The Definitive Guide (Eric Meyer) lesen, dann den gesamten Code in z. B. Blueprint (einem CSS- „Framework“) lesen und ziemlich genau verstehen, was los ist. Möglicherweise müssen Sie die IE-Problemumgehungen ein wenig untersuchen, aber wir sprechen hier von mindestens einer Größenordnung weniger Komplexität als z. B. jQuery.
Ich benutze Blaupause für CSS.
CSS ist, wie alle oben sagen, wirklich unkompliziert.
In Wirklichkeit muss man jedoch die Plattform berücksichtigen.
Mit CSS erhöht die Rendering-Engine die Komplexität.
Gecko vs WebKit vs Presto vs Trident ... wer will das alles machen?
Was Ihnen hier ein "Framework" bietet, ist die Möglichkeit, Layouts zu schreiben, die höchstwahrscheinlich in allen Browsern funktionieren. Sie müssen also nicht nach dem IE 7-Quirksmode "WTF-am-I-Doing = -this-Crap" googeln fix oder etwas ähnlich Lächerliches.
Frameworks erledigen 90% des gewünschten Layouts, und Sie können später jederzeit Ihre eigenen Stile hinzufügen.
Um die Frage zu beantworten, würde ich sagen, wählen Sie ein beliebiges Framework aus und prüfen Sie, ob es für Sie funktioniert. Es könnte einfach sein. Dann sind Sie golden und können zu dem zurückkehren, was Sie eigentlich wollten. Wenn nicht, erweitern Sie es mit CSS und ändern Sie, was nicht funktioniert hat. Auf diese Weise behalten Sie den browserübergreifenden Vorteil bei, können ihn jedoch anpassen.
Als kleinen Vorteil können Sie sagen, wenn Sie einen auswählen und ihn die ganze Zeit verwenden und dann krank werden oder befördert werden und Ihren Nachfolger schulen müssen:
"Ja, ich habe Framework ABC verwendet. Docs sind hier. Code ist da. Training vorbei. Viel Glück."
Wenn es alle Ihre Bedürfnisse löst . (Dies basiert auf der Idee der Schneiderei .)
Aus dem einzigen Buch über Frameworks? http://www.oreilly.com/web-platform/free/book-of-html-css-frameworks.csp . (Nur verlinken, weil es hier kostenlos und relevant ist.)