HTML Complete Course
Build semantic, accessible web pages from your first file to native dialogs, safe embeds and fast loading.
- Beginner
- 25 lessons
- 10 hours
Build semantic, accessible web pages from your first file to native dialogs, safe embeds and fast loading.
Build a working form, connect labels to inputs, and understand action, method and name.
Email, number, date, url and other input types, plus required, min, max and pattern for browser validation.
Choose between AVIF, WebP, JPEG, PNG and SVG, and control loading with loading, decoding and fetchpriority.
Embed audio and video with native controls, multiple sources, and captions with the track element.
Make larger tables understandable with caption, thead, tbody, scope, colspan and rowspan.
Every common form control, grouping with fieldset and legend, and default values.
Help browsers fill in forms and show the right mobile keyboard with autocomplete, inputmode and enterkeyhint.
Build disclosures and modal dialogs with no JavaScript framework, and their built-in accessibility.
What belongs in the head: title, character set, viewport, description, and links to CSS and icons.
Show menus, tooltips and pickers with the popover attribute and popovertarget, without JavaScript.
Use h1 to h6 to outline content and paragraphs for text, and why heading levels matter for readers and search engines.
Embed maps, videos and other sites with iframe, and limit what they can do with sandbox, allow and referrerpolicy.
Elements that give meaning to text, such as strong, em, code, kbd, abbr, time and mark, and when to use each.
Head metadata that controls how pages appear in search and social shares, and what SEO plugins handle for you.
When to use ul, ol and dl, nesting lists, and the start and reversed attributes.
The template element and slots as the HTML foundation for Web Components.
Write links with the a element, relative and absolute paths, links to page sections, email links, and safe new-tab links.
Control how the browser fetches resources with resource hints and script loading attributes.
Add images with img, write useful alt text, and set width and height to prevent layout shift.
Structure pages with semantic elements instead of generic divs, and how they map to landmarks.