Join James Williamson for an in-depth discussion in this video What makes sites responsive?, part of Learning Responsive Design.
As with all web design, a responsive design starts with HTML.…Clean, well-structured HTML helps create content that is meaningful and easier to manipulate based on context.…Likewise, the care the designer gives when planning the site's semantics in uses of ID…and class attributes can go a long way towards making the site more responsive.…Clear roles for elements and consistent structure make it easier to control how content responds…or displays within a specific design.…
HTML5 also includes a few features that helps sites be more functional across multiple devices.…The new form elements, for example, allow designers to create forms that take advantage…of mobile device interfaces and facilitate making phone calls and sending texts without…requiring extra markup or scripting.…As you would imagine, CSS plays a major role in creating responsive design.…CSS media queries allow us to apply different sets of styles based on factors such as screen…size, orientation, or resolution.…
This allows us to change layout and typography to a design that's more suited to the context…
- What is responsive design?
- Controlling viewports
- Designing for multiple screen densities
- Working with media queries
- Using fluid grids
- Building responsive forms
- Optimizing site performance
- Building responsive mockups
- Developing a content strategy
- Designing for mobile capabilities
- Creating flexible HTML
- Testing responsive designs
Skill Level Beginner
1. Introducing Responsive Design
What makes sites responsive?2m 37s
2. Common Concepts
3. Responsive Design Strategies
Additional resources2m 12s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
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.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.