Responsive Web Design Video Tutorial Course

CareerVision Training

£ 75 - (Rs 6,482)
VAT incl.

Important information

  • Training
  • Beginner
  • Distance learning
  • Duration:
  • When:
  • Delivery of study materials

• Format: DVD-ROM
• Duration: 4.5 Hours (113 lessons)
• Instructor: Geoff Blake
• Platform: Windows PC or Mac
• Date Released 13-05-2013

In this Responsive Web Design training course, expert author Geoff Blake shows you how to create custom CSS and HTML so that your web site responds to differing screen sizes. With mobile and tablet web traffic increasing by leaps and bounds every day, all web designers should know how to create breakpoints and custom CSS layouts to adapt their designs to varying device resolutions. You will learn how to setup your external style sheets for three different resolutions, and how to customize your layouts for each of those. This training video will teach you how to deal with navigation and graphics as well as text and other layout features, making them responsive.

Important information

Requirements: This is a DVD Video Tutorial Course which is shipped to you. Work through the video tutorials at your own pace. If you have the software you can practice along with the instructor using the same exercise files as the instructor which are included on the DVD. The narrated training videos demonstrate the key tools and professional techniques helping you to work faster and smarter. All the concepts of each application are explained clearly and precisely. The DVD works on PC and Mac. You can jump to and from lessons and work at your own pace.


Where and when

Starts Location
Distance Learning

What you'll learn on the course

Design techniques
Web Designer
HTML layout
CSS Layouts

Course programme

01. Getting Started
0101 Welcome
0102 Responsive Design And Targeted Resolutions
0103 A Look At What We Will Build
0104 Tools Of The Trade
02. Using Dreamweaver CS6 For Responsive Design
0201 Getting Started With Fluid Grid Layouts
0202 Touring The Fluid Grid Layout View
0203 A Look At Dreamweavers Style Sheet
03. Getting Set Up For Responsive Design
0301 Setting Up The External Style Sheet
0302 Connecting The Style Sheet And Testing
0303 Setting Up The Low Resolution Media Query
0304 Setting Up The Medium Resolution Media Query
0305 Testing The Medium Resolution Media Query
0306 Setting Up The High Resolution Media Query
0307 Testing The High Resolution Media Query
04. Building The HTML Structure
0401 Building The Header Structure
0402 Building The Main Navigation Menu
0403 Setting The Body Structure
0404 Building The News Feed Area
0405 Setting The Footer Structure
05. Wireframing The High Resolution Layout
0501 Getting Started With The High Resolution Layout
0502 Applying Formatting To The Master Container
0503 Setting Properties For The Header
0504 Formatting The Main Navigation Menu
0505 Formatting The Slideshow
0506 Setting Up The Content Boxes
0507 Applying Formatting To The News Feed
0508 Finishing Off With The Footer
06. Wireframing The Medium Resolution Layout
0601 Setting Up The Medium Resolution Layout
0602 Formatting The Header
0603 Formatting The Navigation Menu
0604 Applying Formatting To The Slideshow
0605 Setting The Content Box Formatting
0606 Adjusting The News Feed
0607 Finalizing With The Footer
07. Wireframing The Low Resolution Layout
0701 Getting Started With The Low Resolution Layout
0702 Formatting The Layout Header
0703 Adjusting The Main Navigation Menu
0704 Formatting The Content Boxes
0705 Applying Formatting To The News Feed
0706 Finishing Up With The Footer
08. Initial High Resolution Formatting
0801 Fixing The Menu Spacing
0802 Getting Started With The High Resolution Formatting
0803 Applying Formatting To The Navigation Menu
0804 Formatting The Slideshow
0805 Formatting The Content Box
0806 Applying Formatting To The News Feed Area
0807 Getting The Footer Text Formatted
09. Initial Medium Resolution Formatting
0901 Getting Started With The Navigation Menu
0902 Formatting The Slideshow And Content Boxes
0903 Applying News Feed Formatting
0904 Finishing Up With The Footer
10. Initial Low Resolution Formatting
1001 Formatting The Main Navigation Menu
1002 Getting The Content Boxes Under Control
1003 Formatting The News Feed Area
11. Adding Graphics
1101 Getting Started With The Header
1102 Setting Up And Adjusting The Slideshow
1103 Adding A Background Graphic To The Content Boxes
1104 Adding Content Box Header Graphics
1105 Controlling The Content Box Graphics Via CSS
1106 Implementing The Slideshow - Part 1
1107 Implementing The Slideshow - Part 2
1108 Implementing The Slideshow - Part 3
12. Wrapping Up
1201 Thanks For Watching
1202 About Geoff Blake