LuciaKNOWLEDGE & LEARNING
EN
Ctrl K

Lucia / KNOWLEDGE & LEARNING

EN
Search knowledgeCtrl K
← Back to Lexicon

LEXICON / Web Basics

Semantic HTML

Meaningful HTML

Using HTML elements according to their content’s meaning and function.

A closer look at the concept

Elements such as nav, main, article, and strong express intent. A matching class name does not provide that element’s semantics.

SIMPLE EXAMPLE

Use nav for important navigation groups, rather than only div class="nav".

MDN Web Docs · Concept reference ↗

LADDER / LEARNING WITH DIRECTION

Concepts connect with practice.

All paths ↗

Lucia LEXICON / SHORT DEFINITION

Understand this concept

Search knowledge in Lucia

EXPLORE Lucia

Lucia LadderChoose a field, then a courseLibrary LibraryExplanations and context for independent readingLexicon DictionaryDefinitions, examples, and conceptual contextMy LearningContinue a course and review progress on this deviceWeb Basics ReadingFive readings and your saved quiz progress

LADDER / FIELDS OF KNOWLEDGE

Programming & Development1 course · local previewMusic & ArtsNo courses yetDigital Literacy & SecurityNo courses yetScience & DiscoveryNo courses yetHistory & General KnowledgeNo courses yet

LADDER / COURSE

HTML FundamentalsStructure gives meaning to web pages. Learn HTML through explanations, exercises, and a two-page project.

LIBRARY / READING

What happens when you open a website?Follow the journey from an address to a page on your screen.Read a web address without getting lostDomain, path, query, and fragment: small parts with different jobs.Three languages behind one pageUnderstand structure, appearance, and behavior without memorizing code.JSON: when data has structureRead name–value pairs, lists, and the difference between text and numbers.Clear images, lighter pagesWhy format, size, transparency, and alternative text all matter.

LADDER / LEARNING MATERIAL

What is HTML?HTML FundamentalsYour First HTML DocumentHTML FundamentalsInside the HeadHTML FundamentalsEdit, Preview, RepeatHTML FundamentalsTrial 1HTML FundamentalsTags vs. ElementsHTML FundamentalsUnderstanding AttributesHTML FundamentalsNesting & Void ElementsHTML FundamentalsComments & Character ReferencesHTML FundamentalsTrial 2HTML FundamentalsHeadings & ParagraphsHTML FundamentalsEmphasis, Importance & QuotesHTML FundamentalsListsHTML FundamentalsText with MeaningHTML FundamentalsTrial 3HTML FundamentalsLinks & URLsHTML FundamentalsFiles, Folders & NavigationHTML FundamentalsImages & Alternative TextHTML FundamentalsFigures, Audio & Video BasicsHTML FundamentalsTrial 4HTML FundamentalsPage LandmarksHTML FundamentalsSections & ArticlesHTML FundamentalsDiv, Span, ID & ClassHTML FundamentalsAccessible NavigationHTML FundamentalsTrial 5HTML FundamentalsWhen to Use a TableHTML FundamentalsRows & CellsHTML FundamentalsCaptions & HeadingsHTML FundamentalsAccessible TablesHTML FundamentalsTrial 6HTML FundamentalsForms & LabelsHTML FundamentalsInputs & Field ValuesHTML FundamentalsMore Form ControlsHTML FundamentalsBuilt-in Validation & SubmissionHTML FundamentalsTrial 7HTML FundamentalsPlan Your WebsiteHTML FundamentalsBuild the StructureHTML FundamentalsAdd Media & FormsHTML FundamentalsValidate, Debug & ReviewHTML FundamentalsMy First HTML WebsiteHTML Fundamentals

LEXICON / CONCEPTS

BrowserAn application for opening, displaying, and interacting with web pages.HTTPA protocol for exchanging requests and responses between web clients and servers.HTMLA markup language that gives structure and meaning to web content.JSONA text format for storing or exchanging structured data.DNSA distributed naming system that associates domain names with information such as IP addresses.HTTPSHTTP using TLS to protect data exchanges in transit.ServerSoftware or a computer that provides services to clients.URLAn address identifying a resource’s location and how to access it.Domain nameA hierarchical name identifying part of the internet’s naming system.LinkA reference you can follow to a resource or another part of a document.CSSA stylesheet language for controlling web document appearance and layout.JavaScriptA programming language that can add dynamic behavior to web pages.DOMA document representation structured as objects that APIs can read and modify.JSON objectA collection of name–value pairs in JSON, written inside curly braces.ArrayAn ordered sequence of JSON values, written inside square brackets.StringA sequence of characters representing text; JSON encloses it in double quotes.CompressionA way to represent data using less space.TransparencyAn image’s ability to let the background show through fully or partially.Raster imageAn image made from a pixel grid with defined dimensions.Alternative textText conveying an image’s function or meaning when the image cannot be seen.HTML elementA unit of markup that gives content structure or meaning.HTML tagA marker in angle brackets that opens or closes an element.HTML attributeAdditional information on an element’s opening tag.HeadThe part of an HTML document that holds page metadata.TitleThe name of an HTML document, usually displayed in browser tabs and bookmarks.MetaAn element for metadata not covered by other metadata elements.Character encodingRules connecting text characters with byte representations.ViewportThe area in which a browser displays a page on a device.Void elementAn HTML element with no child content or closing tag.Character referenceA way to write a character through a named or numeric reference in HTML.HeadingThe h1 through h6 elements, which identify heading levels in document content.Semantic HTMLUsing HTML elements according to their content’s meaning and function.AccessibilityThe practice of making content and interactions usable by people with varied abilities.HTML listA structure for grouping items, with or without meaningful order.Relative pathA resource address resolved from the document’s location or base URL.Figure & figcaptionElements that group self-contained content with a visible caption.LandmarkA major page region that helps users recognize and navigate its structure.HTML tableA row and column structure presenting data with two-dimensional relationships.HTML formA group of controls that lets users enter or select data.Form labelA name explaining a form control and connected to it programmatically.HTML validationChecking markup conformance or, for forms, compliance with declared field rules.