CSS Frameworks Faster Layout Consistent Results
CSS Frameworks:
Faster Layout, Consistent Results
by Steve Hong (@st3v3hong)
Senior Web Developer
CrossComm, Inc.
http://slideshare.net/stevehong/
no notes exist for this slide
Benefits
Benefits.
Developers don't need to learn CSS layout techniques.
CSS resets provide a common foundation across browsers.
Prototyping and site production can be faster with pre-made solutions.
Common standards and documentation allow others to pick up your work later.
no notes exist for this slide
Drawbacks
Drawbacks.
There is a learning curve before you see productivity gains.
Sometimes they contribute to code bloat.
Designers may have to be on board to use grid systems and common widths.
They mix presentation and content with non-semantic class names.
no notes exist for this slide
CSS frameworks for resetting browsers
CSS frameworks
for resetting browsers.
no notes exist for this slide
YUI
YUI.
yhoo.it/yui3framework
"YUI 3 is Yahoo!'s next-generation JavaScript and CSS library. It powers the new Yahoo! homepage and incorporates what we've learned in five years of dedicated library development."
no notes exist for this slide
Tripoli
Tripoli.
bit.ly/tripolicss
"Tripoli is a generic CSS standard for HTML rendering. By resetting and rebuilding browser standards, Tripoli forms a stable, cross-browser rendering foundation for your web projects."
no notes exist for this slide
SenCSs
SenCSs.
bit.ly/sencss
"SenCSs... doesn't include a layout system littered with silly classes and pre-set grids... SenCSs does everything else: baseline, fonts, paddings, margins... All the stuff that's almost the same in every project..."
no notes exist for this slide
Elements
Elements.
bit.ly/elementscss
"Elements is a collection of folders and files that help you work faster. It was made to fit into your exsisting workflow, or be its own workflow. From client files to design to code to getting out on the web"
no notes exist for this slide
CSS frameworks for layout
CSS frameworks
for layout.
no notes exist for this slide
960gs
960gs.
bit.ly/960gs
The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
no notes exist for this slide
Blueprint
Blueprint.
bit.ly/blueprintcss
"Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing."
no notes exist for this slide
YUI grids
YUI grids.
yhoo.it/yui2grids
"The foundational YUI Grids CSS offers four preset page widths, six preset templates, and the ability to stack and nest subdivided regions of two, three, or four columns. The 4kb file provides over 1000 page layout combinations."
no notes exist for this slide
CSS frameworks for specific needs
CSS frameworks
for specific needs.
no notes exist for this slide
Formy
Formy.
bit.ly/formycss
âFormy is CSS Framework for better form management. [Formy is] universal CSS for forms who will interact in the simple natural way with HTML form and HTML form will work decently well even without CSS."
no notes exist for this slide
Hartija CSS Print
Hartija CSS Print.
bit.ly/hartijacss
"I decided to make universal Cascading Style Sheets for web printing by uniting all best CSS printing practises into one."
no notes exist for this slide
CSS DropDown Menu
CSS Drop-Down Menu.
bit.ly/cssdropdownmenu
"Modular, with themes. Easily deployable. Easily transformable. Cross browser. Javascript only for IE. Super fast. Continuous development. iPhone OS [compatible]."
no notes exist for this slide
Contact me
Contact me.
Steve Hong, Senior Web Developer, CrossComm
contact@stevehong.com
linkedin.com/in/stevehong
www.crosscomm.net
@st3v3hong
no notes exist for this slide
Find this online
Find this online.
SlideShare:
http://slideshare.net/stevehong/
no notes exist for this slide