Differences

This shows you the differences between two versions of the page.

--- eg-146:lecture19 [2012/04/23 18:13] – [Making 'one site for all' happen] eechris
+++ eg-146:lecture19 [2012/04/23 18:29] (current) – [Making 'one site for all' happen] eechris
@@ Line 50: / Line 50: @@
   * The key design approach that you need to adopt is called **Progressive enhancement**.((This also applies to behaviour, and we will study it in more depth next year when we look at JavaScript))
   * In summary you need to separate HTML from styles so that you can progressively enhance the layout for higher resolution and more capable devices
-  * For a good introduction see Ethan Marotte, //Responsive Web Design//, [[http://www.alistapart.com/articles/responsive-web-design|www.alistapart.com/articles/responsive-web-design]] and the Book of the same name.
+  * For a good introduction see Ethan Marotte, //Responsive Web Design//, [[http://www.alistapart.com/articles/responsive-web-design|www.alistapart.com/articles/responsive-web-design]] and the [[http://www.abookapart.com/products/responsive-web-design|Book of the same name]].
 Example: [[http://www.foodsense.is|www.foodsense.is]]
@@ Line 56: / Line 56: @@
 ----
-* try resizing the browser window and watch what happens to the main content, banner, navigation menu and other items that are on the screen.
+  * try resizing the browser window and watch what happens to the main content, banner, navigation menu and other items that are on the screen.
-* If you can, try viewing the site on a smart phone and/or tablet. With these devices check what happens when you change the orientation of the device.
+  * If you can, try viewing the site on a smart phone and/or tablet.
+  * With these devices check what happens when you change the orientation of the device.
 ===== Principles of Responsive Design =====
@@ Line 75: / Line 75: @@
 </note>
-Further Reading
+===== Further Reading =====
-        Luke Wrote lew ski-^ Mobile First"
+  * Luke Wroblowski, //Mobile First design//, Nov 2009. URL [[http://www.lukew.com/ff/entry.asp?933|www.lukew.com/ff/entry.asp?933]] (See also the [[http://www.lukew.com/ff/entry.asp?1137]] and Book with same title from [[http://www.abookapart.com/products/mobile-first|A Book Apart]], 2011.
-                design Nov 2009.
+  * Jeremy Keith on the "one site for all approach, "One Web", Presentation at the 2011 DIBI Conference: [[http://www.vimeo.com/27484362|www.vimeo.com/27484362]] and transcript [[http://www.adactio.com/articles/4938|www.adactio.com/articles/4938]]
-        w WW-hike w-com / ff I on his-a op? 9 33
-                Video -> -t 118ft entry-asp? 1127
+===== Understanding and Using Media Queries =====
-"Mobile First 4 Book, NBYZLI Apart, 2011
-fewest Jeremy Keith "one site fron all u
-approach "One Welsh at DIBI
-        w w w. v i n e o. cour / 2 7 48 4 3 6 2
-+ transcript WWW-adoration. com (articles 14938
-Understanding s Using media events
 Used in head
                 <i ink net = "style sheet a half ="-.."