Join James Williamson for an in-depth discussion in this video Exploring the finished project, part of Applied Responsive Design.
Before we get started working on our responsive design, I think it would be…helpful to preview some of the things that we're going to be creating over the…course of our exercises.…We'll be working on a few pages of the fictitious desolve.org urban photography site.…As I browse the index page for the first time, I am going to do it all designers…do when they show off a responsive site:…I'm going to resize the browser.…Now you'll note that when the browser window hits the specific size break points,…the layout changes to reflect the smaller screen size.…
While this is visually impressive, there is a bit more going on here that I want to point out.…Note that when the page is at that the larger screen size, the layout is fluid…but only up to a point.…When we build our layouts we will construct fluid layouts for each screen size that…is fluid only within a predefined range.…That way we will have layout that will work equally well on any device within a…certain range rather than tailoring our layouts to one specific size.…
- Creating mockups
- Structuring page regions
- Defining default styles and media queries
- Building desktop, tablet, and mobile layouts
- Structuring and styling menus
- Dynamically replacing menus
- Creating a responsive image gallery
- Adding phone functionality
- Testing responsive sites
Skill Level Intermediate
1. Planning Responsive Designs
2. Building Responsive Layouts
3. Responsive Navigation
4. Creating Responsive Media
5. Enhancing Sites for Mobile
6. Managing Resources
Additional resources4m 10s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.