[DevelopedByEd] The Creative HTML5 & CSS3 Course

[DevelopedByEd] The Creative HTML5 & CSS3 Course 10/2020

[DevelopedByEd] The Creative HTML5 & CSS3 Course​


[DevelopedByEd] The Creative HTML5 & CSS3 Course


The creative HTML5 and CSS3 Course was created for everybody who is interested in learning web development. If you are a complete beginner we will cover all the basics to get you up and going to create your first website. If you have some web development skills already, do not worry! We will create 3 amazing projects with awesome design and animations.

  • HTML5
  • CSS3
  • Responsive Design
  • Animations
  • Working with Images and SVG's
  • Flexbox
  • CSS Grid
  • SASS
  • Optimization
  • Accessibility
  • Deployment

Course Curriculum​

Introduction

Welcome To The Course! (0:56)

HTML5 Basics

  • Setting Up VS Code (1:43)
  • Installing Extensions (2:46)
  • Creating a HTML Tag (4:15)
  • Basic Layout (4:23)
  • Meta Tags (12:58)
  • h and p Tags (7:00)
  • Images and Video (7:10)
  • a Tags (5:12)
  • Forms (16:48)
  • Lists (4:04)
  • Comments (2:25)
  • Tables (3:13)
  • Classes and ID's (5:32)
  • HTML5 Semantics (16:00)
  • HTML5 Entities (3:17)

CSS3 Basics

  • Let's Learn CSS (0:27)
  • How To Use CSS3 (3:56)
  • Basic Syntax (5:19)
  • Selectors (15:30)
  • Specificity (7:41)
  • Padding and Margin (8:04)
  • Box Model (8:32)
  • Pixels, rem, em (13:36)
  • Styling a Button (7:02)
  • Display Types (7:22)
  • Positions (17:47)
  • Pseudo Elements and Classes (5:55)
  • Mini Project - How to not create layouts (optional) (33:51)

Mobile Responsiveness

  • Media Queries (10:26)
  • VH and VW (12:11)

Flexbox​

  • Flexbox Basics (27:03)
  • Let's Practice Flexbox (28:38)

Project 1 - Travel Website

  • Quick Notice about paths
  • Before We Our Projects (1:21)
  • Setting Things Up (12:55)
  • Creating Our Nav&Hero (38:21)
  • Creating the City Section (42:43)
  • Card Section (20:06)
  • Form Section (14:44)
  • Submitting Forms (5:31)
  • Travelly Final Code

Accessibility​

  • Semantics (3:30)
  • Contrast (4:15)
  • Keyboard (4:14)
  • Text (4:56)
  • Labels and Alt (6:18)

CSS Grid​

  • CSS Grid Basics (19:30)
  • CSS Grid vs Flexbox (6:22)

Project 2 - Photography Website​

  • Starter Files
  • Setup (14:36)
  • Adding Fonts (2:27)
  • First Page (28:41)
  • Plant Animation (10:38)
  • Burger Animation (22:42)
  • Fixing Small Issues (3:18)
  • About Section (17:47)
  • Image Gallery (17:34)
  • Contact Page (26:17)
  • JavaScript Functionality (15:45)
  • Elena Joy Final Code

Basics of SASS​

  • Basics of SASS (24:23)
  • Let's Learn a Magic Trick (1:23)

Final Project - Portfolio​

  • Portfolio Setup (12:01)
  • Getting SVGs and Icons (9:01)
  • Creating the Nav and Section (21:25)
  • Animating SVGs (8:37)
  • Mobile Friendly (11:43)
  • Project Page (11:31)
  • Finish Line (14:28)
  • Portofolio Final Code

Optimizing and Deploying​

  • Optimizing Images (4:11)
  • Optimizing HTML and CSS (1:53)
  • Deployment (4:44)
  • The End (0:47)

This course is designed to start you absolutely from scratch! If you already have some HTML5 and CSS3 skills this course will go deeper into explaining all the important concepts and also building out these cool projects.
Author
PIRATE
Downloads
12
Views
15
First release
Last update
Rating
0.00 star(s) 0 ratings

More resources from PIRATE

AdBlock Detected

We get it, advertisements are annoying!

Sure, ad-blocking software does a great job at blocking ads, but it also blocks useful features of our website. For the best site experience please disable your AdBlocker.

I've Disabled AdBlock