Join James Williamson for an in-depth discussion in this video Testing responsive designs, part of Learning Responsive Design.
Testing is a critical component of any web project, and that's especially true for responsive design.…The trick in testing responsive sites is in accurately testing how your site is going…to look and perform across multiple devices.…Most people test responsive design projects by simply resizing their browser window as…they refine their layouts.…While this type of testing is helpful at giving you immediate feedback, it doesn't accurately…show you how the site will render on mobile browsers, and it ignores performance altogether.…
Thankfully, there are a few tools out there that can help you test your responsive designs.…The first thing that most people want to test when designing responsive layouts is their…media queries and whether or not they're hitting the right breakpoints.…Now, you can resize your browser window to test this, but you're not really getting any…feedback as to the actual trigger points themselves, and it's not exactly a speedy process.…In fact, many designers became so frustrated with this that they created a couple of online…
Author
Released
10/31/2012- 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
Duration
Views
Related Courses
-
HTML Essential Training
with James Williamson5h 54m Beginner -
Git Essential Training
with Kevin Skoglund6h 25m Beginner -
CSS: Page Layouts
with James Williamson8h 57m Beginner
-
Introduction
-
Welcome1m 4s
-
Who is this title for?1m 45s
-
-
1. Introducing Responsive Design
-
What makes sites responsive?2m 37s
-
2. Common Concepts
-
Controlling viewports7m 3s
-
Understanding media queries4m 37s
-
Using fluid grids5m 15s
-
Making images responsive5m 57s
-
Building responsive forms6m 47s
-
3. Responsive Design Strategies
-
Building responsive mockups4m 56s
-
Creating flexible HTML6m 1s
-
Testing responsive designs5m 52s
-
Conclusion
-
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.
CancelTake 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.
Share this video
Embed this video
Video: Testing responsive designs