Do you use css framework

Should we use a CSS framework ? Are they worth it?

CSS frameworks have nice styles inbuilt and ask you to focuses on the grids but still there is a bit of dependency and lack of freedom it provide.. If I need to generate a webpage by looking on a PSD based mockup screen ..either i will use the classes provided by the framework but if that actual measurements does not exist I need to again specify my own rules that will add upto my CSS filesize and if performance is a constraint as always it is. you need not a big size file..though its in kb but every drop counts. Any comments and suggestions to use the framework in a best possible way.

I can’t recommend the accepted answer in this question enough: stackoverflow.com/questions/203069/… — I think it nails it.

5 Answers 5

I think a style reset is great — but a framework is too limiting. You are forced to use their classes etc.

This could result in some inconsistent class names, like for example if you have a site that separates words with a hyphen (-) and then you use a grid that uses the underscore (_).

You also have to buy in to that framework, as in adopt it for your whole site (if the main template is using it).

It should work now — I think they were updating it as soon as I posted it! @shog9 — Aw I thought it might work, the cached version!

«but a framework is too limiting». Sigh. So write everything from scratch, learn and deal with dozens of different browsers and versions, use your own ‘best practices’, create a system model that other folks have to learn from? Sign. Alex, I appreciate that with 80,000 points you are hypersmart. Personally I do not feel that the suggested answer here will work for the 99% of regular developers. imho and my 1/50 of a dollar of course 🙂

Css frameworks are not like the regular code frameworks/libraries that provide functions that allow you to do your work faster.. it is more like having a starter file, that saves you the time of writing css that you use in all your projects.

Saying that, I really do believe the best way to use a css framework is to look at what css you use more often and create a homegrown css framework. Personally i use the same reset and typography rules for the majority of my projects. I do have a collection of different grids, but really that differs based on the type of project. Not all designs will work with a grid.

Before when I tried to use a pre-built framework, I found myself wasting time removing styles or working around some of the styles from the framework. That is just from my experience with frameworks, I do know people that love working with Blueprint and swear by it.

Источник

Do you use a CSS framework? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.

If yes, which one? Why? If no, why? How do you fix cross browser CSS rendering? I currently use blueprint css, and I wonder if it’s a good choice. Thanks! 🙂

11 Answers 11

No, I’m not using any framework, just a well thought out naming system that I reuse over and over and a basic css with a few resets and some base styles.

Why am I not using a css framework?

The use of a framework usually assumes that the designer is familiar with its conventions which is quite often not the case — you’re not the one designing the page or the client has his own designer. And even if this is not the case, there will always be designs that won’t fit into 960 pixels or simply have an even size so you can’t use your magical .span-4 class.

Which leads me to the next point. The naming is not semantic. In theory you would expect a framework to ease maintaining a large site. However, suppose you have to make a slight design change. This basically means changing the html across all the template views involved. This is hard and risky even with a versioning system, because it’s one thing having to rollback to a single css file, and another to 100 views. All because input.span-19 should have 5pixels less. CSS frameworks — the new inline css.

What about cross browser issues? Either you’re using a framework or not this is not going to change. There are browsers or operating systems that have certain particularities. Bottom line — Internet Explorer will still suck as much.

CSS Frameworks stand out for discipline and I have to give them credit for that, but in the end it’s all about the one writing the code.

One point I disagree with: cross-browser compatibility. My choices boil down to keeping the design simple enough to evade all issues, OR learning all the ins, outs and hacks of CSS, OR using a tool like Grid 960 that has the solutions wonderfully built in. Grid 960 delivers the same results with one percent discrepancy between FireFox and IE7, which is way more than I could achieve otherwise. (God bless Nathan Smith for creating Grid 960.)

Your well thought out naming system that you reuse over and over is a framework by definition. You are using a framework!

I’ve noticed two major misconceptions about css frameworks.

Firstly, there tends to a lot of confusion between the concept of a framework used in software development, as a tool and a type of a framework such as 960gs.

Wikipedia defines a framework as «an abstraction in which software providing generic functionality can be selectively changed by user code, thus providing application specific software».

@vise says «I’m not using any framework, just a well thought out naming system that I reuse over and over and a basic css with a few resets and some base styles.» This is akin to saying «I’m not using any framework, just a framework.» This is probably some kind of semantic irony. No offence intended 🙂

Blueprint, 960, compass etc are all types of frameworks. Because some css frameworks may not be semantic or are lacking certain desirable qualities, this does not mean css frameworks are a bad idea.

The second misconception is that css and css frameworks are mutually exclusive. You either code css by hand or you use a framework (with some custom stuff). But. wait a minute. isn’t CSS a set of default elements that we can alter or extend to suit our specific requirements? CSS looks suspiciously like a framework according to Wikipedia’s definition.

Of course, this second point is debatable. But often I find that people are using some kind of framework without knowing it.

To answer your question, I tend to use something like sass and make my own framework. On my latest project, I am using a combination of this and Bourbon which is looking good so far. The main reason I use frameworks is because I’m tired of the redundancy in CSS. It’s really boring having to repeat the same values over and over. There are other concepts in design that CSS doesn’t do very well which I won’t go into here (see here). But by using a framework, it’s possible to abstract all your problems away and just work on getting things done.

Источник

When do I need a CSS Framework?

Cascading Style Sheets (CSS) frameworks do the heavy lifting when you’re starting your web application. There are a number of options to choose from, which begs several questions: which framework do I use? When do I need a CSS framework? How do I choose a CSS framework?

What is a CSS framework?

Many of the presets among these frameworks will overlap. Where most CSS frameworks stand out is how the developer (you!) will use the framework. Let’s look at some brief comparisons, and how they relate to markup (HTML), styles (CSS), and scripts (JavaScript).

The CSS Framework Showdown

Bootstrap vs Pure.CSS

Both of these CSS frameworks have much in common. Bootstrap is a UI toolkit that uses markup, styles, and scripts to create re-usable interfaces. Pure.CSS, on the other hand, is mostly styles and just markup.

So how do they stack up? While Bootstrap is designed to do the heavy lifting for you, Pure.CSS is designed to be a base for your common interfaces. This can make a huge difference in the amount of effort it will take for the developer. When it comes to bundling size, Bootstrap will be much larger (over 100kb) while Pure.CSS only uses less than 4kb. This can make a huge difference in your web app and how fast it will load.

Most people will choose Bootstrap for user interfaces that are not accessible to the public, or otherwise when there is no need for a bespoke design. Developers will reach for Pure.CSS when they’re looking for less theming and want to have more control over the UI. This is because Pure.CSS is a great starter for building styles on top of the framework defaults.

Bootstrap vs Tailwind CSS

Bootstrap and Tailwind CSS are great options that fulfill different needs. In our last comparison, we discussed how Bootstrap is designed to do the heavy lifting as a pre-designed user interface toolkit. Tailwind CSS, however, doesn’t provide any user interface components.

Tailwind CSS is a strictly CSS-only framework with only styles that are used for composition. It provides utilities that the developer can use to compose styles to build custom designs. Tailwind CSS also has a much smaller footprint, coming in at 37kb.

When choosing between Bootstrap vs Tailwind CSS, the decision comes down to whether you need an opinionated framework or not. If you want all of the building blocks to build something bespoke, go with Tailwind CSS. Otherwise, if you need to build something quickly and the design doesn’t matter, Bootstrap can help.

Pure.CSS vs Tailwind CSS

Pure.CSS and Tailwind.CSS have more in common than the previous options. Both of these frameworks are centered around building blocks, while Pure.CSS is a sorta half-way point between Bootstrap and Tailwind.CSS.

Pure.CSS is a great option when you need just the basics covered. But if you find that does too much, Tailwind CSS will give you all the utility without the fuss. Both of these frameworks have smaller footprints than most, so either choice can fit into your web application without too much bundle guilt.

When do I need a CSS framework?

With plenty of choices at your disposal, the choice to use a framework will depend on the requirements, and your needs. Here are some common requirements and need to consider when you’re starting your next CSS project.

CSS Reset

Web browsers each have unique styles, and in order for the design to be consistent, you will sometimes need to consider a CSS Reset. This will override the browser’s default styles to normalize the styles across browsers. There are some great options for a CSS reset.

Design vs. Delivery

This is one of the major reasons to consider a framework. A framework can do the heavy lifting and free the developer up to prototype and build. On the other hand, some frameworks are overly opinionated and can get in your way when you need to build something custom. In some cases, it can be a matter of both design and delivery. Then there is bundle size to consider.

Bundle Size

Another important factor that cannot be overlooked is bundle size. Developer experience is important, but its importance is always weighed against the performance of the web application. A web app is no use if it’s easy to build but cannot run adequately on target devices. So when considering a CSS framework, measure how much of the framework you would be depending on — and whether that justifies the bundle cost.

You stylin’

CSS frameworks are a great option for software engineers who want to focus on building and shipping. They can do the heavy lifting for you, or weight down your application — so choose wisely. Front-end developers in 2020 are fortunate to have a number of options, and resources to help decide which one to pick.

Here are some other resources if you are still deciding:

Источник