HTML 5 Visual Learning
A Comprehensive Example Set for Getting Up to Speed Fast

What you will learn

Web Design Fundamentals

Structuring Web-based Content

HTML 5

Description

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.


Get Instant Notification of New Courses on our Telegram channel.


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.

English
language

Content

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
Markup
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>
<a>
<abbr>
<address>
<area>
<article>
<aside>
<audio>
<b>
<base>
<bdi>
<bdo>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<cite>
<code>
<col> & <colgroup>
<data>
<datalist>
<dd> , <dl> & <dt>
<details> & <summary>
<dfn>
<dialogue>
<div>
<em>
<embed>
<fieldset> & <legend>
<figcaption> & <figure>
<footer>
<form>
<h1> – <h6> & <hgroup>
<head>
<header>
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins> & <del>
<kbd>
<label>
<li>, <ul> & <ol>
<link>
<main>
<map>
<mark>
<meta>
<meter>
<nav>
<noscript>
<object> & <param>
<optgroup> & <option>
<output>
<p>
<picture>
<pre>
<progress>
<q>
<rp>, <rt>, <rtc> & <ruby>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strong>
<style>
<sub>
<sup>
<svg>
<table>, <tr>, <th>, <td>, <thead>, <tfoot>, & <tbody>
<template>
<textarea>
<time>
<title>
<track>
<u>
<var>
<video>
<wbr>
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