Shape of the Day:
- Complete Web Development 10 Page
- Learn about the Internet and Websites
- Open the Brackets program – it’s time to code!!
- Follow instructions on what to do with the HTML
Website of the Day:
http://fabianburghardt.de/webolution/ – Follow the changes of the NASA website from 1991 to 2015
1. Double check yesterdays lesson – ensure your Web Development 10 Page is completed and added to a menu (so I can click it)
2. Let’s learn about the Internet and Websites
- Here’s a graphic on how to get your website online
- What even is the internet? Let’s watch here
- Here’s a pretty cool graphic on how to BUILD your website
- With a partner or on your own, answer the following questions using this website – click on “start reading”
- What is the internet?
- What is an IP address?
- How does a domain name relate to it?
- What is a webpage vs a website?
- What is a browser? What are some examples?
- For a domain name, how can you create and register one?
- What is a web host and why is it necessary to have one?
- What tool must you have to write HTML code?
3. Open Brackets Program and follow these steps:
- Ensure you have the Web Development 10 folder created on your synced one drive folder
- Open Brackets program
- Click on file > new
- Save the file in your one drive folder and ensure you add .html to the end of the file name – for example mywebpage.html – otherwise it won’t recognize it as an html file
- To preview your code in Brackets, click on the sideways thunderbolt on the top right of the window.
- This should be a live preview – you should see the changes of the page as you change the code.
- Now follow this tutorial on HTML to get you started.
- Create a folder on your Web Dev 10 one drive folder called HTML Basics. You will save your practice webpages and images in this folder.
- Go back to the website of the day and see if you recognize any code or patterns with HTML.
- You can edit the code with the X-Ray Goggles or using right click > inspect
- Open these instructions on how to organize your html code
- Add text, images, links and nested tags like a bold link, a bold paragraph and a LINKED image!
- Remember – Do not capitalize HTML tags – they usually come in pairs (opening and closing tag) – all webpages must be saved as “filename.html”