Responsive Web Design

מק"ט: #42586 | משך קורס: 24 שעות אק'

On this course you will learn to create mobile first solutions and responsive pages that adapt to the users device. Learn how to build a cross browser framework for your websites working with current standards and practices. Engage in best practices to create minified, reusable and scalable solutions through good project management and CSS preprocessing and modularization using SASS.

*שדות חובה
PDF version


  • Understand the use of responsive design
  • Design responsive websites for Web & Mobile
  • Get familiar with Foundation
  • Get familiar with SASS

קהל יעד

  • Web Developers
  • Web Designers

תנאי קדם

  • Good knowledge of HTML & CSS
  • Working with HTML5 & CSS3 Features


Media Types and Queries

  • Creating documents for print and other media
  • Introducing CSS3 media queries
  • Starting on the road to multi-device websites


Mobile First Responsive Design

  • Understanding the Mobile First paradigm
  • Understanding mobile devices
  • Responsive navigation and design patterns
  • Understanding the basis of grid based design
  • Rethinking content design
  • Working with multiple devices and resolution


Rapid Prototyping using Foundation

  • Introduction to grid based systems
  • Evaluating the benefit of prototyping
  • Building prototypes

Building a Mobile First User Experience

  • Examining mobile user design patterns
  • Understanding how to deal with reduced screen estate
  • Build mobile ready navigation and pages


Working with Percentage Based Grids

  • Going responsive
  • Using percentages and grids to create structured pages
  • Scaling out


Introducing SASS

  • Nested Selectors
  • Parent References
  • Properties
  • Processing SASS
  • Examining Output
  • SASS Variables


Learning to be DRY

  • Using SASS to strip the unavoidable repetition from your CSS
  • Creating and Referencing SASS Variables
  • Variable scope



  • Reusable SASS programing with Mixins
  • CSS Rules and Mixins
  • Mixin parameters


Modularization and Reuse

  • Using SASS Partials
  • Nested Imports
  • CSS Imports


Working with Compass

  • Installing COMPASS
  • Setting up a COMPASS project
  • Spriting with COMPASS


Cross Browser Strategies

  • Understanding legacy issues
  • Release & Maintenance
  • Management and versioning strategies
  • Improving your coding practices with LINT tools
  • Minimizing, optimizing and reducing header requests