diff --git a/5. Responsive Design and Advanced Selectors/2. RESPONSIVE_DESIGN.md b/5. Responsive Design and Advanced Selectors/2. RESPONSIVE_DESIGN.md index b5b7adb..92136f5 100644 --- a/5. Responsive Design and Advanced Selectors/2. RESPONSIVE_DESIGN.md +++ b/5. Responsive Design and Advanced Selectors/2. RESPONSIVE_DESIGN.md @@ -41,7 +41,6 @@ Layout using percentages so that content shrinks and expands with window dimensi ## Describe the "mobile first" development process 1. Term is mostly used for designers - - use https://generalassemb.ly/ 1. Also applies to developers - start by developing mobile and move upward - don't go desktop to mobile @@ -56,24 +55,29 @@ Layout using percentages so that content shrinks and expands with window dimensi ## Define media queries and why we need them -1. media query possibilites - - http://www.w3schools.com/cssref/css3_pr_mediaquery.asp - - media types - - screen - - print - - tv - - media features - - min-width - - max-width - - min-height - - max-height - - orientation - - resolution -1. mobile first with media queries - - mobile devices typically slower - - will read mobile css and discard larger device css - - larger devices will read mobile data and overwrite - - this is okay since they're faster - - could also have media queries for small devices too - - fine, but can get complex with lots of media queries - - can scan and assume existing queries are only for large devices +### media query possibilites + +- http://www.w3schools.com/cssref/css3_pr_mediaquery.asp +- media types + - screen + - print + - tv +- media features + - min-width + - max-width + - min-height + - max-height + - orientation + - resolution + +### Use mobile-first ideology with media queries + +Start with mobile device design and then add media queries for larger screens + +- mobile devices typically slower +- will read mobile css and discard larger device css +- larger devices will read mobile data and overwrite + - this is okay since they're faster +- could also have media queries for small devices too + - fine, but can get complex with lots of media queries + - can scan and assume existing queries are only for large devices