By Chris Converse | Wednesday, December 18, 2013
Simply rearranging your web design across screen sizes isn’t enough to assure a smooth, natural experience for all the devices that will view it. In order to truly optimize the user experience, we must alter the content and behavior as well. This means loading alternate HTML content, suppressing animations, and collapsing navigation for small screens.
Navigation on small screens is collapsed into a single button, which expands into the global navigation when clicked or tapped, providing an optimal experience for small screens.
In this course, we’ll explore altering the user experience based on screen size. This approach will allow us to increase the user experience and download speed for larger screens, while delivering smaller-sized files and targeted experiences for smaller screens. Learn how to combine jQuery with your HTML and CSS to alter experiences across screen sizes.
Loading alternate content
This example shows different HTML content loaded into a web page based on screen size.
Begin learning software, business, and creative skills—anytime, anywhere—with video instruction from recognized industry experts.
Share this article:
You can change your email preferences at any time. We will never sell your email. More info
Thanks for signing up.
We’ll send you a confirmation email shortly.
Sign up and receive emails about lynda.com and our online training library:
Keep up with news, tips, and latest courses with emails from lynda.com.
We've updated our terms and conditions (now called terms of service).Go Review and accept our updated terms of service.