HTML/CSS/JavaScript for Complete Beginners

This is a free course provided by Geospatial Training Services!

[dt_sc_h3]Introduction to HTML[/dt_sc_h3]

Lecture 1: Introduction to the Web

Additional Reading: How Web Servers Work

Lecture 2: Introduction to HTML

Additional Reading: Basic HTML Tags

Additional Reading: The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets

Additional Reading: How Cookies Work

Exercise: Creating an HTML Page

Solution: Creating an HTML Page

Lecture 3: Advanced HTML Tags

Additional Reading: HTTP 101

Exercise: More Work with HTML Pages

Solution: More Work with HTML Pages

Exercise: Embedding HTML Elements

Solution: Embedding HTML Elements

 

[dt_sc_h3]Introduction to CSS[/dt_sc_h3]

Lecture 4: Introduction to CSS

Additional Reading: Selectutorial

Additional Reading: CSS Font Stacks

Additional Reading: CSS Cascade

Additional Reading: CSS Inheritance

Additional Reading: CSS and Text

Exercise: Working with Selectors

Solution: Working with Selectors

Exercise: Working with Properties

Solution: Working with Properties

Lecture 5: CSS Layout

Additional Reading: Floatutorial

Additional Reading: Learn CSS Positioning in 10 Steps

Additional Reading: CSS Positioning

Additional Reading: The CSS Layout Model

Exercise: Grouping

Solution: Grouping

Exercise: The Box Model

Solution: The Box Model

Exercise: Layout

Solution: Layout

Exercise: Positioning

Solution: Positioning

 

[dt_sc_h3]Introduction to JavaScript[/dt_sc_h3]

Note: you can use repl.it for the JavaScript exercises. Click the JavaScript link.

Lecture 6: Variables and Functions

Additonal Reading: Language Levels

Additional Reading: The History of JavaScript

Additional Reading: JavaScript Variables and Data Types

Additional Reading: JavaScript Functions

Exercise: Using Variables

Exercise: Working with Functions

Lecture 7: Control Flow and Arrays

Additional Reading: Eloquent JavaScript: Values, Variables, & Control Flow

Additional Reading: MDN: Expressions and Operators

Exercise: Using if/else Statements

Exercise: Using ‘For’ Loops

Exercise: Working with Arrays

Lecture 8: Objects and the DOM

Additional Reading: MDN: Objects and Properties (only that section)

Additional Reading: Eloquent JavaScript: The DOM

Exercise: Working with Objects

Exercise: Working with the DOM

Lecture 9: Animation and Events

Additional Reading: JavaScript Animation Tutorial

Additional Reading: Animating in HTML5

Additional Reading: Webmonkey: JavaScript Events

Exercise: Working with Animation in JavaScript

Exercise: Responding to Events