HTML 5 Visual Learning
Requirements
- No prerequisites
Description
HTML 5 Visual Learning strikes a balance between succinct explanation and complete visualizations of code so that the key concepts are learned through easy-to-follow examples. This course assumes no previous knowledge of HTML, web development or programming. In taking this course, you will learn how to structure web-based content. This course is based on my Mike Ludo (a pen name) web development books.
Who this course is for:
- Beginners at self-learning front end web development skills.
Course content
- 00:37About the Instructor
- 00:36A Note About the Videos
- 00:41Access the Code Files
- 00:26What This Course Assumes
- 02:06Files and Directories
- 02:24Using an FTP Client App
- 05:40The Other Tools
- 00:35Summary of Making .html Files
- 03:07Markup
- 00:46The Self-Closing Tags
- 01:18The Tree Structure (Parents and Children)
- 02:07Attributes and Values
- 00:47Tags vs Elements
- 02:27Structure, Style, Interaction
- 01:54Inline CSS
- 00:16Special Characters
- 00:50Semantic Tags
- 00:20Name Things Well
- 01:24Block and Inline Display Properties
- 00:15Bit.ly URL Shortener Note
- 00:20The Tags & Elements
- 00:34<!-- -->
- 00:36<!DOCTYPE html>
- 07:48<a>
- 00:28<abbr>
- 00:28<address>
- 03:19<area>
- 00:22<article>
- 00:14<aside>
- 01:06<audio>
- 00:54<b>
- 00:32<base>
- 00:29<bdi>
- 00:23<bdo>
- 00:22<blockquote>
- 00:28<body>
- 01:02<br>
- 03:17<button>
- 01:50<canvas>
- 00:31<caption>
- 00:15<cite>
- 00:16<code>
- 01:45<col> & <colgroup>
- 00:22<data>
- 00:34<datalist>
- 00:19<dd> , <dl> & <dt>
- 00:29<details> & <summary>
- 00:14<dfn>
- 00:13<dialogue>
- 00:19<div>
- 00:46<em>
- 00:54<embed>
- 00:24<fieldset> & <legend>
- 00:30<figcaption> & <figure>
- 00:18<footer>
- 01:37<form>
- 00:27<h1> - <h6> & <hgroup>
- 00:29<head>
- 00:13<header>
- 00:19<hr>
- 00:17<html>
- 00:22<i>
- 01:58<iframe>
- 01:35<img>
- 03:01<input>
- 00:19<ins> & <del>
- 00:11<kbd>
- 00:29<label>
- 02:00<li>, <ul> & <ol>
- 01:48<link>
- 00:22<main>
- 00:18<map>
- 00:16<mark>
- 01:31<meta>
- 00:33<meter>
- 01:03<nav>
- 00:16<noscript>
- 01:12<object> & <param>
- 00:42<optgroup> & <option>
- 00:29<output>
- 00:10<p>
- 01:14<picture>
- 00:45<pre>
- 00:18<progress>
- 00:23<q>
- 00:32<rp>, <rt>, <rtc> & <ruby>
- 00:17<s>
- 00:18<samp>
- 01:09<script>
- 00:12<section>
- 00:43<select>
- 00:09<small>
- 00:46<source>
- 00:26<span>
- 00:05<strong>
- 01:10<style>
- 00:10<sub>
- 00:06<sup>
- 00:45<svg>
- 01:21<table>, <tr>, <th>, <td>, <thead>, <tfoot>, & <tbody>
- 00:11<template>
- 01:50<textarea>
- 00:49<time>
- 01:02<title>
- 00:34<track>
- 00:33<u>
- 00:09<var>
- 01:05<video>
- 00:35<wbr>
- 09:02Modifying Website Templates
- 03:44Using a Web Editor Part 1 | Overview
- 04:30Using a Web Editor Part 2 | User Interface Tour
- 08:49Using a Web Editor Part 3 | Importing Fonts
- 02:42Using a Web Editor Part 4 | Styling Icons
- 03:26Using a Web Editor Part 5 | Working with Images
- 03:48Global Attributes
- 00:16Tags by Category
- 01:05Code Validation
- 01:37Developer Tools
- 00:13Where to Go Next
- 00:24List of All Bit.ly Links Used
- 00:17Online Resources
- 00:09Image Credits
Instructor
Dr. Michael Filimowicz is Senior Lecturer in the School of Interactive Arts and Technology (SIAT) at Simon Fraser University. He also makes electronic music and videos as Myk Eff, produces performance visuals as VJ Loop Zone, and publishes web development books as Mike Ludo (given the generally unmarketable quality of long Polish last names!).
He has a background in computer mediated communications, audiovisual production, and new media art. His research develops new multimodal display technologies based on audiovisual colocation, exploring novel form factors across different application contexts including gaming, immersive exhibitions, telepresence and simulation-based training.