<h2>Introduction to the course</h2><p>Hypertext Markup Language or HTML is widely used in web page writing, in fact, it&#x27;s the main ingredient of all web pages. The Markup Language instructs browsers how to display documents, and determines structure.</p><h2>Who is the course for?</h2><p>HTML is typically paired with CSS the combination of those two will help you succeed in creating your first ever web pages and website. This course will cover HTML while we&#x27;ll dive into CSS when you&#x27;re finished here.</p>

HTML

<h2>What does this lesson cover?</h2><p>We&#x27;ll be scratching the surface of HTML by providing an overview of Markup Languages as a whole and how HTML fits into that category.</p><p>We&#x27;ll be referring to the creation and development of HTML and its latest version.</p><p>You&#x27;ll encounter the first-ever lesson quizzes of the course and they will help you kickstart your HTML journey.</p>

Introduction

<h2>What does this lesson cover?</h2><p>Attributes define additional characteristics or properties of the elements. This lesson aims at covering those characteristics and introducing the concept of Global Attributes.</p><p>Global attributes are extremely common in HTML, the trick is they may have some effect and they may have no effect at all, we&#x27;ll be covering those intricacies as well.</p>

Attributes

<h2>What does this lesson cover?</h2><p>Links are a widely used topic in HTML. A link or hyperlink is a connection from one web page to another. </p><p>This lesson will assess how exactly HTML covers hyperlinks both syntax and structure-wise. We&#x27;ll thus use our newly gained knowledge in the area to complete lessons quizzes.</p>

Links

<h2>What does this lesson cover?</h2><p>The division tag, although, it is most commonly known as &lt;div&gt; tag is a generic container for flow content.</p><p>This lesson, focuses on the div tag and expands on its definition, but not only.</p><p>Developers will find a variety of code examples with div that support the essence of the lesson.</p><p>We&#x27;ll then go into creating HTML layouts with &lt;div&gt;.</p>

div Tag

<h2>What does this lesson cover?</h2><p>In HTML, metadata is provided with the &lt;meta&gt; tage.</p><p>This lesson opens the brackets of metadata and what it includes. We&#x27;ll also be going into interesting topics that cover the information that can&#x27;t be found on the website, webpage indexing, search results, etc.</p>

Headings

<h2>What does this lesson cover?</h2><p>HTML is written in the form of HTML elements consisting of markup tags. This lesson will cover the structure of the tags, how they work, and why exactly we need them when working with HTML.</p><p>We&#x27;ll also expand on comments in HTML, we&#x27;ve talked about the importance of comments in previous courses, however, the necessity of comments in HTML is essential, and we explain why.</p>

HTML Structure

<h2>What does this lesson cover?</h2><p>Paragraphs in HTML are defined with the use of the HTML &lt;p&gt; element. Paragraphs start from a new line, browsers add some while spaces automatically.</p><p>More on the topic of paragraphs and working with them, including references to important concepts such as Horizontal Lines, White Spaces, and Preserved Formatting will be elaborated upon individually in the lesson with the help of code snippets and lesson quizzes.</p>

Paragraphs

<h2>What does this lesson cover?</h2><p>Ids are a slippery slope in HTML. the id value should keep its uniqueness as no two HTML elements can hold the same id.</p><p>This lessons aims at expanding on the concept of ids, learning their syntax and structure in HTML code, and comprehending when and how to use them efficiently and effectively to abid by the simple rule mentioned above.</p>

id Attribute

<h2>What does this lesson cover?</h2><p>In this lesson, we&#x27;ll be referencing Anchors as elements in HTML.</p><p>The bookmark anchors are used to create hyperlinks between a source anchor and a destination anchor. </p><p>We&#x27;ll further elaborate on the definition of bookmark anchors along with code examples and lesson quizzes to simplify the learning process. </p>

Anchors

<h2>What does this lesson cover?</h2><p>HTML Forms are required to collect different kinds of user inputs. </p><p>In this lesson, we&#x27;ll be going over the contents of Forms, which could include input boxes, submit buttons, checkboxes, etc and we&#x27;ll refer to the &lt;form&gt; tag which essentially is how you create forms in React.</p><p>Other topics that are up for coverage are Text Fields, Radio Buttons, Submit Buttons, Password Fields and other Input Elements.</p>

Forms

<h2>What does this lesson cover?</h2><p>Scalable Vector Graphics or SVGs define vector-based graphics in XML format. An SVG image is drawn out using a series of statements that follow the XML schema. That means SVG images can be created and edited with any text editor.</p><p>Find more interesting facts about the importance of SVGs inside.</p>

Working with SVG

<h2>What does this lesson cover?</h2><p>After assessing tags it&#x27;s time to use that knowledge and compare and contrast tags with a new concept– elements.</p><p>An element in HTML is considered an individual component of an HTML document.</p><p>We&#x27;ll thus dive further into this new concept and define terms like Empty HTML elements, Arrangments, and Nested elements. All of the listed concepts play an essential role in HTML.</p>

Tags & Elements

<h2>What does this lesson cover?</h2><p>HTML text formatting entails the enhancement of text to create a visually pleasing look. There are multiple HTML tags made for the formatting of texts to turn them more attractive, visually appealing, and attention-grabbing for users. </p><p>In this lesson, we&#x27;ll be referencing the famous bold tag, the italic tag, the em tag, and the underline tag.</p>

Text Formatting

<h2>What does this lesson cover?</h2><p>In this lesson, we&#x27;ll be covering the class attributes and thus, using them in HTML. Class attributes are used to pinpoint class names in a style sheet.</p><p>The main aim of the lesson is to teach the technique of using the class attribute correctly and efficiently in HTML with the help of code examples and lesson quizzes.</p>

class Attribute

<h2>What does this lesson cover?</h2><p>In this lesson, we&#x27;ll be covering Images as elements in HTML.</p><p>We&#x27;ll define the usage and structural characteristics of Images, their size, and, thus, ease into the introduction of the Picture Elements.</p><p>The lesson comes equipt with code snippets and lesson quizzes that help implement theory into practice.</p>

Images

<h2>What does this lesson cover?</h2><p>Lists are used to present a list of information in well-formed and semantic way. </p><p>This lesson will expand on the defintion and usage of lists as well as introduce the three types of lists developers will encounter when working with HTML: Unordered Lists, Ordered Lists and Description Lists.</p>

Lists

<h2>What does this lesson cover?</h2><p>Embedding audio on your webpage with HTML can be executed with the &lt;audio&gt; tag.</p><p>In this lesson, we expand on the implementation of the &lt;audio&gt; tag in code and its behavior along with specific keywords you could use to get your hands on specific information such as browser controls, etc.</p><p>Additionally, we&#x27;ll cover the object element and its usage.</p>

Audio

Lesson Challenge

<h2>What does this lesson cover?</h2><p>The HTML text fundamentals include a wider range than simply underlining texts (or other similar actions).</p><p>In this lesson, we&#x27;ll be focusing on the more structure-based text formatting styles that HTML has to offer developers.</p><p>We’ll specifically reference abbreviations, the mark tag, and subscript along with supporting examples and quizzes to put your knowledge to practice.</p>

Advanced Text Formatting

<h2>What does this lesson cover?</h2><p>The title attribute specifies extra information about an element. The information is most often shown as a tooltip text when the mouse moves over the element. The title attribute can be used on any HTML element (it will validate on any HTML element.</p><p>This lesson will cover the syntax and correct usage of the title attribute with the help of code examples and lesson quizes.</p>

title Attribute

<h2>What does this lesson cover?</h2><p>Arranging data in rows and columns, meaning, creating tabular content is possible thanks to HTML tables.</p><p>This lesson expands on the &lt;table&gt; element that permits HTML developers to display tabular content.</p><p>Aside from expanding further on the specifics when creating tables, this lesson introduces a new concept: Spanning.</p>

Tables

<h2>What does this lesson cover?</h2><p>This lesson is an homage to implementing videos on your webpage with HTML.</p><p>That action can be executed with the &lt;video&gt; tag paired with attributes that we will uncover in this lesson.</p><p>Additionally, we&#x27;ll get into embedding videos in web pages more thoroughly with supporting lesson quizzes.</p>

Video

<h2>What does this lesson cover?</h2><p>This lesson covers the inline styling of elements in HTML with the help of the style attribute. This lesson will expand on how to override the global style with inline styles.</p><p>We&#x27;ll expand on the syntax and structure of the style with the help of code examples and lesson quizzes that put your knowledge to practice.</p>

style Attribute

<h2>What does this lesson cover?</h2><p>This lesson covers and defines iFrame, why we need it, and thus, how developers can embed it into their HTML-powered web page.</p><p>This lesson will reference the &lt;iframe&gt; tag and the attributes used with iFrames, as long as code snippets that perfectly depict the usage of the said tag and attributes (which we will cover in the lesson).</p>

iFrame

What is HTML Form

HTML Forms are required to collect different kinds of user inputs, such as contact details like name, email address, phone numbers, or details like credit card information, etc.

Forms contain special elements called controls like input boxes, checkboxes, radio-buttons, submit buttons, etc. Users generally complete a form by modifying its controls e.g. entering text, selecting items, etc., and submitting this form to a web server for further processing.

<p>The <strong><samp>&lt;form&gt; </samp></strong>tag is used to create an HTML form</p>

Fill Missing

Input Element

The input element is the most commonly used element within HTML forms. It allows you to specify various types of user input fields, depending on the type attribute.

<p>An input element can be a<strong> text field</strong>, <strong>password field</strong>,<strong> checkbox</strong>, <strong>radio button</strong>, <strong>submit button</strong>, <strong>reset</strong> <strong>button</strong>, <strong>file select box</strong>, as well as several new input types introduced in HTML5.</p>

Select Correct Answer

Text Fields

<p>Text fields are one-line areas that allow the user to input text. Single-line text input controls are created using an <samp><strong>&lt;input&gt; </strong></samp>element, whose type attribute has a value of the <samp><strong>text</strong></samp></p>

Write Missing

<p>Create a <samp><strong>text </strong></samp>field input.</p>

Password Field

Password fields are similar to text fields. The only difference is that characters in a password field are masked, i.e. they are shown as asterisks or dots. This is to prevent someone else from reading the password on the screen.

<p>This is also a single-line text input control created using an <samp><strong>&lt;input&gt;</strong></samp> element whose type attribute has a value of <samp><strong>password</strong></samp></p>

<p>Create a <strong>password </strong>input.</p>

Radio Buttons

<p>Radio buttons are used to let the user select exactly one option from a pre-defined set of options. It is created using an <strong><samp>&lt;input&gt;</samp></strong> element whose type attribute has a value of <strong><samp>radio</samp></strong></p>

<p>Create input elements whose type attribute has a value of <strong>radio</strong>.</p>

Submit Buttons

A submit button is used to send the form data to a web server. When submit button is clicked the form data is sent to the file specified in the form&#x27;s action attribute to process the submitted data.

A reset button resets all the forms control to default values.

<p>Create a <strong>submit </strong>button.</p>

<h2>What does this lesson cover?</h2><p>This section serves as a simple overview of HTML, just to let future HTML enthusiasts dip their toes into the HTML pool.</p><p>Aside from an introductory lesson, we immediately dive into the essentials of HTML– tags and elements.</p>

Getting Started

<h2>What does this section cover?</h2><p>This section references the entire structure of an HTML web page. We&#x27;ll be covering optional and necessary formatting types, and differentiating between the bunch with individualized lesson quizzes and code-snippet examples for developers to catch the intricacies in structuring and syntax.</p><p>Specifically, we&#x27;ll talk about the Headers and Beginner/Advanced Text formattings.</p>

Formatting

<h2>What does this lesson cover?</h2><p>HTML attributes are particular words that provide additional information about the elements and/or attributes that act as the modifier of the said HTML element.</p><p>Every element or tag you encounter in HTML can potentially have attributes so that the behavior of the said tag/element is identified.</p><p>This lesson will cover the concept of attributes on a deeper level while introducing types of attributes such as the id Attribute, the class Attribute, the title Attribute, and the style Attribute.</p>

<h2>What does this lesson cover?</h2><p>Every HTML file consists of HTML elements that are defined in code through the usage of tags.</p><p>This lesson expands on Links, Anchors, and Images.</p><p>Each element listed is thoroughly referenced in the lesson with supporting code snippets that depict the element&#x27;s structure, syntax, and behavior in code.</p>

Elements

<h2>What does this section cover?</h2><p>HTML layout aims at making your web page layout look better, not only through appearance but efficiency.</p><p>Efficiency entails the implementation of various elements, all of which we will be covering in this section and others.</p><p>The focus here however is on Lists, Tables, and Forms.</p><p>We&#x27;ll be going over each and every one of those concepts individually, with the implementation of lesson quizzes to help developers put theory to practice.</p>

Layout