oocss   1562

« earlier    

Organize CSS with a Modular Architecture: OOCSS, BEM, SMACSS
What if we could create interface pieces that behaved more like Lego blocks? This would speed up our frontend development, making it more robust, more organized. Our HTML would get smaller, and our CSS would get MUCH more manageable. In this article, I’ll show you how to organize your CSS architecture into HTML/CSS blocks that behave more like Lego blocks.
fridayfrontend  css  oocss  bem  smacss  modular 
3 days ago by spaceninja
Organize CSS with a Modular Architecture: OOCSS, BEM, SMACSS - Snipcart
How to Organize Your CSS with a Modular Architecture (OOCSS, BEM, SMACSS) They were by far my favorite toys—had loads of ‘em! See, I’m a designer, son of a designer. Lego blocks were our first creativity sandbox: they allowed us to assemble all sorts of crazy things. via Pocket
ifttt  pocket  article  bemcss  css  design  module  oocss  smacss 
6 days ago by jeremyday
Decoupling the Front-end with Modular CSS, by Julie Cameron
This talk will look at how taking a modular, object-oriented approach to CSS can turn frontend woes into frontend wins. We’ll examine modern CSS approaches like OOCSS, SMACSS, and BEM and demonstrate how they will help to not only decouple your CSS styles and reduce specificity conflicts, but how they will also help to decouple your CSS and HTML from your JavaScript and feature specs.
fridayfrontend  video  css  modular  oocss  smacss  bem 
5 weeks ago by spaceninja
What is Modular CSS?
What is Modular CSS? Modular CSS is a collection of principles for writing code that is performant and maintainable at scale. It originated with developers at Yahoo and Yandex as a way to address the challenges of maintaining a large codebase. via Pocket
ifttt  pocket  article  bemcss  css  design  module  oocss  smacss 
7 weeks ago by jeremyday
What is Modular CSS?
Modular CSS is a collection of principles for writing code that is performant and maintainable at scale. It originated with developers at Yahoo and Yandex as a way to address the challenges of maintaining a large codebase. Some of the guidelines were controversial when introduced, but have since come to be recognized as best practices.
fridayfrontend  css  modular  oocss  bem  smacss 
7 weeks ago by spaceninja
Space in Design Systems – EightShapes – Medium
I’ve long referred to Color, Type and Icons as the “Big 3” of a system’s visual language. All UI components — from Buttons on up — are built with them. But I left something out. Space, our final…
webdesign  naming-conventions  patterns  css  oocss  space 
june 2018 by devolute
Combining the Powers of SEM and BIO for Improving CSS
Generally, SEM is concerned with high level CSS philosophy whereas BIO is an actual technique to help you write better CSS to achieve SEM. The main purpose of both SEM and BIO is to better handle the CSS specificity which is one of the most important concepts you should understand for CSS.
fridayfrontend  css  sem  bio  scalable  extensible  maintainability  bem  itcss  oocss  frameworks  specificity 
june 2018 by spaceninja
Should You Chain or Extend CSS Classes?
CSS modularity relies on composition, which inevitably fattens the HTML. This collateral effect can be a significant rebuttal for many people because of the “bloat” it creates. In this article, we’ll compare two techniques: chaining and extending. We’ll see what they provide and what their shortcomings are so that you can make more thoughtful choices.
fridayfrontend  css  modular  chaining  extends  oocss  bem  smacss  frameworks  maintainability 
may 2018 by spaceninja
The Front-End Tooling Survey 2018 - Results
It's very easy to take for granted what tools are being used based on your own knowledge and habits. These results help to give an insight into the current trends in front-end tooling, as well as showing how usage is changing over time by looking at the figures from previous surveys.
fridayfrontend  surveys  tools  css  sass  less  postcss  bootstrap  frameworks  lint  autoprefixer  modernizr  stylelint  smacss  oocss  bem  itcss  suit  atomic  css-in-js 
may 2018 by spaceninja
Reusable, Maintainable, and Modular CSS
In this article, I’m going to shortly go over some methodologies that are commonly used to organize CSS at scale. I’ll then explain the concepts behind those architectures, and how this could help you make your own system for organizing CSS!
css  cssbasics  modular  bem  smacss  frameworks  oocss  fridayfrontend 
april 2018 by spaceninja

« earlier    

related tags

#btconf  @csswizardry  @extend  acss  amcss  angular  approach  architecture  article  atomic  atomiccss  autoprefixer  awesome  bbc  bem  bemcss  best-practice  bestpractices  bio  book  bootstrap  bourbon  boxmodel  case-studies  chaining  children  code  coding  collaboration  communication  comparison  components  content-filter  content  convention  css-components  css-frameworks  css-in-js  css  cssbasics  cssgrid  cssmodules  cssom  csstricks  deconstructed  design  development  dinosaurs  ecss  enduring  evolution  extends  extensible  faq  flexbox  floats  framework  frameworks  fridayfrontend  front-end  frontend-stuff  frontend  fun  genius  git  github  grids  history  howto  html  ifttt  inuit  iotacss  itcss  js  layout  less  lint  maintainability  mannweb15  mcss  media  methodology  modernizr  modular-css  modular  modularcss  module  namespace  namespacing  naming-conventions  naming  namingconventions  nav  navigation  neat  nesting  nycda  online  organization  organize  pattern  patternlibrary  patterns  performance  pocket  postcss  postprocessor  preprocessor  preprocessors  process  quality  rapido  rasini  react  reference  responsive  responsivedesign  richcss  rwd  sass  scalable  scss  selectors  sem  simplicity  slides  smacss  space  specificity  standards  strategy  styleguide  stylelint  suit  surveys  syntax  tips  tools  toshare  towatch  triangle  ui  ux  video  web  webdesign  webdev  webdevelopment  web制作 

Copy this bookmark:



description:


tags: