::November 15::

Introduction to Web Development :: Lesson 8.1-8.2

Expectations:

C: Voice Level 2 (only the people next to you can hear you and no shouting across the room)

H: Ask your team, elbow partner or raise hand

A: Work on the assignment

M: Stay in your assigned seat

P: Work till assignment is completed

S: Finishing your work

Typing.com ASSIGNMENT!

Beginner: Z & Enter Keys:: Due Friday, November 12:: 10 Points

Typing:

1. Log in to typing.com

2. Click Lessons

3. On Beginner Tab, Click Beginner: Z & Enter keys

(this is due Friday, November 12): 10 Pts.

If you are finished or waiting, work on Clever!

1. Students click on the Clever icon on the desktop

2. Sign in using the username & password (same as logging into computer)

3. Click on the square that says iReady

4. Continue until time is up!

Lessons have been assigned to them based on their diagnostic test results both in Math and Reading. Within each lesson are brain break games. The district is pushing a goal of 45 minutes per week on Online Lessons in ELA and 45 minutes per week in Math to close the gaps found in the diagnostic. Math and ELA are providing some of that time during the week, but not all.

Let's begin...CREATE YOUR HOMEPAGE!

Watch the Video below for complete instructions!

Objectives:

Understand what HTML and CSS are and how they work together to build websites.
Set up a web development environment using VS Code and browser developer tools.
Learn and apply the basic HTML structure.
Create a simple webpage using headings, paragraphs, and links.

What, Why & How:

WHAT ARE WE LEARNING: Website development!

WHY IS IT IMPORTANT: Web design is one of the jobs that will continue to be in demand

HOW WILL MY TEACHER KNOW WHAT I LEARNED: You will build your very own website and answer questions about its completion!

Web Development: Intro to Web Lab

What is HTML, CSS & JavaScript?

Intro to HTML:

Let's Get started!

Click on Code.org

8.1 :: Today we will working on lesson 8!

Let's do something very cool. We are now going to add Images! Go to line 8 and add your name. Then Go to Google and find a picture of a Tiger or to your all-about Bengals PowerPoint and take a screenshot.

Change the image to a tiger, Change the Background color, use two or more different text colors, use two different font families, and increase all the text sizes by 6. Add text-decoration, align <H1> to center and underline.

Go to Google and find a picture of a Tiger

Goto your all-about Bengals PowerPoint and take a screenshot.

Save to your ONE DRIVE

Click "ADD IMAGE"

Click "Rename" and call it "Bengal1"

Click "index html" and on line 14 write:

8.2 :: Today we will working on lesson 8!

Complete and Add name to line 7 change the Background color, the dog and cat image, color, use two or more different text colors, use two different font families, and increase all the text sizes by 6. Add text-decoration, align <H1> to center and underline.

REV :: 6.1 :: Today we will working on lesson 6!

::6.2::

Let add Style to your page! Add your name to Line 9 and Lets change the color of the font! You got this!

click on index find line 9 add your name. Easy!

Click on Style.css, find the color, and Change it. Now, change the alignment of the sentence in the middle! Too Easy!

::6.3::

Let's add Style to your page! Add your name to Line 7 and change size to 30 font. Align to the center, and let's change the color of the font H1, H3, and P!

Also, Add an H3 header and 1 odd world record of your own. You got this!

click on index find line 7 add your name. Easy!

Click on Style.css, find the color, and Change it H1, H3, P. Now, change the alignment to Center! Too Easy!

6.4: Change the Background color, use three different text colors, and change all the text sizes increase them all by 4. Everything should match and look cool and fun.

6.5: Change the Background color, use three different text colors, and change all the text sizes increase them all by 4. Everything should match and look cool and fun.

6.6:: Change the Background color, use three different text colors, and change all the text sizes increase them all by 3. Everything should match and look cool and fun.

6.7-8:: Change the Background color, use three different text colors, and change all the text sizes increase them all by 2. Everything should match and look cool and fun.

6.9: Complete A, B, D, and E. Also, Change the Background color, use three different text colors, and increase all the text sizes by 6. Everything should match and look cool and fun.

6.10: Complete and Change the Background color, use two different text colors, and increase all the text sizes by 8. Everything should match and look cool and fun. Then Skip to 6.12

6.12: Complete A, B and C. Also, Change the Background color, use two different text colors, and increase all the text sizes by 8. Everything should match and look cool and fun.