Blackbird Project issues
CodeAcademy scores next week
CSS Quiz – study guide
——————————–
Responsive Starter Template
RESPONSIVE DESIGN PRINCIPLES:
mobile first!
flexible design (using % instead of px)
percentages! (do the math)
html flow
cascade principle
inheritance (only change styles that need to change)
max-width and min-width (set limit with max or min width)
height values are tricky
responsive images (100% of container parent or img {width: 100%;})
modular design
“breakpoints” based on design not device
display: none and display: block
turning off iOS resize
Media Queries Overview
workflow – sketches, create boxes of content
Approximate Breakpoints:
1200px
960px
768px
600px
480px
320px
Examples:
Responsive Design Resources:
guidelines-for-responsive-web-design
Recipe Hierarchy
Workshop
————————————————
Student Examples:
Previous Recipes projects, Previous Recipes projects1, Previous Recipes projects 2, Previous Recipes projects 3
Highlights: