- Learning Solutions
- Research Library
- Guild Publications
- Sponsored Library
- Online Events Archive
- Conference Archive
- DemoFest Archive
Real-world Responsive Web Design: A Case Study of the mLearnCon Website
mLearnCon 2014 - June 26, 2014
Tiffany Le Brun
The eLearning Guild
Director, Web & Data Strategy
The eLearning Guild
The increase in mobile usage has led to an expectation in consumers to have a seamless experience across all devices. This creates challenges for designers, who now need to design content that works not only on desktops, smartphones, and tablets, but on devices with varying screen sizes within each category. Responsive design is a great solution to the fragmentation of devices across smartphones, tablet, desktop, and more.
In this session you will explore a case study of The eLearning Guild’s efforts to adapt the mLearnCon website template into a mobile-friendly, responsive site viewable across all devices. You will learn the challenges we encountered along the way and how we overcame them. You will discover best practices and methodologies to wireframe, design, and code your own responsive site. You will explore the initial design considerations and key implementation choices and issues, and see some examples of the code changes.
In this session, you will learn:
- The core elements of a responsive design
- How to define a site’s specifications for each breakpoint
- How to optimize design and graphics for user interactivity and experience
- How to utilize media queries, viewport settings, grid system, and flexible images for multiple break points
Novice to intermediate designers and developers.
discussed in this session:
You do not have access to these files. Please log in or join with a free membership to download these files.
Back to Library
Recent Job Postings
- Training Assistant (LMS)
New York, NY, USA
- E-learning Instructional Designer/LMS Specialist wanted
- Training Development Specialist
- Training Developer (Instructional Designer)
Los Angeles, CA/USA
- Distance Education Program Manager