Responsive Web Design with HTML5 and CSS3 - Advanced

Learn the SASS CSS Preprocessor, Building a site with php includes, the Foundation 5 CSS Framework, and jQuery Mobile
Rating: 4.1 out of 5 (77 ratings)
5,243 students
Responsive Web Design with HTML5 and CSS3 - Advanced
Rating: 4.1 out of 5 (77 ratings)
5,241 students
By the end of this course you will be able to build a webpage using the CSS Preprocessor SASS
By the end of this course, you will be able to leverage PHP to build a website with reusable code.
By the end of this course, you will be able to use the Foundation 5 framework to build a webpage.
By the end of this course, you will be able to use jQuery mobile to build a site and then redirect handheld traffic to that site.

Requirements

  • You will need web hosting where you can upload and test your PHP files
  • You will need an HTML editor like Dreamweaver
  • It is recommended that you have an image editing program like Photoshop or GIMP
Description

If you have been building responsive websites and you're ready to take your skills to the next level, then this course is for you. This is the third course in this series on Responsive Web Design by Paul Cheney and covers the following topics.

  • Using a CSS preprocessor to build a webpage.
  • Using PHP include() so that you can build a multiple page website and take advantage of reusable code.
  • Using a CSS frameworks and how to build a page using Foundation 5.
  • Using jQuery Mobile and a PHP redirect for handheld devices.
Who this course is for:
  • Advanced Responsive Designers who have a solid foundation in HTML5, CSS3, media queries, responsive images and design.
Curriculum
4 sections • 53 lectures • 4h 0m total length
  • CSS Preprocessor Overview
  • Introduction to SASS
  • Setting up a new project
  • Setting up a basic site in Dreamweaver
  • Using Partials and Import
  • Using Variables
  • Using Nesting
  • Using Mixins
  • Using Extend or Inheritance
  • Using Math Operators
  • Examining a completed SASS page
  • View the Completed Example
  • Overview of Using PHP to Build Multiple Page Websites
  • Overview of Completed HTML5 Template
  • Breaking up an HTML5 Template into Multiple Pieces 1
  • Using Dreamweaver to Build the PHP Files
  • Activating the Menu using jQuery
  • Breaking up an HTML5 Template into Multiple Pieces 2
  • Activating the Menu using pure CSS
  • Adding Analytics Code to your Website
  • View the Completed Example
  • Introduction
  • Getting Started
  • Creating a Basic Grid
  • Creating a Top Bar with Navigation and Search
  • Implementing Responsive Images Loaded Using CSS
  • Creating a Block Grid
  • Creating a Slider
  • Building an Image Thumbnail
  • Exploring Several Buttons
  • Using Tabs to Display Content
  • Creating a Form
  • View the Completed Example
  • Download the jQuery Start Files
  • Demonstration
  • Template Explained
  • Accordian
  • Button Theme
  • Checkboxes
  • Radio Buttons
  • Dialog
  • Fixed Position
  • Flip Switch
  • Slider
  • Grids
  • Icons
  • Navigation Bar
  • Tables
  • Text Input
  • Transitions
  • Custom CSS
  • PHP Redirect for mobile devices
  • View the Completed Example

Instructor
Web Designer and Developer
Paul Cheney
  • 4.2 Instructor Rating
  • 1,403 Reviews
  • 24,521 Students
  • 9 Courses

Paul received his master's degree from Utah State University in Instructional Technology and worked as a civilian for the United States Air Force doing interactive computer-based firefighter training. He and his family then moved to Provo, Utah where he worked at Brigham Young University for five years in the Instructional Technology Center. While there, he was involved in authoring multimedia, digitizing video, training faculty in instructional technology. He then moved with his family to Buena Vista, VA where he joined the faculty at Southern Virginia University. While there he taught digital media courses. Ten years later he returned to Utah where he is now an Assistant Professor at Utah Valley University teaching courses in their Digital Media department in the Internet and Web Technologies degree.