Reponsive Design Training in London and York

Course Dates

Click below to book your place or call us on 0800 156 0777


RRP: £295.00
Web Special: £295.00

Maximum Class Size

In order to ensure every student gets the most out of the course we have a maximum class size of:

London

8 Delegates

York

5 Delegates

The number and variety of devices designers are dealing with is constantly growing and creating individual sites for each is no longer a viable option.  Responsive design addresses this problem allowing you to create content which adapts to different device sizes, without the need for multiple versions of your site.

Using a range of HTML5 / CSS3 techniques you can create a site which adapts, scales and changes depending on the screen size of the device that is viewing it.  This one day course teaches you the fundamental techniques and best practice of responsive design, allowing you to start building scalable sites which can work effectively across all platforms and remain easy to maintain.

Audience for Responsive Design

You should have attended the Intro to HTML, and HTML5 and CSS3 Getting Started courses or have equivalent knowledge.

Course Duration

One day

Responsive Design Course Overview

What is responsive web design

  • Getting started with html5 and css3
  • Examples of responsive design
  • Viewport testing
  • More html5 and css3 in your design

How to use responsive web design

  • How to create your first responsive design
  • Testing your design
  • Editing your design

Navigation

  • Progressive navigation
  • Responsive navigation

Using media queries

  • What are media queries
  • How to use media queries
  • How to load your media queries
  • Viewport widths
  • Content clipping
  • Gracefully degrading media queries

Layouts

  • Fixed layouts
  • Fluid layouts
  • Proportional layouts 
  • Changing your layout
  • ems vs pixels

CSS  grids

  • creating your grid
  • grid systems
  • building your pages with your grid design
  • grids snd media queries

Images

  • fluid images
  • image scaling
  • specific rules for specific images
  • max-width
  • different images for different screen resolutions

Audio and video

  • inserting audio
  • inserting video
  • responsive audio and video

* responsive design is a relatively new approach to web design and as such the course content may change to accomodate new techniques and technologies that appear and are relevant.