CODEON – HTML Foundations

Learn, code, deploy & earn! Each lesson unlocks the next.

Lesson 1 – HTML Structure

Concepts & Tag Guide:

<!DOCTYPE html>

Declares this document as HTML5 so browsers know how to render it.

<html>

Root element that wraps all HTML content.

<head>

Contains metadata like <title>, <meta> tags, CSS links, scripts.

<title>

Specifies the title shown in browser tab.

<body>

Contains all visible content like headings, paragraphs, images.

Task:

Change "Your Name" to your real name and write a paragraph about why you want to code.

Lesson 2 – Headings & Paragraphs

Concepts & Tag Guide:

<h1> to <h6>

Headings; <h1> is the largest/main heading, <h6> is smallest.

<p>

Paragraph tag for blocks of text.

Task:

Add an <h1> and a <p> about your coding goals.

Lesson 3 – Images & Links

Concepts & Tag Guide:

<img src="" alt="">

Displays an image. 'src' is the image path, 'alt' is alternative text.

<a href="">

Anchor tag creates hyperlinks to other pages or sites.

Task:

Add an image and a link to your favorite coding resource.

Lesson 4 – Sections & Organization

Concepts & Tag Guide:

<section>

Defines thematic sections of a page.

<div>

Generic container to group elements for layout and styling.

Task:

Use <section> and <div> to organize your page into at least 2 sections.

Lesson 5 – GitHub & Monetization

Task:

Deploy your project online and learn to monetize your skills.

💻 GitHub Guide:

💰 Monetization Tips: