What you'll learn

HTML5 All Features Included
Creating Web Page
Hands on project
Responsive Design

Course content

13 sections • 56 lectures • 7h 43m total length

Introduction and Course Objective3:03
Introduction and Course Objective
Who is this course for?0:44
Who is this course for?
What is HTML?3:25
What is HTML, How it is used in webpages

HTML Style5:53
HTML Style Attribute and Style tag
HTML Formatting7:48
HTML Formatting Elements

Formatting elements were designed to display special types of text:

<b> - Bold text
<strong> - Important text
<i> - Italic text
<em> - Emphasized text
<mark> - Marked text
<small> - Smaller text
<del> - Deleted text
<ins> - Inserted text
<sub> - Subscript text
<sup> - Superscript text
HTML Quotations9:58
HTML Quotations and cite elements:
<blockquote>,<q>, <abbr>, <address>, <cite>, and <bdo>
HTML Comments5:11
HTML comments are not displayed in the browser, but they can help document your HTML source code.
HTML Colors15:06
HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or HSLA values.
An RGB color value represents RED, GREEN, and BLUE light sources.
An RGBA color value is an extension of RGB with an Alpha channel (opacity).
rgb(red, green, blue)
Each parameter (red, green, and blue) defines the intensity of the color with a value between 0 and 255.
This means that there are 256 x 256 x 256 = 16777216 possible colors!
A hexadecimal color is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color.
HSL stands for hue, saturation, and lightness.

HSLA color values are an extension of HSL with an Alpha channel (opacity).

i.Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue.

ii.Saturation is a percentage value. 0% means a shade of gray, and 100% is the full color.

iii.Lightness is also a percentage value. 0% is black, and 100% is white.
HTML CSS8:14
CSS stands for Cascading Style Sheets.
The word cascading means that a style applied to a parent element will also apply to all children elements within the parent. So, if you set the color of the body text to "blue", all headings, paragraphs, and other text elements within the body will also get the same color (unless you specify something else)!
CSS can be added to HTML documents in 3 ways:
Inline - by using the style attribute inside HTML elements
Internal - by using a <style> element in the <head> section
External - by using a <link> element to link to an external CSS file

HTML Lists9:16
HTML Lists:
Unordered List
Ordered List
Description List
HTML Block and Inline Element7:23
HTML Block and Inline Elements
HTML Div10:02
HTML Div Element:
-The <div> element is used as a container for other HTML elements.
-The <div> element is by default a block element, meaning that it takes all available width, and comes with line breaks before and after.
HTML Classes8:01
-The HTML class attribute is used to specify a class for an HTML element.
-Multiple HTML elements can share the same class.
-The class attribute is often used to point to a class name in a style sheet. It can also be used by a JavaScript to access and manipulate elements with the specific class name.
HTML Id13:42
The id attribute is used to specify a unique id for an HTML element
The value of the id attribute must be unique within the HTML document
The id attribute is used by CSS and JavaScript to style/select a specific element
The value of the id attribute is case sensitive
The id attribute is also used to create HTML bookmarks
JavaScript can access an element with a specific id with the getElementById() method
HTML Iframes9:28
The HTML <iframe> tag specifies an inline frame
The src attribute defines the URL of the page to embed
Always include a title attribute (for screen readers)
The height and width attributes specify the size of the iframe
Use border:none; to remove the border around the iframe

HTML JavaScript6:32
HTML File Paths6:08
<img src="picture.jpg"> The "picture.jpg" file is located in the same folder as the current page
<img src="images/picture.jpg"> The "picture.jpg" file is located in the images folder in the current folder
<img src="/images/picture.jpg"> The "picture.jpg" file is located in the images folder at the root of the current web
<img src="../picture.jpg"> The "picture.jpg" file is located in the folder one level up from the current folder
HTML Head10:53
You can also use
Script tag
base tag
and link tag
under head tag
HTML Layout20:31
HTML Layout Techniques

There are four different techniques to create multicolumn layouts. Each technique has its pros and cons:

1.CSS framework
2.CSS float property
3.CSS flexbox
4.CSS grid
HTML Responsive11:17
Responsive site
HTML Computercode6:25
The <kbd> element defines keyboard input
The <samp> element defines sample output from a computer program
The <code> element defines a piece of computer code
The <var> element defines a variable in programming or in a mathematical expression
The <pre> element defines preformatted text
HTML Semantics5:40

Requirements

This course is designed for absolute beginners with little to no coding experience.
If you're curious about web development and eager to create your own websites, you're in the right place. We'll break down complex concepts into easy-to-understand lessons, making it accessible for everyone.

Description

Why HTML?

HTML, or HyperText Markup Language, is the backbone of every webpage on the internet. It's the language that allows us to structure content on the web and create the beautiful sites we interact with daily. Whether you're an aspiring web developer, a digital marketer, or someone who just wants to understand how websites work, mastering HTML is an essential skill.

What Will You Learn?

In this course, we'll start from the basics and gradually delve into more advanced concepts. You'll learn how to create the structure of a webpage, format text, add images, create hyperlinks, and even embed multimedia elements. We'll cover the latest HTML5 features and best practices to ensure you're equipped with the skills demanded by the industry.

Course Highlights:

Hands-On Projects: We believe in learning by doing. Throughout the course, you'll work on practical projects that reinforce the concepts you've learned.
Responsive Design: Learn how to make your web pages look great on any device, from desktops to tablets and smartphones.
Code Along: Follow along with me as I code in real-time. This will help you understand not just the "what" but also the "how" of HTML.
Interactive Quizzes: Test your knowledge and reinforce what you've learned with our interactive quizzes.

Who this course is for:

Beginner Friendly HTML Course

What you'll learn

Explore related topics

Course content

Introduction3 lectures • 7min

Tag, Element and Document Structure3 lectures • 8min

Code Editor, Install and Setup3 lectures • 13min

Heading Tag, HTML Element,HTML Attribute ,Paragraph Tag4 lectures • 23min

HTML Styles,HTML Formatting,HTML Quotations,HTML Comments,HTML Colors, HTML CSS6 lectures • 52min

HTML Link,Image,Favicon,Page Title,Tables6 lectures • 1hr 8min

HTML Lists,Block and Inline,Div,Classes,Id6 lectures • 58min

HTML JavaScript,File Paths,Head,Layout,Responsive,Computercode,Semantics7 lectures • 1hr 7min

HTML Style Guide,Entities,Symbols,Emojis,Charsets,URL Endcode,HTML Vs XHTML7 lectures • 40min

HTML Forms5 lectures • 1hr 25min

Requirements

Description

Who this course is for: