Dynamic Web Technologies ICT 475-675
This is a resource site for the class in Dynamic Web Technologies offered by Kevin W. Tharp at UW-Stout.
Module 1 - Responsive Web Design.
The book we use for the responsive web design is "Responsive Web Design with HTML5 and CSS3" by Ben Frain.
- At this point, the materials for this section are only available in the Course Management System
- Lab: Visio Information Architecture Lab
- Begin the process of understanding how to design for multiple screen sizes using media queries and fluid grids.
- Lab 2: Setting up the Server and the Cascade
- Learn about the 960 fluid grid, and understand why it is necessary to use fluid grids when doing responsive design. Look at new features of HTML5 and CSS3 such as media queries, the CSS cascade and the 12 column approach that allow us to do responsive design.
- Lab: Fluid Grid Lab
- Create the HTML structure for a responsive fluid grid design, establish the css base, and understand hot the cascade within a single stylesheet applies to mobile first responsive design
- Exercise and Lab: Using the 12-8-4 column mockup from the previous lesson, create a responsive design.
- Set up the 960 px fixed width grid, change it from fixed to fluid, understand min-width vs max-width, and walk through going from Fluid to Responsive.
- Lab: Turn your mockup into a Fluid responsive grid using media queries to adujust the layout at the appropriate viewport sizes.