HTML5 and CSS3 - Essential Training

Learn HTML5 / CSS3 and how to incorporate markup to build standards-compliant and forward-thinking responsive web sites.

4.45 (246 reviews)
Udemy
platform
English
language
Web Development
category
instructor
HTML5 and CSS3 - Essential Training
746
students
18.5 hours
content
Dec 2018
last update
$19.99
regular price

What you will learn

Know what powers the Web including HTML, CSS, and JavaScript.

Use free web development tools like Aptana Studio, Atom, Brackets, and more.

Understand every HTML5 tag and their associated attributes.

Work with tables, images, links, and lists.

Work with advanced structuring techniques using HTML5 and CSS3.

Use grid layouts like 960.gs to aide in designing a site.

Work with HTML5 section elements and CSS3 to structure a web site.

Format web pages using CSS3.

Create responsive layouts using CSS3 Media Queries.

Use responsive frameworks like Skeleton to enhance workflow.

Make a navigation menu responsive.

Build HTML5 forms and use native validation to handle data input.

Incorporate video and audio using HTML5 tags.

Work with Geolocation, Drag and Drop, Web Storage, and more.

Incorporate Web Fonts and work with the Canvas drawing API.

Description

In HTML5 and CSS3 - Essential Training, professor, author, trainer, and web developer Zak Ruvalcaba delves into HTML5 and demonstrates how to incorporate the language’s markup to build standards-compliant and forward-thinking responsive web pages and applications. You learn the basics as well as advanced topics in HTML5 and CSS3 such as the reason for semantic markup, how to build traditional page layouts using DIV tags and CSS, how to build forward-thinking semantic layouts using HTML5 section elements and CSS3, how to make a page responsive and backward compatible, and how to work with HTML5 forms, offline support, geolocation, audio and video, graphics with JavaScript and canvas, communication APIs, web storage, and more.

Content

Introduction to Web Development and Associated Technologies

Introduction
Web Architecture
The Core 3: HTML
The Core 3: CSS
The Core 3: JavaScript
The World Wide Web Consortium (W3C)
Semantic HTML5
Basic Structure of a Web Page
HTML Syntax
Browsers to Download
Creating a Project, File Naming, and Folder Structuring
Using Brackets to Author Web Pages
Creating your First Web Page
Validating your First Web Page

Semantic Structure and Inline Tags

Introduction
The Structure of a Tag
Global Attributes
Section Elements
Section Tags
Heading Tags
Grouping Tags
Inline Tags (Part 1)
Inline Tags (Part 2)
Inline Tags (Part 3)
Lab 1
Quiz 1

Tables, Lists, and Images

Introduction
Working with Tables (Part 1)
Working with Tables (Part 2)
Lab 2
Working with Lists
Lab 3
Working with Images
Lab 4
Quiz 2

Working with Links

Introduction
Working with Links
Attributes for Links
Creating a Link for an Image / Text
Creating a Link to an Email Address or Phone Number
Creating a Link to a Placeholder
Working with Image Maps
Quiz 3

Cascading Style Sheets Part 1 - Introduction

Introduction
What is CSS?
Why Should I Use CSS?
How CSS Works
Defining Styles
Selector Types (CSS Level 1)
Selector Types (CSS Level 2)
Lab 5: CSS Level 1 Selectors
Lab 6: CSS Level 2 Selectors
Selector Types (CSS Level 3)
Lab 7: CSS Level 3 Selectors
Common Font Properties
Common Background Properties
Common Block Properties
Common Box Properties
Common Border Properties
Common List Properties
Common Positioning Properties
Lab 8: Formatting the Vecta Corp. Site

Cascading Style Sheets Part 2 - Grid Systems, Layout, and Positioning

Introduction
Grid Systems: What is a Grid?
Grid Systems: History of Grids in Design
Grid Systems: Why Should I Use Grids?
Grid Systems: How Grid Systems Work in Web Design
Lab 9: The 960 Grid System
How to Float and Clear Elements
How to Use CSS3 to Create Text Columns
How to Position Elements Using Positioning Properties
Lab 10: Structuring the Vecta Corp. Site using a Traditional Approach
Quiz 4

Cascading Style Sheets Part 3 - Advanced CSS Concepts

Introduction
Valuable Third-Party Tools
Working with Web Fonts: The @font-face selector
Working with Web Fonts: Google Web Fonts
Sprites
Navigation Menus
Accordions
Transitions
Transforms
Animations
Filters
Lab 11: An Advanced Web Page Layout
Lab 12: Making the Web Page Backward Compatible
Lab 13: Designing a Style Sheet for Printers
Quiz 5

Cascading Style Sheets Part 4 - Flex Box Layout

Introduction
What is the Flex Box layout?
Layout Terminology
Layout Properties
Your First Flex Box Layout
Setting Flex Item Dimensions
Aligning Flex Items Horizontally
Aligning Flex Items Vertically
Wrapping and Aligning Wrapped Items
Changing the Order of Flex Items
Lab 14: Creating a Web Page Using Flex Box Layout

Cascading Style Sheets Part 5 - Grid Layout

Introduction
Grid Terminology
Grid Container and Grid Items
Your First Grid Layout: Using Template Areas
How to Align Grid Items and Grid Tracks
Grid Layouts Using Numbered Lines
Grid Layouts Using Named Lines
Grid Layouts Using the 12 Column Grid Concept
Lab 15: Creating a Web Page with Grid Layout
Lab 16: Creating an Advanced Grid Layout
Lab 17: Creating a Grid Layout with a Call To Action
Lab 18: Creating a Grid Layout with a Fixed Sidebar
Lab 19: Creating a Grid Layout with a Headline and Gallery
Lab 20: Creating a Grid Layout with Featured Products

Responsive Web Design

Introduction
Responsive Web Design
UX of the Modern Web
Layouts
Type
Images
Tables
Flat Design
Media Queries
Testing
Resources
Lab 21: A Responsive Website Design (Part 1)
Lab 22: A Responsive Website Design (Part 2)

Forms

Introduction
Forms: Stepping Stones to the Dynamic World
Creating a Form
Individual Form Tags
Grouping Forms with Fieldset and Legend
Textboxes
Checkboxes and Radio Buttons
Buttons
Dropdown Lists and List Boxes
Multi-Line Textboxes
File, Hidden, and Image Fields
Accessibility and Usability with Label
New HTML5 Tags
The Constraint Validation API: Native Data Validation
Quiz 6

Audio and Video

Introduction
Audio and Video in HTML5
Media Types
Codecs
Audio and Video Support in Current Browsers
The <video> and <audio> Tags
Adding Audio and Video to a Web Page
Making Audio and Video Backward Compatible
Quiz 7

Reviews

Olena
December 29, 2020
I highly recommend this course for beginners. I have not had any experience in web development or programming before, but after completing this course I am able to create a fully functional nice looking web site. I found this course incredibly good organized. The amount of the information was just enough for me. I also found all the provided examples and labs extremely helpful. I am also extremely glad that I purchased the book Murach's HTML5 and CSS3, 4th Edition (Ann Boehm, Zak Ruvalcaba). It is a particularly good addition to this Video course. It helped me a lot to complete my assignments successfully.
Yury
December 17, 2020
Awesome course. Highly recommend. This course is focused on results. Lots of practice and hands-on exercises. Good start for anybody who wants to learn CSS and HTML the right way. Teacher explanations are very clear and straight to the point. I was trying YouTube at first, but this course is more structured and will take you step by step without trying to push everything at once.
Lauren
December 15, 2020
Class was easy to follow and understand. The Labs were super helpful and added a great interactive element to connecting the dots from the courses/learning. The quiz's are helpful in understanding how much I understood and gave me some great insight into which videos I needed to review.
Yaling
December 15, 2020
This course really helped me to get started with front web programming. Topics were well organized and the labs were very helpful to understand each concept!
Jorge
December 15, 2020
I found this course extremely useful and effective to deeply understand HTML and CSS with all details and programing possibilities. I highly recommend this course specially for new programmers interested in having a complete understanding of HTML and CSS.
Fauzia
December 11, 2020
This course is very well constructed. It provides pretty solid fundamental knowledge about HTML and CSS. The lectures are clear and to the point. I would recommend this as the first stop for anyone who wants to learn HTML and CSS. Zak is an excellent instructor.
Shawn
December 6, 2020
This course was extremely educational and achieved its intended purpose exceptionally. I'm very satisfied with the learning material, well paced instructions, and the course labs to to go along with them. Would highly recommend this instructor and Udemy Course! A+++
Devon
December 4, 2020
This was a great step by step tutorial course. I've tried others before this, but this one really dives into the fundamentals teaching semantics and proper coding techniques. After learning about HTML the course dives into CSS head first. I'm glad I've had the opportunity to use this in my learning sequence.
David
December 3, 2020
I highly recommend this well-organized course. The chapter structure of each lecture makes it easy to go back and review specific topics. The quizzes at the end of most lectures are helpful and clearly point out which chapters should be reviewed. The instructor uses many examples throughout the lectures and the lab sections are the longest chapters. I think the key to use this course to learn how to use HTML5 and CSS3 to build responsive websites is to go through the labs with the support files at the end of the lectures.
Karen
December 3, 2020
This course is amazing for beginners like me, the history introduction at the beginning of each section gave me the landscape and motivation to learn the technical skills. I highly recommend to the people who are keen to build solid fundamental knowledge of web development.
Alfiia
December 3, 2020
It is a great course. The content is very good and easy to understand. Having no prior experience from this course, I was able to learn about HTML5 tags and attributes and then how to format webpages with CSS3. I understood how to work with Grid, how to use Media Queries, Skeleton, and many other useful things.
Isabel
December 1, 2020
I thoroughly enjoyed taking this course on HTML5 and CSS3. The course was easy to understand and helped me further my comprehension of both of these coding language. The course was also well organized, and I really liked how it was broken down into different modules with lessons covering relevant topics within each module. The optional quizzes at the end of each module were also helpful for testing my knowledge of the material. I would definitely recommend this course to anyone interested in front-end web development who wants to improve their coding skills.
Sara
September 22, 2020
This is a really great course for learning HTML5 and CSS3 as a beginner. The instructor starts with the basics and builds systematically through the course. The fundamentals are well-organized and easy to reference, and the examples/labs at the end of each module reinforce the lessons with practical applications that are helpful and easy to follow along.
Sabrina
September 20, 2020
Great course! Thoroughly organized each sections with detailed explanation of tags and attributes, good practical and applicable examples, and updates in modern web development. I did not know a thing about HTML, CSS, and web development coming into the course, and after going through the course, I have a good grasp of coding and a deeper appreciation to front end web development. Take this class with Zak, work through the assignments, and learn by doing the assignments, and acquire useful skills in building a website using HTML, CSS, and useful frameworks and plugins.
Theresa
September 11, 2020
I was a beginner at the start of the course and now have a solid foundation moving forward. I feel much more confident when speaking about web design and now I can create one with more advanced techniques. The labs were very helpful and gave easy to follow step by step instructions. I would recommend this course.

Charts

Price

HTML5 and CSS3 - Essential Training - Price chart

Rating

HTML5 and CSS3 - Essential Training - Ratings chart

Enrollment distribution

HTML5 and CSS3 - Essential Training - Distribution chart
1124764
udemy ID
2/23/2017
course created date
10/17/2020
course indexed date
Bot
course submited by