Home » Computer Science » HTML
No. of
Lectures
Duration
(hrs:min)
20
9:14

HTML5 Online Training Prof. Brenton Strine, M.S.

4.4
221 ratings • 21 reviews
  • Level Beginner
  • 20 Lessons (9hr : 14min)
  • 2,709 already enrolled!
  • Audio: English
  • English

Professor Brenton Strine’s HTML5 course is aimed at both budding programmers and veteran coders who want to build websites. In each lesson, Brenton begins with basic concepts and then spends the majority of the lesson writing actual code and seeing its interaction with the operating environment and browser.

Table of Contents

Section 1: HTML
  Your First Web Page 17:01
   Intro 0:00 
   World Wide Web 0:23 
    Introduction to HTML 0:25 
    Looking at Source Code 0:53 
   HTML5 1:58 
    HTML5 Specification 1:59 
   Creating a Web Page 4:10 
    What You Will Need to Create a Web Page 4:11 
    Example: Basic Web Page 4:40 
   Example: Creating a Web Page 5:46 
    HTML Elements 6:33 
    Adding a Title 7:08 
    Main Body 7:48 
    First Level Heading 8:23 
    Adding an Image 8:42 
    Paragraph 9:09 
    Adding a List and URLs 11:13 
    Footer 14:09 
    CSS: Styling 16:02 
  Web Basics and Web History 32:23
   Intro 0:00 
   The Web 0:56 
    Overview of the Web 0:58 
   The Web Page 2:39 
    Overview of the Web Page 2:40 
   Web Technologies 4:45 
    Overview of Web Technologies 4:46 
   The Web Today 9:22 
    The Web Today 9:23 
   What is HTML 11:22 
    HyperText Markup Language 11:23 
   The Creation of the Internet 12:40 
    History of the Internet 12:41 
   Developments in HTML 14:10 
    The Birth of HTML 14:11 
    Early Problems 15:35 
   Early Browsers 16:24 
    History of Early Browsers 16:25 
   NCSA Mosaic 17:55 
    NCSA Mosaic 17:56 
   The Browser Wars Begin 19:39 
    History of the Browser Wars 19:40 
   Casualties of War 22:27 
    Results of the Browser Wars 22:28 
   HTML 4 Stabilization 25:31 
    History and Overview of HTML4 25:32 
   Modern Browser Developments 27:27 
    Modern Browsers 27:29 
   HTML5 30:57 
    Overview of HTML5 30:58 
  Web Development Tools 26:28
   Intro 0:00 
   Browsers 0:17 
    Introduction to Browsers 0:18 
    Example: Browsers 2:35 
   Firefox Add-ons 3:14 
    Firefox Browser 3:15 
    Example: Firebug Add-ons 3:54 
    Example: Web Developer Toolbar and ColorZilla 7:51 
   Domain Names and Hosting 10:23 
    Overview of Domain Names and Hosting 10:24 
    Your Own Domain 11:03 
   Installing a Local Web Server 12:42 
    Installing a Local Web Server 12:43 
    Apache Web 13:29 
   WYSIWYG Editors 15:56 
    Introduction to WYSIWYG Editors 15:57 
   Content Management System 18:31 
    How Content Management System Works 18:32 
    Example: WordPress 20:00 
   File Transfer Protocol 22:26 
    File Transfer Protocol 22:27 
  HTML Elements and Attributes 21:50
   Intro 0:00 
   Proper use of Elements and Attributes 0:14 
    Elements and Attributes 0:16 
    Example 1:06 
   Normal HTML Elements 2:00 
    Start Tag, Content, and End Tag 2:02 
    Example: Warning! 2:34 
   Void HTML Elements 3:23 
    Self-Closing Tags 3:24 
    List of Void Elements 4:04 
    Example: Line Break 5:00 
   HTML Comments 6:13 
    Purpose of Comment Tags 6:14 
    Example: Comment Tags 6:50 
   Attributes 7:25 
    Properties of Attributes 7:27 
    Example: Attributes 7:39 
    Example: Whitespace 10:22 
   HTML Character Codes 12:05 
    Character References 12:07 
    Example: Registered Trademark Symbol 12:35 
    Example: Using Character References 13:23 
   Example: Start Tag and End Tag 15:57 
   Example: Self-Closing Tag 16:37 
   Example: Attributes 17:37 
   Example: Proper use of Elements and Attributes 19:02 
   Example: Comment 20:09 
   Example: Whitespace 20:46 
  Essential Tags Part 1 41:42
   Intro 0:00 
   Document Structure Tags 1:13 
    Document Structure Tags and Example 1:14 
   Layout Tags 3:24 
    Layout Tags 3:26 
    Example: Layout Tags 7:48 
    Example: Layout Tags 11:28 
    Example: Layout Tags 13:17 
    Example: Layout Tags 14:22 
   Text Level Tags 17:22 
    Text Level Tags 17:23 
    Example: Text Level Tags 17:48 
   Grouping Content Tags 24:23 
    Grouping Content Tags 24:24 
    <p> Tag 24:45 
    <hr> Tag 25:31 
    <figure>, <figcaption>, and <blockquote> Tag 26:14 
    <div> Tag 26:58 
    Example: Grouping Content Tags 27:28 
   Embedded Content Tags 33:12 
    Embedded Content Tags 33:13 
    Example: Embedded Content Tags 35:39 
  Essential Tags Part 2 24:20
   Intro 0:00 
   Simple Tables 0:17 
    Simple Tables 0:19 
    Example: Simple Tables 2:31 
   Semantic Tables 5:11 
    Semantic Tables 5:14 
    Example: Semantic Tables 6:24 
   Simple Lists 8:14 
    Simple Lists 8:18 
    Unordered List 8:36 
    Ordered List 8:42 
    Example: Simple Lists 9:37 
   Definition Lists 14:08 
    Definition Lists 14:09 
    Example: Definition Lists 15:21 
   Forms 17:11 
    Forms 17:12 
    Example: Forms 17:52 
  Markup Language 29:38
   Intro 0:00 
   HTML 1 Through 3.2 0:13 
    Period of Rapid Growth of HTML 0:14 
   Tag Soup 2:03 
    Definition of Tag Soup 2:04 
    Example: Tag Soup 3:00 
    Example: Tag Soup and Valid Doctype 4:45 
   HTML 4.01 5:26 
    Overview of HTML 4.01 5:27 
    Three Flavors of HTML 4.01: Strict, Transitional, and Frameset 6:05 
   XHTML 1 7:19 
    Overview of XHTML 1 7:20 
    Example: XHTML 1 9:20 
   XHTML1 Syntax 11:48 
    Lower Case Rule 11:49 
    Closed Elements Rule 12:25 
    Encased in Quotes Rule 14:18 
    Boolean Attributes May Not Be Minimized 14:35 
    Correct Nesting is Enforced 15:29 
   The Problem with XHTML 16:15 
    Problem with XHTML 16:16 
   XHTML 2 19:22 
    Overview of XHTML 2 19:23 
   HTML 5 20:43 
    Overview of HTML 5 20:44 
   Validating 22:44 
    Validators 22:45 
    Example: W3C Markup Validation Service 25:26 
  Page Structure and Meta-data Elements 32:50
   Intro 0:00 
   The Doctype 0:12 
    Doctype 0:13 
    Example: Doctype 1:25 
   The Root Element 1:57 
    Root Element 1:58 
    Example: Root Element 2:45 
   The Head Element 3:38 
    Head Element and Body Element 3:39 
    Example: Head Element and Body Element 5:06 
   The Head Element 5:42 
    Head Element vs. Header Element 5:47 
   The Title Element 6:51 
    Title Element 6:52 
    Example: Title Element 7:54 
   The Base Element 9:00 
    Base Element 9:03 
    Example: Base Element 9:42 
   The Link Element 14:07 
    Link Element: rel, type, and href 14:08 
    Example: Link Element 15:13 
   The Meta Element 17:54 
    Meta Element: charset, name, and http-equiv 17:55 
    Example: Meta Element 21:00 
   The Style Element 23:35 
    Style Element 23:37 
    Example: Style Element 24:40 
  Text-Level Semantics 30:13
   Intro 0:00 
   Text Level Semantics 0:06 
    Paragraph Level 0:07 
   The <a> Element 2:23 
    Definition of the <a> Element 2:25 
   The <em> Element 3:25 
    Definition of the <em> Element 3:26 
   The <strong> Element 6:50 
    The <strong> Element 6:51 
   The <small> Element 8:35 
    The <small> Element 8:36 
    Example of <small> Element 10:19 
   The <cite> Element 10:55 
    The <cite> Element 10:56 
    Example of <cite> Element 12:32 
   The <q> Element 12:45 
    The <q> Element 12:46 
    Example of <q> Element 13:34 
   The <abbr> Element 15:35 
    The <abbr> Element 15:36 
    Example of <abbr> Element 16:41 
   The <dfn> Element 17:03 
    The <dfn> Element 17:04 
    Example of <dfn> Element 18:01 
   The <time> Element 19:11 
    The <time> Element and Example 19:12 
   The <code> Element 21:18 
    The <code> Element 21:19 
    Example of <code> Element 23:00 
   The <sub> and <sup> Elements 23:31 
    The <sub> and <sup> Elements 23:32 
    Example of <sub> and <sup> Elements 23:50 
   The <i> Element 24:51 
    The <i> Element and Example 24:52 
   The <b> Element 27:16 
    The <b> Element 27:17 
    Example of <b> Element 29:07 
  Heading and Sectioning 23:39
   Intro 0:00 
   Heading Elements 0:06 
    Heading Tags 0:07 
   Heading Rules 1:13 
    Heading Rules and Example 1:35 
   Sectioning Roots 5:39 
    Sectioning Roots 5:41 
   Sectioning Contents 6:25 
    Sectioning Content Elements 6:27 
   Section Wrapping 7:40 
    Section Wrapping 7:41 
    Example: Section Wrapping 10:10 
   Real World Example 1 15:36 
  Forms 47:51
   Intro 0:00 
   Form Terminology 0:23 
    Form 0:24 
    Control 0:43 
    Control Name and Control Label 1:09 
    Input Type and State 1:52 
   Form Controls 2:20 
    Button: Submit and Reset 2:32 
    Radio 3:37 
    Checkbox 4:00 
    Select Menu 4:05 
    Textarea 4:28 
    Various Input Types 4:38 
   Example: Basic Controls of Form Element 7:05 
   Example: Buttons 18:20 
   Example: Additional Controls 20:56 
   Example: Special Input Types 27:55 
   Example: Date and Time Control 33:40 
   Example: Create Your Own Control 37:32 
   Example: Placeholder Text 39:10 
   Example: Datalist 41:43 
   Example: Sizing and Input Containment 42:16 
   Example: Select Modification 42:51 
   Example: Required Attribute 44:41 
  Links 36:41
   Intro 0:00 
   URIs and URLs 0:23 
    Definitions of URL and URI 0:36 
    Differences Between URL and URI 0:42 
    Example: URI and URL 1:14 
   Typical URI Construction 2:33 
    Domain and Subdomain 2:34 
    Protocol 4:18 
    IP Address 5:05 
   Typical URI Construction 5:32 
    Second Level Domain 5:33 
    Port 6:07 
    Foldernames 6:46 
   Typical URI Construction 8:06 
    Filename and File Extension 8:08 
   Typical URI Construction 10:38 
    Name/ Value Pairs 10:40 
    Internal Anchors 11:45 
   Typical URI Construction 12:30 
    Example: URI Construction 12:31 
   Relative and Absolute URIs 14:20 
    Relative and Absolute URIs 14:22 
    Example: Relative and Absolute URIs 18:32 
   Link States 24:15 
    Link States 24:16 
    Example: Link States 25:18 
   Block Level Links 27:02 
    Example: Block Level Links 27:03 
   Bookmark Links 29:18 
    Bookmark Links 29:20 
    Example: Bookmark Links 30:15 
   Attributes 32:06 
    href and target 32:20 
    rel, media, hreflang, and type 33:18 
  Embedded Content 46:05
   Intro 0:00 
   Embedding Image 0:22 
    Embedding an Image 0:25 
   Image File Formats 3:38 
    Image Format: Jpg 3:42 
    Image Format: Png 4:13 
    Image Format: Gif 4:40 
    Compression 6:05 
    Image Format: Precise Lines and Fewer Colors 8:38 
    Animated Gif 10:49 
    Alpha Transparency Png 11:09 
   Embedding Audio 12:52 
    Old Way of Embedding Audio 13:00 
    New Way of Embedding Audio 14:54 
    Example: Adding Buttons 20:04 
    Message for Users 26:36 
   Audio Attributes 27:46 
    Control 28:29 
    Autoplay 28:44 
    Loop 29:36 
    Preload 30:40 
   Embedding Video 32:00 
    Embedding Video 32:11 
    Controls 34:22 
    Poster Attributes 36:01 
    Video Formats 37:36 
    Solving Formatting Problem 39:26 
  The Canvas Element 19:25
   Intro 0:00 
   Creating the Element 0:38 
    What is the Canvas Element? 0:39 
    HTML and Canvas Element 1:48 
    Example: Canvas Element 3:23 
   Creating the Canvas in JavaScript 5:13 
    getContext() Method 5:17 
    Checking Browser Support with the getContext() Method 6:00 
    Example: Creating the Canvas in JavaScript 7:31 
   Drawing in the Canvas 10:13 
    Methods for Drawing in the Canvas 10:14 
    2d Context 10:58 
    Example: Creating Drawing in the Canvas 11:39 
    Example: Adding an Image and Texts 15:30 
    Example: Advance Canvas Element 17:31 
  Content Models 29:08
   Intro 0:00 
   The HTML 4.01 Content Model 0:16 
    Block Elements and Inline Elements 0:18 
    Example: Block Elements and Inline Elements 1:18 
    W3C Markup Validation Service 3:28 
   The HTML5 Content Model 6:21 
    Overview of HTML5 New Content Categories 6:22 
   Flow Content 8:02 
    Specification for Content Models 8:05 
    Flow Content 9:41 
    Example: Flow Content Elements 10:40 
    List of Flow Content 11:35 
    BlockQuote Element 11:50 
   Sectioning Content 13:19 
    Introduction to Sectioning Content 13:20 
   Heading Content 14:06 
    Heading Content and hgroup Element 14:07 
   Phrasing Content 16:56 
    Attributes of Phrasing Content 16:57 
    Anchor Element in Phrasing Content 17:28 
   Embedded Content 19:33 
    Attributes of Embedded Content 19:34 
    No Content 19:53 
    Transparent Content 20:38 
    Source Elements and Param Elements 21:15 
   Interactive Content 24:16 
    Interactive Content Elements 24:17 
    Button Element 25:57 
  The DOM 13:10
   Intro 0:00 
   The DOM 0:26 
    Document Object Model 0:27 
   The DOM Tree 0:55 
    DOM Trees 0:56 
    Example: DOM Tree 1:31 
    Vocabulary: Tree, Node,Branch, Parent, Child 2:15 
   Exploring the DOM 3:13 
    Example: Built-in Browser Inspection and Firebug 3:15 
    Example: Manually Exploring the DOM 6:01 
    JavaScript 7:28 
   DOM Navigation Techniques 7:55 
    DOM Navigation Techniques 7:56 
  Favicons 13:14
   Intro 0:00 
   Favorite Icons 0:08 
    Function of Favorite Icons 0:09 
   Bowser Support 1:10 
    Browser Support 1:13 
    Location in Browsers 1:46 
   Implementation Methods 2:04 
    Implementation Methods for Favorite Icons 2:05 
    Favicon and Apple Mobile Devices 4:51 
   Creating the Icon 6:13 
    How to Create the Icon 6:14 
   Favicon Resources 9:10 
    Websites for Icon Creation and Conversion 9:11 
    Programs for Icon Creation and Conversion 11:50 
  Embedding Flash and Other Objects 15:07
   Intro 0:00 
   Flash and other Plug-ins 0:41 
    Main Problems with Flash 0:44 
    Benefits of Flash 2:02 
   Embedding Flash: the Old Way 2:57 
    The Old Way to Embed Flash 2:58 
   Embedding Flash: the Satay Method 6:42 
    Satay Method 6:43 
   Embedding Flash: HTML5 9:28 
    How to Embed Flash in HTML5 9:29 
   Embedding Flash Directly in <video> 11:39 
    Embedding Flash Directly in Video Element 11:40 
   Review of Embedding 13:24 
    Image Elements 13:39 
    Video, Audio, and Canvas Elements 13:44 
    Embed Elements 13:53 
    Object Elements 14:04 
  Offline Cache 19:53
   Intro 0:00 
   Purpose 0:47 
    Purpose of Offline Cache 0:48 
   The Appache 2:06 
    Attributes of Appcache 2:07 
   The Manifest File 3:22 
    Manifest File 3:23 
    Example of Manifest 3:32 
    Section Headers: Cache, Fallback, and Network 4:21 
   Server-Side Considerations 5:17 
    text/cache-manifest MIME-type 5:18 
    Other Server-Side Considerations 5:41 
    ExpiresActive On and ExpiresDefault 'access' 6:07 
   Example: Offline Cache 1 7:44 
   Example: Overwriting Files 11:09 
   Example: Wild Cards for Network 14:58 
   Example: Offline Cache 2 16:06 
  Web Development Principles 26:47
   Intro 0:00 
   Interoperability 0:36 
    Interoperability of Web Development 0:37 
   Interoperable Websites Should Work 3:05 
    Qualities of Interoperable Websites 3:06 
   Backward Compatibility 5:52 
    Compatibility With Older Technology 5:53 
    Example: Meta Tag 9:07 
   Forward Compatibility 9:33 
    Advancement in Technology 9:34 
   Accessibility 10:11 
    Accessibility of Content 10:12 
    Semantic Code 11:43 
    Example: Where Will This Link Take You? 13:56 
   Graceful Degradation 14:59 
    Graceful Degradation or Fault Tolerance 15:00 
    Types of Degradation 16:35 
   Progressive Enhancement 18:36 
    Progressive Enhancement 18:37 
   Future Detection and Browser Sniffing 21:05 
    Future Detection Versus Browser Sniffing 21:06 
    Example: Email Input Type 23:39 
   Tim Berners-Lee's Quote 26:20 

Duration: 9 hours, 14 minutes

Number of Lessons: 20

Professor Brenton Strine’s HTML5 course is aimed at beginning programmers looking to build their first web page, but also goes in-depth enough into advanced features to satisfy coding veterans. HTML5 is the perfect foundation for other Educator courses such as CSS, JavaScript, and AJAX.

Additional Features:

  • Free Sample Lessons
  • Closed Captioning (CC)
  • Downloadable Lecture Slides
  • Instructor Comments

Topics Include:

  • HTML Elements & Attributes
  • Essential Tags
  • Markup Language
  • Page Structure
  • Forms
  • Links
  • The DOM
  • Offline Cache
  • Web Development Principles

Brenton Strine has developed his web development skills since the advent of the Internet in the 1990's, and also teaches Educator.com’s CSS course.

Student Testimonials:

“Very informative… Awesome video!” — Romin A.

“Hi! This [course] was awesome, I already built a website!!” — Rishabh K.

“I enjoyed this. It put everything in place, thanks!” — Isaac N.

“I like the tutorials, [they are] very thorough and easily understandable.” — David L.

Visit Prof. Strine’s page

Student Feedback

4.4

21 Reviews

48%
43%
10%
0%
0%
By Muhammad ISHAQUE•August 2, 2016
He is a good
By Michael Kolody•December 28, 2015
Not good teaching. Not interactive. But I am finding these videos useful anyway. Needs to be updated.
By S Fonseca•June 9, 2015
Great answer. Thanks for the advice.  Will pick up PHP knowledge very soon.  Just want to do as much HTML5 as I can before PHP and JavaScript.  Am now tinkering with including animated GIFs and Java applets on my web pages.  Very rough learning curve.  Regards.
By Tarik Eltaeib•September 15, 2013
yes, he is good Lecturer
By Tarik Eltaeib•September 15, 2013
yes, he is good Lecturer

Related Courses:

Educator®

Please sign in to participate in this lecture discussion.

Resetting Your Password?
or
Still having trouble? Contact us
OR

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
 Get immediate access to our entire library.

Membership Overview

  • Available 24/7. Unlimited Access to Our Entire Library.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lecture slides for taking notes.
  • Track your course viewing progress.
  • Accessible anytime, anywhere with our Android and iOS apps.