Introduction to RWD
Location and Pricing
Most Accelebrate courses are delivered as private, customized, on-site training at our clients' locations worldwide for groups of 3 or more attendees and are custom tailored to their specific needs. Please visit our client list to see organizations for whom we have delivered private in-house training. These courses can also be delivered as live, private online classes for groups that are geographically dispersed or wish to save on the instructor's or students' travel expenses. To receive a customized proposal and price quote for private training at your site or online, please contact us.
In addition, some courses are available as live, online classes for individuals. See a schedule of online courses.
Responsive Web Design Training Objectives
Responsive Web Design Training Outline
CSS: The presentation of the web page
What is CSS3?
CSS frameworks, libraries and preprocessors
Introduction to Responsive Web Design
What is responsive Web design?
Responsive Web design vs. Responsive Web layout
Responsive vs. adaptive layout
Why should I use RWD?
Where did RWD come from?
Who is responsible for RWD?
When should I use RWD?
How do I implement RWD?
Fundamental techniques of RWD
Overview of RWD implementation techniques
Responsive vs. Adaptive vs. RESS
Pros and Cons of the different responsive techniques
How Does RWD Compare With Other Strategies?
Server-side Device Detection
Responsive Web Design with Server Side Components (RESS)
Responsive Web Design fundamentals
Understanding feature detection
Understanding the viewport
The media attribute and media types
What is responsive layout?
A word about elastic layouts
CSS responsive frameworks
What is responsive typography?
Font sizing options
Working with ems
Working with rems
Working with viewport sizes
Creating type with optimal characters per line
What are Responsive Images?
Basic Image Terminology
Issues Surrounding Responsive Images
Graphic design and art direction
The <picture> element
The <source> element
The srcset attribute
Cropping images using media queries
Using the CSS image-set() function
Media query for high-resolution images
HiSRC: a jquery plug-in approach
js: an HTML <picture> element polyfill
Scalable Vector Graphics (SVG)
Third Party server solutions
What are responsive tables?
Responsive table techniques
Hiding table data
Turning table columns into rows
Introduction to CSS3
What is CSS3?
Using CSS3 backgrounds and shadows
All students receive a copy of PACKT's Responsive Web Design with HTML5 and CSS3 and related courseware.
Software needed for each student PC: