In the HTML course of Coding, the students will discover how the web is built. They will learn how web pages are designed, structured, and presented using HTML mark-up and CSS exercises. They’ll add tags, images, and links to bring their web pages to life.

Introducing HTML

HTML can be accessed through the dropdown menu of the navigation bar or through the Learn, Create, Glossary links on the Coding homepage.

The Learn homepage provides an overview of the scope and sequence of the lessons within the HTML course. 

HTML Lessons

Each lesson in HTML creates a self-guided experience for pupils through a series of scaffolded tasks. Lessons always begin with an Introduction to the concept as the first step.

As pupils progress through each Lesson, they are introduced to coding concepts and vocabulary in the Solve steps.

Hands-on tasks are provided to allow pupils to practice using text to code. These tasks support the development of computational thinking skills such as logic and sequencing. Each lesson includes three sections:

Instructions: Written explanation of the task(s) for this Lesson step that appear in the top half of the screen. Specific vocabulary may include a link to pop-up definitions.

Code: Space where pupils will add and manipulate coding elements. When pupils have finished a task or created their own code, they select Check my code to test.

Output: Code that is correct will display the results in this panel. 

Any errors in code will be shown as a warning message in the Console area on the left-hand side of the screen

A final step for a lesson might be Build. This step offers a creative opportunity for students to apply everything learned in the lesson. They will make their own decisions about how to use the coding elements provided.

Debugging and Test Your Skills Lessons are provided at the end of each section to allow students additional practice in applying what they have learned in previous lessons.

Debugging Lessons give pupils the opportunity to practice using their coding knowledge to fix errors.

Test Your Skills Lessons allow pupils to apply their learning through a series of steps that include specific coding challenges.

HTML Course Resources

We provide several different resources to support both students and teachers in the HTML course.

Each Lesson includes multiple Help Videos. These videos provide a tutorial to support pupils as they progress through each step. The Help Videos can be accessed from each step of the Lesson. *Note: Help Videos are not included in Debugging and Test Your Skills Lessons.

Teachers can access a Lesson Plan that is connected to each Lesson. Lesson Plans can be found on the Introduction step of each Lesson or from the list of all Lessons on the HTML homepage. *Note: Lesson Plans are not included in Debugging and Test Your Skills Lessons.

Lesson Plans are downloadable, printable pdfs that include learning objectives, success criteria, key vocabulary, key questions, and strategies to support pupils as they move through the steps of the Lesson.

HTML Create

The opportunity to 'free code' and develop an app is provided through the Create area of Coding. Selecting Create from the HTML homepage allows pupils to develop an app outside of any restrictions or structure provided in the Learn lessons.

By selecting New App, pupils are directed to a 'free code' space that allows them to practice using all they have learned through the HTML Lessons.

The Code area provides space for pupils to enter code.

Their code can be downloaded to be worked on offline. Code can also be uploaded to be used within this area. 

Clicking on Output will validate the code that has been entered.
Errors in coding will appear within the Console area.

The students' creations can be be saved to their own content areas and also shared with teachers and classmates.
These features

HTML Glossary

Selecting the Glossary from the HTML dropdown menu or homepage provides access to an interactive menu of vocabulary terms specific to that coding language.

Glossary terms are presented in a scrollable alphabetical list that provides each term and its meaning. A navigable grid of letters allows you to jump to any section of the list by selecting a letter. Only letters that have associated Glossary terms can be selected.

Additionally, Glossary terms are included in Lessons and are identified as interactive through their colour and underlining.

Selecting a Glossary term within a Lesson generates a pop-up definition at point-of-use.