Website Development
In this course, you’ll be learning the basics of HTML & CSS and be on your way to creating your 1st website. Every week, we’ll be making available new web development concepts, lecture videos, along with assignments for self-practice. You’ll also get project guidelines to start building out your a portfolio website as you go through different assignments & become more confident in your web development skills.
Recommended Grades: 6th – 12th Grade
Questions? Email us at [email protected].
As you progress through your website, share with us on social media by tagging us!
- Twitter – @dreamsforschool
- Instagram – @dreamsforschools
- Facebook – fb.com/dreamsforschools
Let's Get Set Up
Watch the first video & learn how to get setup in our Dreams for Schools class by enrolling using the button below.
We strongly recommend watching the video as it will provide step by step instructions on how to create an account and navigate the platform.
Direct Classroom Link: https://repl.it/classroom/invite/oqL2QpR
You’ll learn how to navigate the Dreams for Schools Website Creation class on the REPL.IT platform. Once setup, play around and get a feel for the platform and be ready for the next video & first assignments.
Next week, we’ll be reviewing:
- Intro to HTML
- Headings
- Paragraphs & Line Breaks
VIDEO #1
Getting Set Up with your account & joining the class
Introduction to HTML
In this second video, we will be introducing what HTML is and how to start coding!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #2
Introduction to HTML
HTML:
Headings
In this third video, we will be introducing what headings are in HTML.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #3
HTML: Headings
HTML:
Paragraphs & Line Breaks
In this fourth video, we will be introducing how to make paragraphs and line breaks in HTML.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #4
HTML: Paragraphs & Line Breaks
HTML: Font Styles
In this video, we’ll be introducing font styles, and how to change the size, family, color, and more of your text!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #5
HTML: Font Styles
HTML:
Lists
Lists
In this video, we’ll be introducing lists to help you organize the information in your website!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #6
HTML: Lists
Creating Your Own Website
Checkpoint #1
Checkpoint #1
In this video, we’ll be teaching you how to get started on working on your own website!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #7
Creating Your Own Website
HTML:
Divs
Divs
In this video, we’ll be introducing Divs to help organize your code and prepare it for CSS in the next few weeks.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #8
HTML: Divs
HTML:
Comments
Comments
In this video, we’ll be introducing Comments to help organize your code.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #9
HTML: Comments
HTML:
Images
Images
In this video, we’ll be introducing how to include images on your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #10
HTML: Images
HTML:
Links
Links
In this video, we’ll be introducing how to include links on your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #11
HTML: Links
HTML:
Videos
Videos
In this video, we’ll be introducing how to include videos on your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #12
HTML: Videos
Creating Your Own Website
Checkpoint #2
Checkpoint #2
In this video, we’ll be going back to work on our website with all the new elements that we learned!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #13
Creating Your Own Website Pt.2
Introduction to CSS
In this video, we’ll be introducing what CSS is and how to start adding some style to your website!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #14
Introduction to CSS
CSS:
Colors
Colors
In this video, we’ll be introducing the different ways you can add color to the text in your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #15
CSS: Colors
CSS:
Font Size
Font Size
In this video, we’ll be introducing the different ways you can adjust font size using CSS to the text in your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #16
CSS: Font Size
CSS:
Background Properties
Background Properties
In this video, we’ll be introducing the different ways you can add some flair to your backgrounds in your website.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #17
CSS: Background Properties
Creating Your Own Website
Checkpoint #3
Checkpoint #3
In this video, we’ll be going back to work on our website with all the new elements that we learned!
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #18
Creating Your Own Website Pt.3
CSS:
Borders
Borders
In this video, we’ll be introducing how borders work and how to use them in CSS.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #19
CSS: Borders
CSS:
Paddings
Paddings
In this video, we’ll be introducing how paddings work and how we utilize them in CSS.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #20
CSS: Paddings
CSS:
Margins
Margins
In this video, we’ll be introducing how margins work and how we utilize them in CSS.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #21
CSS: Margins
CSS:
Height & Width
Height & Width
In this video, we’ll be introducing how CSS works with Height and Width of HTML elements.
Don’t forget to join the classroom so you can practice with the accompanying assignments!
VIDEO #22
CSS: Height & Width