HTML5 & CSS3 Fundamentals: Development for Absolute Beginners

  • 2018-05-09 07:31 AM
  • 75

Want to learn HTML5 and CSS3? Over the course of 21 episodes, our friend Bob Tabor, from, teaches you the fundamentals of HTML5 & CSS3 programming. Tune in to learn CSS3 styles, concepts about webpages, and HTML5 features. Explore HTML5 and get CSS3 training that includes web principles, writing code, and much more! Each concept is broken into its own video so you can search for and focus on the information you need to learn HTML5 and CSS3.

Build Responsive Real World Websites with HTML5 and CSS3 ☞
Beginner Full Stack Web Development: HTML, CSS, React & Node ☞
Build Websites from Scratch with HTML & CSS ☞

Learn Web Design & build beautiful websites with HTML & CSS

SVG & CSS Animation - Using HTML & CSS

HTML and CSS for Beginners - Web Design & Development

Instructors: Bob Tabor, Founder; Clint Rutkas, Microsoft Technical Evangelist; Dan Fernandez, Microsoft Senior Director
1 | Series Introduction
Get course expectations and a brief overview of the CSS3 and HTML5 training to come.
2 | Creating Your First HTML5 Webpage
Warm up your keyboard, and get ready to work. Get fully immersed in what it takes to build an HTML5 webpage.
3 | Styling Your First HTML5 Webpage with CSS3
Apply a CSS3 style sheet to give the new page a simple but attractive appearance.
4 | Understanding the HTML5 You Wrote
Build on what you learned in Lesson 2, as you worked with Bob to create a semantically correct HTML5 page. Take a look at each individual element’s purpose.
5 | Working with Paragraphs and Text
Explore the various semantic meanings of popular HTML5 inline tags useful for marking up text inside of paragraphs, including b, i, small, em, mark, span, and much more.
6 | Defining the Structure of Your Document
Moving beyond the text, learn how to give semantic meaning to the various elements of a webpage using header, footer, aside, nave, h1 through h2, article, section, and more.
7 | Working with Figures and Images
See demonstrations on how to include images and whole figures with captions in your HTML5 webpages.
8 | Working with Lists
In addition to the list style tags we used in our HTML5 pages, learn how to create a semantically rich set of lists for creating ordered and unordered lists, definitions of terms, and more.
9 | Creating Tables
The oft-maligned table still has a semantic purpose in HTML5: to display tabular information. See the many different ways to structure tabular data in HTML5.
10 | Creating Forms
See how to add a rudimentary level of interactivity to your webpages by allowing users to input information via forms. Look at more than a dozen examples.
11 | Form Validation and Other Future HTML5 Form Enhancements
Look toward new HTML5 form features used in Internet Explorer 10 and later. Check out the use of new input elements and attributes for creating richer forms.
12 | Understanding Cascading Style Sheets
In Lesson 3, you worked with Bob to create an external Cascading Style Sheet that provides a simple but attractive aesthetic improvement to the HTML5 webpage. In this module, take the next steps.
13 | CSS3 Font and Text Properties
Focus on the CSS properties specific to modifying font and text properties on HTML5 webpages, and learn about font-family stacks.
14 | CSS3 Color and Background Properties
Find out how to modify the colors and backgrounds of various HTML5 elements using CSS3.
15 | CSS3 List and Table Properties
In Lessons 7 and 8 you learned about Lists and Tables. In this lesson, learn various properties exposed by CSS3 that allow you to add a professional style to your Lists and Tables.
16 | CSS3 Box Properties
Explore the important distinction between inline-display and block-display in HTML5 elements. For block-style elements, it is vital to understand the box model.
17 | Working with CSS3 Font-Face
Learn about working with CSS3 Font-Face. Designers rely on typography to communicate and emote, along with the message of the text itself. The font-face is one more tool that designers can use.
18 | Embedding Video in HTML5
Dive back into HTML5, and examine the basics of the video tag to add progressively downloaded / pseudo-streamed video to your webpages. Explore the various available options.
19 | Working with the HTML5 Canvas
See a simple example of how the HTML5 Canvas works at a high level. The HTML5 Canvas allows JavaScript-savvy developers to draw bitmapped images directly into HTML5 webpages.
20 | Working with SVG in HTML5
Learn about Scalable Vector Graphics, or SVG, which has been a web standard for many years but has gained renewed interest after being included in the HTML5 specification.
21 | Where to Go From Here
Watch as Bob provides a roadmap for topics that can help you take your newfound knowledge much further. Topics include a short history of laying out webpages in HTML and CSS.

Video source via: Channel 9