Free & SEO friendly

HTML Tutorial Topics

Browse every HTML lesson in order, or jump straight to the topic you need. Each page links to the previous and next lesson.

Open landing page

230 topics

100% free

SEO friendly URLs

History of HTML

#history-of-html

Features of HTML

#features-of-html

Why Learn HTML?

#why-learn-html

Structure of a Web Page

#structure-of-a-web-page

Installing VS Code for HTML

#installing-vs-code-for-html

Your First HTML Program

#your-first-html-program

Hello World in HTML

#hello-world-in-html

Understanding HTML Document Structure

#understanding-html-document-structure

HTML Boilerplate Explained

#html-boilerplate-explained

Opening and Closing Tags

#opening-and-closing-tags

Nested Elements

#nested-elements

HTML Attributes

#html-attributes

Global Attributes

#global-attributes

Headings in HTML

#headings-in-html

Paragraphs in HTML

#paragraphs-in-html

Horizontal Rules

#horizontal-rules

Text Formatting Tags

#text-formatting-tags

Bold and Strong Tags

#bold-and-strong-tags

Italic and Emphasis Tags

#italic-and-emphasis-tags

Superscript and Subscript

#superscript-and-subscript

Quotations in HTML

#quotations-in-html

Absolute vs Relative Links

#absolute-vs-relative-links

Opening Links in New Tab

#opening-links-in-new-tab

Image Attributes

#image-attributes

Unordered Lists

#unordered-lists

Description Lists

#description-lists

Table Rows and Columns

#table-rows-and-columns

Cell Padding and Spacing

#cell-padding-and-spacing

Colspan and Rowspan

#colspan-and-rowspan

HTML Forms Introduction

#html-forms-introduction

Input Types in HTML

#input-types-in-html

Text Input Fields

#text-input-fields

Password Fields

#password-fields

Email Input Field

#email-input-field

Number Input Field

#number-input-field

Select Dropdown

#select-dropdown

Textarea in HTML

#textarea-in-html

Buttons in HTML

#buttons-in-html

Form Validation

#form-validation

Required Fields

#required-fields

Placeholder Attribute

#placeholder-attribute

Datalist Element

#datalist-element

File Upload Input

#file-upload-input

Date and Time Inputs

#date-and-time-inputs

Figure and Figcaption

#figure-and-figcaption

HTML Div Element

#html-div-element

Block vs Inline Elements

#block-vs-inline-elements

Iframes in HTML

#iframes-in-html

Embedding YouTube Videos

#embedding-youtube-videos

Embedding Google Maps

#embedding-google-maps

Symbols in HTML

#symbols-in-html

#emojis-in-html

#html-meta-tags

Charset Meta Tag

#charset-meta-tag

Viewport Meta Tag

#viewport-meta-tag

Open Graph Meta Tags

#open-graph-meta-tags

Data Attributes

#data-attributes

HTML Accessibility Basics

#html-accessibility-basics

#alt-attributes

Keyboard Accessibility

#keyboard-accessibility

Responsive HTML Basics

#responsive-html-basics

Building Your First Web Page

#building-your-first-web-page

Introduction to HTML5

#introduction-to-html5

New Features in HTML5

#new-features-in-html5

Semantic HTML5 Tags

#semantic-html5-tags

#canvas-element

Drag and Drop API

#drag-and-drop-api

Geolocation API

#geolocation-api

Web Storage API

#web-storage-api

Session Storage

#session-storage

WebSockets Basics

#websockets-basics

Offline Web Applications

#offline-web-applications

Progressive Web Apps Basics

#progressive-web-apps-basics

HTML APIs Overview

#html-apis-overview

Microdata in HTML

#microdata-in-html

Structured Data

#structured-data

#json-ld-basics

SEO Optimization with HTML

#seo-optimization-with-html

HTML Performance Optimization

#html-performance-optimization

Lazy Loading Images

#lazy-loading-images

Preloading Resources

#preloading-resources

HTML Security Basics

#html-security-basics

Cross-Origin Requests

#cross-origin-requests

Content Security Policy

#content-security-policy

HTML Best Practices

#html-best-practices

Clean HTML Structure

#clean-html-structure

Mobile-Friendly HTML

#mobile-friendly-html

Responsive Design Principles

#responsive-design-principles

HTML Email Templates

#html-email-templates

Newsletter Design

#newsletter-design

Landing Page Structure

#landing-page-structure

Portfolio Website Structure

#portfolio-website-structure

Blog Layout in HTML

#blog-layout-in-html

E-Commerce Product Page

#e-commerce-product-page

Pricing Table Design

#pricing-table-design

Hero Section Structure

#hero-section-structure

FAQ Section in HTML

#faq-section-in-html

Contact Form Design

#contact-form-design

Login Form Design

#login-form-design

Registration Form Design

#registration-form-design

Resume Website Layout

#resume-website-layout

Educational Website Layout

#educational-website-layout

Business Website Structure

#business-website-structure

Real Estate Website Layout

#real-estate-website-layout

Hospital Website Layout

#hospital-website-layout

Restaurant Website Layout

#restaurant-website-layout

Travel Website Layout

#travel-website-layout

Complete HTML Website Project

#complete-html-website-project

Linking CSS to HTML

#linking-css-to-html

Linking JavaScript to HTML

#linking-javascript-to-html

Internal JavaScript

#internal-javascript

External JavaScript

#external-javascript

Manipulating HTML Elements

#manipulating-html-elements

Event Handling with JavaScript

#event-handling-with-javascript

Form Validation with JavaScript

#form-validation-with-javascript

Responsive Navigation Bar

#responsive-navigation-bar

Dark Mode Toggle

#dark-mode-toggle

Responsive Cards

#responsive-cards

Animated Buttons

#animated-buttons

Portfolio Website Project

#portfolio-website-project

Calculator Project

#calculator-project

To-Do List Project

#to-do-list-project

#weather-app-ui

Login Authentication UI

#login-authentication-ui

#chat-ui-design

Dashboard Layout

#dashboard-layout

Admin Panel Design

#admin-panel-design

Blogging Website

#blogging-website

E-Commerce Frontend

#e-commerce-frontend

Landing Page Project

#landing-page-project

Personal Portfolio Website

#personal-portfolio-website

Company Website

#company-website

#school-website

College Website

#college-website

Restaurant Website

#restaurant-website

Travel Agency Website

#travel-agency-website

Hospital Website

#hospital-website

Hotel Booking Website

#hotel-booking-website

Job Portal Frontend

#job-portal-frontend

Wedding Invitation Website

#wedding-invitation-website

Event Management Website

#event-management-website

Photography Portfolio

#photography-portfolio

Digital Agency Website

#digital-agency-website

SaaS Landing Page

#saas-landing-page

Blogging Platform UI

#blogging-platform-ui

Online Course Website

#online-course-website

HRMS Dashboard UI

#hrms-dashboard-ui

Payroll Dashboard UI

#payroll-dashboard-ui

HTML Interview Questions

#html-interview-questions

HTML Coding Challenges

#html-coding-challenges

Common HTML Mistakes

#common-html-mistakes

Debugging HTML Code

#debugging-html-code

HTML Best Practices

#html-best-practices-2

Clean Code in HTML

#clean-code-in-html

SEO-Friendly HTML Structure

#seo-friendly-html-structure

Accessibility Interview Questions

#accessibility-interview-questions

Freelancing with HTML

#freelancing-with-html

Remote Jobs for HTML Developers

#remote-jobs-for-html-developers

HTML Cheat Sheet

#html-cheat-sheet

#html-tags-list

HTML Attributes List

#html-attributes-list

HTML Mini Projects

#html-mini-projects

HTML Major Projects

#html-major-projects

HTML Resume Projects

#html-resume-projects

HTML Portfolio Ideas

#html-portfolio-ideas

HTML Certification Guide

#html-certification-guide

#html-notes-pdf

#html-exercises

HTML Online Editor

#html-online-editor

HTML Playground

#html-playground

Best VS Code Extensions for HTML

#best-vs-code-extensions-for-html

HTML Developer Tools

#html-developer-tools

HTML Roadmap 2026

#html-roadmap-2026

#future-of-html

#html-ecosystem

Become a Frontend Developer

#become-a-frontend-developer