Possible Technologies

Evaluation Criteria

Summary

Common Features:

 

 Bootstrap 3.0Foundation 4PurecssYAML

Navigation Lists

    
Tabs(tick)   
Pills(tick)   
Vertical lists(tick)   
Dropdowns(tick)   
Forms: Right aligned labels(tick)   
Anchor Buttons(minus) No ARIA role   
Normalize(tick)   
Clearfix(tick)   

Progressive Enhancement

    
Fixed height / Grid item layouts(tick)(tick)  
Progress Bars(minus) No WAI-ARIA markup   
ThemingBootstrap Theme Roller   
Accessibility Features(warning) Missing ARIA in key components   
EnvironmentLESSSass  
Max Package Size471,199 bytes   
LicenseApache License v2.0   
DocumentationFriendly and thoroughTechnical and thorough  
     

Bootstrap:

FSS Considerations

The following classes are used by UIO and Exploration Tool:

Links and Text:
.fl-link-enhanced
.fl-text-larger

Fonts:
.fl-font-uio-arial
.fl-font-prefsEditor-times
.fl-font-prefsEditor-comic-sans
.fl-font-prefsEditor-arial
.fl-font-prefsEditor-verdana
Theming:
.fl-inverted-color
.fl-theme-uio-bw 
.fl-theme-uio-lgdg
.fl-theme-prefsEditor-[bw/wb/by/yb/lgdg]
.fl-preview-theme.fl-theme-prefsEditor-[bw/wb/by/yb/lgdg]
.fl-theme-prefsEditor-[bw/wb/by/yb/lgdg].fl-inverted-color
.fl-theme-prefsEditor-[wb/bw/wb/by/yb/lgdg] .fl-inverted-color
.fl-preview-theme.fl-theme-prefsEditor-[wb/bw/by/yb/lgdg].fl-inverted-color

 

 

 

Hypothetical Scenario: Framework as FSS Replacement

(warning)  To better understand functionality of a framework, it may be worthwhile to explore how a framework can replicate functionality of FSS (see: FSS Cheat Sheet).


layout

forms and controls

components

theming

fonts

Notes

bootstrap:

Purecss:

YAML