What are we comparing

This test was conducted to see which CSS framework had 'better' defaults concerning page styling & typography.  To do this we took a simple page from the Kauri froms samples and applied styles from blueprint and yui on it. Below you will find screenshots from both frameworks. As a reference we've also added a version of the sample without any CSS framework styling.

Since not all HTML elements are present on the page this test is far from complete or accurate. But it does give a good indication of what each framework offers in the sense of defaults.

Plain

The sample page without any styling applied to it.

plain
Click to enlarge

YUI

  • Some typography changes concerning font sizes in titles
  • tables get a heavy black line
  • no form, complete reset

yui
Click to enlarge

Blueprint

  • use of sans-serif fonts (Helvetica or Arial)
  • table styling : heading & data. Table takes up 100% width
  • form styling : definition lists have an appealing styling

blueprint
Click to enlarge

Conclusion

Blueprint seems to offer a more complete set of defaults which seem more visually pleasing than YUI. YUI probably does a very good browser reset but then fails to produce a nice set of default css styles.