HTML, or HyperText Markup Language, is the standard language used to create and design web pages. It provides the structure for web documents and describes the elements and their relationships within a web page. HTML uses a system of tags and attributes to format content, embed multimedia, create links, and much more. Understanding the key terminologies in HTML is essential for web development, as it allows developers to write and interpret code effectively.
Below is a detailed list of 100 HTML terminologies, including explanations to help you grasp the fundamental concepts and elements used in HTML.
HTML Terminologies
- Attribute: Additional information added to HTML elements to provide more details or control their behavior. For example,
hrefin<a href="https://example.com">. Wikipedia - Anchor Tag:
<a>tag used to create hyperlinks. It can link to other pages, files, or locations within the same page. Wikipedia - Block Element: An HTML element that starts on a new line and takes up the full width available. Examples include
<div>and<p>. Wikipedia - BR Tag:
<br>tag used to insert a line break in the text. Wikipedia - Button Element:
<button>tag used to create a clickable button. It can be used in forms or to trigger JavaScript functions. Wikipedia - Canvas:
<canvas>tag used to draw graphics on the fly via JavaScript. It is commonly used for rendering graphics, animations, and games. Wikipedia - Character Entity: A special sequence of characters used to display symbols and reserved characters in HTML, such as
©for the copyright symbol. Wikipedia - CDATA: Stands for Character Data, used in XML and HTML to include text that should not be parsed by the parser. Wikipedia
- Comment:
<!-- comment -->used to include notes or explanations in the HTML code that are not displayed in the browser. Wikipedia - DOCTYPE:
<!DOCTYPE html>declaration that defines the HTML version and ensures that the document is rendered in standards mode. Wikipedia - Element: A basic building block of HTML that consists of a start tag, content, and an end tag. For example,
<p>This is a paragraph.</p>. Wikipedia - Form:
<form>tag used to create a form for user input. It can contain various input elements like text boxes, buttons, and checkboxes. Wikipedia - Head Element:
<head>tag contains metadata about the HTML document, such as title, links to stylesheets, and scripts. Wikipedia - HTML Document: The entire structure of an HTML file, which includes the
<!DOCTYPE html>,<html>,<head>, and<body>tags. Wikipedia - Hyperlink: A clickable link created using the
<a>tag that directs users to another webpage or resource. Wikipedia - ID Attribute: An attribute used to uniquely identify an HTML element within a page. For example,
<div id="header">. Wikipedia - Image Tag:
<img>tag used to embed images in an HTML document. It uses thesrcattribute to specify the image source. Wikipedia - Input Element:
<input>tag used to create interactive controls in a web form, such as text fields, radio buttons, and checkboxes. Wikipedia - JavaScript: A scripting language used to create dynamic content and interactive elements on web pages. Wikipedia
- Label Tag:
<label>tag used to define labels for form controls, improving accessibility and usability. Wikipedia - Link Tag:
<link>tag used to link external resources like stylesheets to the HTML document. It is commonly used in the<head>section. Wikipedia - Meta Tag:
<meta>tag used to provide metadata about the HTML document, such as character encoding and viewport settings. Wikipedia - Navigation:
<nav>tag used to define a section of navigation links. It helps in organizing and grouping links together. Wikipedia - Ordered List:
<ol>tag used to create a list of items where each item is numbered sequentially. Wikipedia - Paragraph:
<p>tag used to define a block of text as a paragraph. It automatically adds space before and after the paragraph. Wikipedia - Section:
<section>tag used to define a thematic grouping of content, typically with its own heading. Wikipedia - Span Tag:
<span>tag used to apply styles or JavaScript to a part of the text without breaking the line. Wikipedia - Strong Tag:
<strong>tag used to give importance to text, typically rendered as bold. Wikipedia - Table:
<table>tag used to create a table for displaying tabular data. It uses<tr>,<td>, and<th>tags for rows, cells, and headers respectively. Wikipedia - Title Tag:
<title>tag defines the title of the HTML document, displayed on the browser’s title bar or tab. Wikipedia - Unordered List:
<ul>tag used to create a list of items with bullet points. Wikipedia - Video Tag:
<video>tag used to embed video files in an HTML document. It supports attributes likecontrols,autoplay, andsrc. Wikipedia - Iframe:
<iframe>tag used to embed another HTML page within the current page. Wikipedia - Link:
<a>tag used to create hyperlinks to other web pages or resources. Wikipedia - Meta Description:
<meta name="description" content="...">provides a brief summary of the web page’s content, often used by search engines. Wikipedia - Placeholder: The
placeholderattribute in form elements displays a hint or example of the expected input. Wikipedia - Progress Bar:
<progress>tag represents the completion status of a task. Wikipedia - Script Tag:
<script>tag used to include JavaScript code or link to external JavaScript files. Wikipedia - Select Element:
<select>tag used to create a drop-down list of options in a form. Wikipedia - Source Tag:
<source>tag used within<audio>and<video>tags to specify multiple media resources. Wikipedia - Style Tag:
<style>tag used to include CSS styles directly within an HTML document. Wikipedia - Summary Tag:
<summary>tag is used in conjunction with the<details>tag to provide a summary or heading for the content that can be expanded. Wikipedia - Table Header:
<th>tag defines a header cell in a table, usually displayed in bold and centered. Wikipedia - Table Data Cell:
<td>tag defines a standard cell in a table. Wikipedia - Table Row:
<tr>tag defines a row in a table. Wikipedia - Text Area:
<textarea>tag creates a multi-line text input field in forms. Wikipedia - Title Attribute: The
titleattribute provides additional information about an element, typically displayed as a tooltip. Wikipedia - Tooltip: A small pop-up box that appears when a user hovers over an element with a
titleattribute. Wikipedia - Video Controls: The
controlsattribute added to the<video>tag displays play, pause, and volume controls. Wikipedia - Web Storage: The HTML5 feature allowing web applications to store data locally in the browser using
localStorageandsessionStorage. Wikipedia - Web Worker: JavaScript code running in the background, separate from the main thread, allowing for parallel execution. Wikipedia
- XHTML: A stricter variant of HTML that follows XML rules. Wikipedia
- XML: Extensible Markup Language used to define rules for encoding documents in a format that is both human-readable and machine-readable. Wikipedia
- Meta Charset:
<meta charset="UTF-8">specifies the character encoding for the HTML document. Wikipedia - Meta Keywords:
<meta name="keywords" content="...">provides keywords related to the content of the page for search engine optimization. Wikipedia - Meta Robots:
<meta name="robots" content="...">provides instructions to search engines about indexing and following links. Wikipedia - Multimedia: Content that includes a combination of text, audio, video, and images. HTML provides elements like
<audio>,<video>, and<img>for multimedia. Wikipedia - Nav Tag:
<nav>tag is used to define navigation links within a document. Wikipedia - NOSCRIPT Tag:
<noscript>tag defines alternative content to be displayed when scripts are not supported or disabled. Wikipedia - Object Tag:
<object>tag is used to embed multimedia content like images, videos, or applets. Wikipedia - Output Tag:
<output>tag represents the result of a calculation or user action. Wikipedia - Picture Tag:
<picture>tag allows for the inclusion of different image sources for different scenarios, such as varying screen sizes or resolutions. Wikipedia - Preformatted Text:
<pre>tag displays text exactly as it is written in the HTML file, preserving spaces and line breaks. Wikipedia - Progress Element:
<progress>tag represents the progress of a task in the form of a progress bar. Wikipedia - Quote Tag:
<blockquote>tag is used for long quotations and is usually displayed with indentation. Wikipedia - Ruby Annotation:
<ruby>,<rt>, and<rp>tags are used to provide annotations or pronunciation guides for East Asian text. Wikipedia - Section Tag:
<section>tag defines a section in a document, such as a chapter or thematic grouping of content. Wikipedia - Source Set: The
srcsetattribute in the<img>tag provides a list of image sources with different sizes for responsive design. Wikipedia - Strong Emphasis:
<strong>tag is used to give strong emphasis to text, typically displayed in bold. Wikipedia - Template Tag:
<template>tag is used to declare fragments of HTML that are not rendered immediately but can be activated later via JavaScript. Wikipedia - Text Alignment: The
text-alignCSS property is used to align text within an element. Wikipedia - Textarea:
<textarea>tag is used to create a multi-line text input field in a form. Wikipedia - Title Attribute: The
titleattribute provides additional information about an element, often shown as a tooltip. Wikipedia - Video Controls: The
controlsattribute in the<video>tag adds video playback controls, such as play and pause. Wikipedia - Viewport Meta Tag:
<meta name="viewport" content="...">is used to control the layout on mobile browsers. Wikipedia - Web Storage API: Allows web applications to store data locally in the user’s browser. Wikipedia
- WebSocket: A communication protocol that provides full-duplex communication channels over a single TCP connection. Wikipedia
- XHTML: A reformulation of HTML as an XML application, which allows for stricter syntax and more robust document structures. Wikipedia
- XML Namespace: A method used in XML and HTML to avoid name conflicts by qualifying element and attribute names. Wikipedia
- XML Schema: A language used to define the structure and data types of XML documents. Wikipedia
- DOCTYPE Declaration: Specifies the version of HTML being used, ensuring correct rendering of the document. Wikipedia
- HTML5: The latest version of HTML that includes new elements and APIs for modern web applications. Wikipedia
- Accessibility: Ensuring that web content is usable by people with disabilities, often using ARIA attributes. Wikipedia
- ARIALANDMARK: A set of HTML attributes used to improve accessibility by defining regions and roles in a web page. Wikipedia
- ARIA Role: Attributes used to define the role of an element to assistive technologies. Wikipedia
- Data Attribute: Custom attributes added to HTML elements that store extra information. They start with
data-, such asdata-id="123". Wikipedia - Document Object Model (DOM): A programming interface for web documents that represents the structure of a document as a tree of objects. Wikipedia
- Dynamic HTML (DHTML): A collection of technologies used to create interactive and animated web pages by combining HTML, CSS, and JavaScript. Wikipedia
- Meta Tag: An HTML tag that provides metadata about the document, such as character encoding and author. Wikipedia
- Semantic HTML: Using HTML tags that convey meaning about the content they enclose, such as
<header>,<footer>, and<article>. Wikipedia - Server-Sent Events (SSE): A technology allowing servers to push real-time updates to web clients over HTTP. Wikipedia
- Shadow DOM: A web standard that allows developers to encapsulate a part of a web page with its own HTML, CSS, and JavaScript. Wikipedia
- Web Component: A set of standards for creating reusable custom elements with encapsulated functionality. Wikipedia
- Custom Elements: A feature of Web Components that allows the creation of custom, reusable HTML tags. Wikipedia
- Template Literals: A feature in JavaScript allowing for embedded expressions and multi-line strings. Wikipedia
- Service Workers: JavaScript scripts that run in the background and can manage caching, push notifications, and background sync. Wikipedia
- Progressive Web Apps (PWA): Web applications that offer offline capabilities, push notifications, and fast performance similar to native apps. Wikipedia
- Content Security Policy (CSP): A security standard to prevent various types of attacks, including Cross-Site Scripting (XSS) and data injection. Wikipedia
- Cross-Origin Resource Sharing (CORS): A security feature that allows or restricts resources requested from another domain. Wikipedia
- URL: Uniform Resource Locator, the address used to access resources on the web. Wikipedia
Conclusion:
HTML is a fundamental technology for creating web pages and applications. Understanding the various terminologies and elements of HTML is crucial for developing well-structured, functional, and accessible web content. From basic tags like <a> and <div> to more advanced concepts like Web Storage and Shadow DOM, each terminology plays a unique role in web development. Mastery of these terms and their applications allows developers to build sophisticated web experiences, ensuring both usability and compatibility across different browsers and devices. As the web continues to evolve, keeping up with these terminologies and understanding their applications will remain essential for effective web development.