Email Us   Phone : 503-259-0312   
  Home    |    Instructor-led Training    |    Self-Paced Learning    |    Online Training     


Contact Us   -   Why Choose Wintrac   -   Clients    

Courses
ADA
Adobe
Agile
AJAX
Android
Apache
AutoCAD
Big Data
Business Analysis
Business Intelligence
Business Objects
Business Skills
C++ programming
Cisco
Citrix
Cloud Computing
COBOL
Cognos
ColdFusion
COM/COM+
CompTIA
CORBA
CRM
Crystal Reports
Datawarehousing
DB2
Desktop Application Software
DNS
Embedded Systems
Google Web Toolkit (GWT)
IPhone
ITIL
Java
JBoss
LDAP
Leadership Development
Lotus
Machine learning/AI
Macintosh
Mainframe programming
Microsoft technologies
Mobile
MultiMedia and design
.NET
NetApp
Networking
New Manager Development
Object oriented analysis and design
OpenVMS
Oracle
Oracle VM
Perl
PHP
PowerBuilder
Professional Soft Skills Workshops
Project Management
Rational
Ruby
Sales Performance
SAP
SAS
Security
SharePoint
SOA
Software quality and tools
SQL Server
Sybase
Symantec
Telecommunications
Teradata
Tivoli
Tomcat
Unix/Linux/Solaris/AIX/
HP-UX
Visual Basic
Visual Foxpro
VMware
Web Development
WebLogic
WebSphere
Websphere MQ (MQSeries)
Windows programming
XML
XML Web Services
Other
Beginning Responsive Web Development with HTML and CSS
Description

The changing way in which we access the web means that there has never been a greater range of screen sizes and associated user experiences. With these trends driving changes in design, typical desktop-only websites fail to meet even minimum expectations when it comes to style and usability, which can be vital when your website is central to yours or your client's brand.

A responsive web design provides a single solution that looks great on a phone, desktop, and everything in-between, providing the best experience possible for both today's and tomorrow's devices. This course covers every essential aspect of RWD and broader front-end development best practices.

With this course, we have created the definitive guide for all things responsive. We cover the entire gamut of HTML5 and CSS3's new features that help to effortlessly create modern, responsive web designs.
>

Overview

We'll focus heavily on applying the latest techniques provided by HTML5 and CSS3, all in the context of real-world examples. Along the way, you'll discover tips and tricks that make your future designs and development workflow leaner and more maintainable than ever before.

By the time you reach the end, you'll be equipped with the latest cutting edge front-end development skills, ready to develop your very own modern, responsive websites that are pixel-perfect across a wide range of devices.

Scope

We will cover responsive web design using HTML5 and CSS3. Frameworks such as Bootstrap are not in scope of this course. This course will also not teach HTML5 and CSS3 coding. Students are expected to know these languages.

Target Audience:

This course is for web developers who are looking to build modern responsive websites using HTML5 and CSS3. You should have a basic knowledge of HTML and CSS, and should know how to work with browser developer tools.

Course-specific Technical Requirements

Hardware

This course will require a computer system for the instructor and one for each student. The minimum hardware requirements are as follows:
  • Processor: i3
  • Memory: 2 GB RAM
  • Hard disk: 10 GB
  • Projector
  • Internet connection
Software

For this course, we will use the following software:
  • A system with 64-bit Windows 8
  • Atom
  • The latest versions of Google Chrome and Mozilla Firefox
Course duration

3 Days

Course outline

Lesson 1: The Essentials of Responsive Web Design
  • Defining Responsive Web Design
  • Our First Responsive Example
Lesson 2: Media Queries Supporting Differing Viewports
  • Media Query Syntax
  • Combining Media Queries
  • Using Media Queries to Alter a Design
  • Media Queries Best Practices
  • The Viewport Meta Tag
  • Media Queries Level 4
Lesson 3: Fluid Layouts and Responsive Images
  • Converting a Fixed Pixel Design to a Fluid Proportional Layout
  • Flexbox
  • Responsive Images
Lesson 4: HTML5 for Responsive Web Designs
  • HTML5 Markup
  • Semantic HTML5
  • HTML5 Media Elements
Lesson 5: CSS3 Selectors, Typography, and Color Modes
  • Introduction to CSS
  • Facilitating Feature Forks in CSS
  • New CSS3 Selectors and Their Use
  • CSS3 Structural Pseudo-classes
  • More About CSS
  • New CSS3 Color Formats and Alpha Transparency
Lesson 6: Stunning Aesthetics with CSS3
  • Shadows with CSS3
  • Gradients
  • Background Images
  • CSS Filters
Lesson 7: Transitions, Transformations, and Animations
  • CSS3 Transitions
  • CSS3 2D Transforms
  • CSS3 3D Transformations
  • Animating with CSS3
Lesson 8: Conquer Forms with HTML5 and CSS3
  • HTML5 Forms
  • The HTML5 Input Element
  • Styling HTML5 Forms with CSS3
Lesson 9: Using SVGs for Resolution Independence
  • Introducing SVGs
  • Inserting SVGs
  • Extra SVG Capabilities and Oddities

 
About us
Contact us
Careers at Wintrac
Our Clients
Why Wintrac


Register for a free training CD-ROM drawing
Refer a client or instructor and earn $$$


Wintrac Inc.
16523 SW McGwire Ct.
Beaverton OR 97007
 
Wintrac, Inc. All rights reserved.                                                                               Site Map   |   Terms of Use   |   Privacy Policy