Cory Rylan

My name is . Google Developer Expert, speaker, and Software Developer at VMware Clarity Design System.

Follow @coryrylan
CSS

Web Con, University of Illinois Conference Notes Part 1.

Cory Rylan

- 1 minute

Updated

Here are my notes from University of Illinois Web Con 2014. These are from the talk
"Life without a BS Foundation"
by Kianosh Pourian.

"Build a framework around your design not design around your framework."

Cons for using front end frameworks such as Twitter Bootstrap and Zurb Foundation:

  • Not semantic
  • Naming conventions not established/documented poorly
  • Performance issues (bloat)
  • Little to no file structure especially Sass project for Bootstrap
  • Difficult to update
  • Design implementation frameworks fall short
  • Does not follow the DRY principals
  • Overriding is very difficult and tons of extra code and uses little of the framework
  • Editing the framework breaks any update
  • Impossible to create a framework for everyone
  • CSS is old and part of the issue
  • Spend a lot of time learning someone else's code
  • Not ideal for enterprise or large applicaions
"When building a site or web application, one must build it for success. Success means that small projects will evolve into large projects.

What to do:

  • "Do the sh*t yourself"
  • Write your own CSS
  • Create Style Guides
  • Use Sass or a preprocessor
  • Follow OOCSS Principals
  • Atomic Design
  • Organize your code in modules in folders (each folder is a atom or module)
  • The global import file should have comment of what the modules are being imported for
  • Have a unified naming convention
  • Folders helps packages modules for individual consumption
  • Learn from frameworks such as Twitter Bootstrap and Zurb Foundation
 

No spam. Short occasional updates on Web Development articles, videos, and new courses in your inbox.

Related Posts

CSS

Converting CSS Pixels to Rems

Learn how to convert CSS pixel values to rem to provide scalable typography features and improve accessibility with page zoom.

Read Article
Web Components

Simple CSS Custom Property APIs with Web Components

Learn how CSS Shorthand Properties and CSS Custom Properties can simplify Web Component theming APIs.

Read Article
CSS

CSS Tips Vertical Line Rule

Learn how to use CSS and Flexbox to make vertical line rules.

Read Article