HTML to CSS to Responsive Web Design

To register for this course, please contact CAIT.

Description

Responsive Web Design is a method for designing & developing websites that provide optimal viewing experiences (in terms of reading, navigation, & layout) across a wide range of traditional & mobile devices. In order to fully understand the concepts & code, however, you first need a good grounding in HTML & CSS. This intensive 5-day course provides everything you need: we start with a broad overview of HTML, then continue into a deep dive into CSS, & finish with how to use Bootstrap, the most widely-used responsive framework. Taught by two experienced instructors who have over three decades of web development experience between them, you will learn both principles and real world solutions.

Audience

This course is for all IS and non-IS professionals who are interested in learning the concepts behind Responsive Web Design & how to build responsive websites using Bootstrap.

Prerequisites

There are no prerequisites for this course. Some experience with HTML & CSS will be extremely helpful.

Objectives

• Dive deep into HTML5 and CSS
• Learn to develop web pages the correct way using semantic HTML5 elements for structure and CSS for formatting and page layout
• Understand some of the most important concepts of CSS: inheritance & the Cascade
• Delve into picking & presenting the perfect fonts using CSS
• Discover how to set styles based on the media (such as print) & using media queries (such as minimum width)
• Find out how easy it is to animate objects on webpages using CSS
• Recognize how to present data most effectively in a table or list
• Build HTML forms using form elements like checkboxes, radio buttons, lists, and password boxes
• Learn how to develop responsive websites with Bootstrap, a powerful mobile-first framework

Outline

• Web Dev Intro
• HTML Overview
• CSS Overview
• CSS Selectors
• CSS Data Types
• Fonts & Formatting
• CSS Layout
• Styling Shapes
• Media-Specific Styles
• Animation & Transformation
• Tables & Lists
• Forms
• Responsive Web Design
• Bootstrap

Slides

All the slides for this course are available under a Creative Commons license.

Student Evaluations

Please read selections from evaluations written by students who have taken the course.