Web Design


HTML 5 Visual Learning

A Comprehensive Example Set for Getting Up to Speed Fast

3.25 (8 reviews)


2.5 hours


Jun 2021

Last Update
Regular Price

Exclusive  Offer
Unlimited access to 30 000 Premium SkillShare courses

What you will learn

Web Design Fundamentals

Structuring Web-based Content



HTML 5 Visual Learning fills a gap in the learning and reference works on introductory web design. Instead of the terse definitions written for experts found in online documentation resources, or long commentaries to ease novices into programming, this course strikes a balance between succinct explanation and complete visualizations of code so that the key concepts are learned through easy-to-follow examples.

The course assumes no previous knowledge of HTML, web development or programming. You will very quickly gain the skills you need to write the original source files for creating websites. You can also use the course in an ongoing way as a general reference since it presents very thorough coverage of HTML elements, their features and use cases.

Dozens of code snippets are provided for you to experiment with to develop your HTML 5 skills. I show you how to use an online IDE (integrated learning environment) for practicing and pre-visualizing your HTML code.

After completing this course, you can continue your learning with my other courses on CSS 3 and Bootstrap 4. Whether you want to become a professional web developer, or create websites to use as a communication tool, the course will get you well on your way with its many examples and resources.

This course is based on my Mike Ludo (a pen name) web development books.


HTML 5 Visual Learning
HTML 5 Visual Learning
HTML 5 Visual Learning
HTML 5 Visual Learning


HTML 5 Visual Learning

Access the Code Files

What This Course Assumes

Files and Directories

Using an FTP Client App

The Other Tools

Summary of Making .html Files


The Self-Closing Tags

The Tree Structure (Parents and Children)

Attributes and Values

Tags vs Elements

Structure, Style, Interaction

Inline CSS

Special Characters

Semantic Tags

Name Things Well

Block and Inline Display Properties

Bit.ly URL Shortener Note

The Tags & Elements

<!-- -->

<!DOCTYPE html>




















<col> & <colgroup>



<dd> , <dl> & <dt>

<details> & <summary>






<fieldset> & <legend>

<figcaption> & <figure>



<h1> - <h6> & <hgroup>









<ins> & <del>



<li>, <ul> & <ol>









<object> & <param>

<optgroup> & <option>







<rp>, <rt>, <rtc> & <ruby>














<table>, <tr>, <th>, <td>, <thead>, <tfoot>, & <tbody>










Modifying Website Templates

Using a Web Editor Part 1 | Overview

Using a Web Editor Part 2 | User Interface Tour

Using a Web Editor Part 3 | Importing Fonts

Using a Web Editor Part 4 | Styling Icons

Using a Web Editor Part 5 | Working with Images

Global Attributes

Tags by Category

Code Validation

Developer Tools

List of All Bit.ly Links Used

Online Resources

Where to Go Next

Image Credits


MaFomedanu26 December 2020

This course isn't exactly beginner friendly. There's a lot of info (and it's solid) but the way it is provided is... not the best? There's 100+ pages of info; the entire course is pretty much an info dump. One could get the same info by looking it up on Google. You're supposed to read and follow instructions but if at one point there's something you don't understand (and being a beginner you're not supposed to be able to debug or notice mistakes on the spot because d'oh!) you're pretty much out of luck. All those lessons could be merged into 5-10 min long videos that would be a better way to deliver info and students could track what they're doing compared to what should be done. And at the end of it they'd also be able to put all that into practice in a final project and have a way to measure their improvement (from 0 to I did a thing that works). However, it's a free course and no one's forcing anyone to take it, but it could be a lot better than this.


Udemy ID


Course created date


Course Indexed date
Course Submitted by