This Foundation 5 video tutorial will make you faster to learn and to code.
This workshop is a fast-track to getting up to speed with rapid responsive prototyping with the most advanced responsive Framework.
Topics include:
- A complete guide to the responsive grid
- A tour of the numerous CSS components & Key UI elements
- Dynamic features Integration with orbit slider, reveal modal, Accordion, Lightbox..
- Mobile user experience optimization
- A 1-hour walkthrough : from prototype to beautiful design
- Quizzes, Interactive Exercices
Hand-on and project-based, the course will help you :
- Learn the fundamentals of using Foundation
- Start building responsive web pages
- Sharpen your design skills
So, let's get started with Foundation 5!
This video tutorial is the fastest way to get you up and running with Rapid Prototyping, Mobile First & Easy Customization
CSS training table of contents (duration : 2h15m)
-
Getting Started with Foundation 5
- Welcome! free 00:01:21
- Foundation Files & Project resources 00:01:51
- Introduction Responsive Grid 00:01:53
-
Responsive Grid | The Complete Guide
- Basic Grid 00:03:39
- Small & Medium Grids 00:04:26
- Advanced Grid (Nesting) 00:08:35
- Offset Columns 00:04:10
- Centered Columns 00:08:18
- Source Ordering 00:09:10
- Block Grid 00:07:06
-
Responsive Design Project
- Responsive Image Slider (Orbit.js) 00:08:15
- About Us (Panel) 00:01:54
- Content Slider & Equalizer.js 00:10:40
- Video Pop Up (Modal.js) 00:03:51
- Accordion.js 00:03:43
- Portfolio Gallery (clearing.js) 00:03:56
- Interactive and Responsive Contact Form (Alert.js) 00:11:43
- Social Media (Foundation Icons) 00:05:26
-
Mobile Device Optimization
- Interchange Responsive Content 00:06:51
- Adaptive Content | Media Queries 00:05:54
- Responsive Navbar 00:06:25
-
Alternate Design Work
- Tabs Customization 00:03:29
- Team Section Tabs 00:03:50
- Tooltip.js 00:03:01
- Vertical Tabs 00:01:05
- Tabs & Media Queries 00:05:21
- Sources Filesdownload
- Certificate
Instructor : Sandy Ludosky
customers reviews
Questions about this tutorial
-
With which software version is this tutorial compatible with?CSS
-
What is the required level to follow this tutorial ?beginner
