Quand dois-je utiliser un framework CSS?


11

Quels sont les scénarios de meilleures pratiques pour l'utilisation d'un framework CSS? Quand est-il préférable de "rouler votre propre" CSS à partir de zéro plutôt que d'utiliser des frameworks?

Réponses:


11

Les frameworks CSS sont un peu délicats car ce ne sont pas vraiment des frameworks pour moi. Ce sont simplement des classes prédéfinies. Mais ce n'est pas votre question.

Les frameworks CSS sont parfaits pour les maquettes et les armatures. Je ne recommanderais pas de les utiliser sur un site en direct car ils ajoutent des classes dénuées de sens à votre balisage. ".span3" ne me dit rien du contenu, seulement du design.

Cependant, blueprint a quelques outils sympas qui vous aident à combiner ses classes de framework et vos classes sémantiques une fois que vous avez terminé.

Je roule toujours mon propre CSS.


4
Je suis avec Thorn007 sur celui-ci. CSS est sacrément simple quand vous y arrivez. Utilisez simplement une bonne réinitialisation CSS et lancez la vôtre.
jessegavin

3

Evitez-les, ils ne sont que gênants.

Surtout celui-ci.

* { margin:0; padding:0; }

Ma plus grande plainte est que si vous héritez / maintenez un site qui utilise une réinitialisation et / ou un framework, vous devez apprendre ce framework avant de pouvoir modifier le site.

Lorsque j'ajoute une balise h1, j'attends certaines choses. La plupart des réinitialisations suppriment tout le remplissage, la marge, le bloc, etc. de sorte qu'une balise h1 n'agit plus comme elle le devrait par défaut. Je dois donc revenir en arrière et ajouter tout ce qui était là en premier lieu.

Généralement (selon mon expérience), ses personnes qui ne comprennent pas les CSS utilisent les réinitialisations et les cadres, et cela entraîne plus de travail pour les personnes qui le font.


1
Eric Meyer et les développeurs Web de Yahoo comprennent le CSS et utilisent des réinitialisations CSS. D'après mon expérience, ils économisent BEAUCOUP de temps et de maux de tête en essayant d'atteindre la cohérence entre les navigateurs. - Les frameworks CSS sont boiteux.
jessegavin

Lorsque j'ajoute une balise h1, j'attends certaines choses .. malheureusement, vous devez vous attendre à des choses différentes de chaque navigateur .. et, par conséquent, la nécessité d'une réinitialisation css ( pas de frameworks )
Gabriele Petrioli

h1 est un assez mauvais exemple, car les navigateurs ont tendance à utiliser des marges différentes, etc. Personnellement, je préfère un "set" pour réinitialiser - c'est-à-dire au lieu de tout remettre à 0, il suffit de le mettre dans votre propre feuille de style en premier lieu!
DisgruntledGoat

* {margin:0; padding:0;}est la réinitialisation CSS la plus importante de toutes. Il supprime margin-top/maring-bottomsous toutes les balises même les pbalises, donc après vous ne verrez pas un énorme espace entre chaque ligne. Même ce site Web utilise probablement p {margin:0;}sinon le navigateur vivrait un espace énorme entre chaque ligne. Je me demande comment vous pouvez dire qu'ils sont ennuyeux.
Marco Demaio

2

Je pense que le seul service fourni par CSS Framework est un point de départ pour ceux qui ne sont pas très familiers avec CSS.


2

Je recommande également d'utiliser un reset.css d'Eric Meyer, mais je pense que les "frameworks" CSS peuvent être bénéfiques pour la mise en page. Blueprint, YUI grid et 960-grid peuvent vous aider à réaliser des mises en page très compliquées sans écrire le CSS vous-même.

Bien qu'il y ait des inconvénients qui ont été mentionnés, la même chose pourrait être dite à propos de la construction d'un site Web à partir d'un CMS au lieu de rouler du code personnalisé par exemple, mais ils peuvent toujours être utiles et pour de nombreux sites, les avantages obtenus l'emportent sur les problèmes de CSS ou de performances.


1

Si vous implémentez votre propre conception, vous allez écrire une partie de votre propre CSS (à moins que quelqu'un d'autre n'ait écrit la conception exacte que vous voulez).

En supposant que vous écrivez certains de vos propres CSS, les «frameworks» peuvent être utiles lorsque vous avez des styles qui sont:

  1. utilisé dans plus d'un endroit; et
  2. assez compliqué pour se séparer de leurs propres classes

Pour les styles vraiment simples, il est préférable d'utiliser des classes pour indiquer ce qu'est quelque chose (par exemple class="navigation"), puis de définir son apparence en appliquant des règles de style à cette classe dans votre feuille de style.

Mais pour les styles plus complexes qui ne sont pas nécessairement liés à un élément (par exemple, les styles liés à la mise en page, le genre de frameworks qui donnent des noms .span3), il n'y a rien de mal à les mettre dans une classe et à appliquer cette classe dans le CSS. Vous pouvez utiliser les deux approches ensemble.

Dans les sites plus grands et plus complexes où les éléments sont susceptibles d'être combinés de manière imprévisible, une approche de type framework peut vraiment vous aider à gérer votre code.

Je dirais que vous pourriez aussi bien écrire votre propre «cadre». Je mets «framework» entre guillemets parce que CSS n'est vraiment pas un gros langage. Vous pouvez lire CSS: The Definitive Guide (Eric Meyer) en une journée, puis lire tout le code dans par exemple Blueprint (un «framework» CSS) et comprendre à peu près ce qui se passe. Vous devrez peut-être rechercher un peu les solutions de contournement IE, mais nous parlons au moins d'un ordre de grandeur de complexité moindre que par exemple jQuery ici.


1

J'utilise blueprint, pour CSS.
CSS est, comme tout le monde le dit ci-dessus, très simple.

Cependant, en réalité, vous devez considérer la plate-forme.

Avec CSS, le moteur de rendu ajoute à la complexité.

Gecko vs WebKit vs Presto vs Trident ... qui veut faire tout ça?

Ce qu'un «framework» vous offre ici, c'est la possibilité d'écrire des mises en page qui fonctionneront très probablement sur tous les navigateurs, vous n'aurez donc pas besoin de googler pour le mode excentrique IE 7 «WTF-am-I-do = -this-crap» fixer, ou quelque chose de même ridicule.

Les cadres feront 90% de la mise en page que vous souhaitez, puis vous pourrez toujours ajouter vos propres styles plus tard.

Donc, pour répondre à la question, je dirais choisir un cadre et voir s'il fonctionne pour vous. C'est juste possible. Ensuite, vous êtes en or et pouvez revenir à tout ce que vous vouliez réellement faire. Sinon, étendez-le, utilisez css et modifiez ce qui n'a pas fonctionné. De cette façon, vous conservez l'avantage multi-navigateur, mais vous pouvez toujours le personnaliser.

Comme petit avantage, si vous en choisissez un et que vous l'utilisez tout le temps, puis que vous tombez malade ou que vous êtes promu et que vous devez former votre successeur, vous pouvez dire:

"Oui, j'ai utilisé le framework ABC. Les documents sont là. Le code est là. La formation terminée. Bonne chance."


0

Quand il résout tous vos besoins . (Ceci est basé sur l'idée de la couture .)

Du seul livre sur les cadres? http://www.oreilly.com/web-platform/free/book-of-html-css-frameworks.csp . (Lien uniquement car il est gratuit et pertinent ici.)


Il serait préférable de couper et coller les parties pertinentes de la page à laquelle vous avez lié. Sinon, comme réponse, c'est une sorte de lumière. Les réponses de lien uniquement sont déconseillées ici car les liens se cassent souvent avec le temps. Pouvez-vous mettre à jour cette réponse pour aider le PO et les futurs utilisateurs avec quelque chose dans lequel ils peuvent se mordre? Merci d'avance!
closetnoc
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.