4.39 out of 5
4.39
1679 reviews on Udemy

HTML5 – From Basics to Advanced level (2021)

A beginner's guide for HTML5. Learn all concepts of HTML5 (with hands-on assignments and projects.)
Instructor:
EdYoda Digital University
101,554 students enrolled
English [Auto]
Learn to create simple web pages using HTML5
Learn the basics tags of HTML
To create Tables in HTML
To create customizable forms and add form validation in HTML
To include multimedia(audio,video, images) in your web page
To create your own vector graphics using SVG
4 projects to test your knowledge

****UPDATE [01-Jan-2021]:  New Content Added – HTML5 !!!!!****

20 NEW videos added

New Sections on:

  • Forms
  • Embedding Multimedia
  • Vector Graphics
  • And, a Final Project!

************************************************************

 

Are you a beginner? Do you want to learn web development but do not have any idea where to start?
If yes, then this is THE perfect course for you. In the HTML course, you will learn all the concepts of HTML5, starting from its history to its modern structure. We will cover all the tags which are most widely used in the world of web development. Simultaneously, we will show you some of the best practices of code-writing in HTML5.

HTML is short for ‘HyperText Markup Language’, which means HTML is only used to create a structure of the web page. But without some styling, no assignment or project will look good. Thus, we will cover some portion of the CSS required to create simple web pages.

This HTML course will be beneficial for all who are looking to start their career in the web development field and aspire to become a Frontend or Full-stack web developer. This HTML course will be the first step towards your goal to become a web developer. To continue this journey, we would recommend you complete the other languages and skills like CSS, JavaScript, ES6, React.

Check out our profile to find related courses that are designed just like this.

 

PS: More lectures will be uploaded soon.

Who’s teaching you in this course?

I am a Computer Science graduate highly rated instructor with a rating of 4.3 and more than 200k students on Udemy, I have been part of the corporate circle since my college days. In my early days, I was part of a startup team delivering production grid android apps. Currently, I am a lead developer at EdYoda. I’m responsible for the entire front-end development & integration with the back-end. React, Python, Django is my areas of expertise. I have been delivering corporate training for Android, React, JavaScript, Python & Django. I have eyes for details & that makes me suited for delivering a finished product. I’m a fitness freak & working out is the favorite thing to do in my spare time.

I want everyone to enjoy the learning process and I have shared my knowledge that will be helpful for you.

Why learn HTML?

HTML is at the Core of the Internet. Learning HTML and CSS allows you to build your own websites, gives you a skill which you can use to improve work at your current Job, and also opens up an opportunity to transition into a Career in tech and :
1. HTML is Easy to Learn and Use
2. HTML is Free
3. HTML is supported by all Browsers
4. HTML is Basic of all Programming Languages

and many more.

Get started with the skill.

Enroll now!! see you in class.


Happy learning
Team Edyoda

HTML Introduction

1
HTML - Introduction

Hey guys, in this course, we will learn all about HTML5.

We will start from basic topics like adding headings, paragraphs, images, etc and will move towards more advanced topics like adding forms, vector graphics, multimedia and so on.


Hope you are excited to start your journey to become a Web Developer!!

2
HTML - Code Editor Setup

Hey guys, in this video we will explore different code editor options. We will talk about - Notepad, Codepen.io and Visual Studio Code.

3
HTML - Structure of an HTML Document

Hey guys, in this video we will learn about the document structure of an HTML page, What are HTML tags, What different tags mean and much more.

HTML Basics

1
HTML - Adding Heading in a Web page

Hey guys, in this video we will learn all about heading in HTML.

2
HTML - Adding Paragraph in a Web page

Hey guys, in this video we will learn how to add a paragraph in a webpage? How add line breaks? How to make text bold? How to make text italics? and much more.

3
HTML - Adding Images in a Web page

Hey guys, in this video we will learn how to add images in an HTML Web Page

4
HTML - Creating Ordered and Unordered Lists

Hey guys, in this video we will learn all about Lists in HTML, Different types of lists and much more.

5
HTML - Adding Styles and Formatting HTML Elements

Hey guys, in this video we will learn How to add styles and format our HTML elements to make them look pretty and neat.

6
HTML - Block and Inline Display Values

Hey guys, in this video we will learn about Block and Inline Elements.

7
HTML - Adding group styles using Class attribute

Hey guys, in this video we will learn how to add styles to a group of HTML elements using the class attribute.

8
HTML - Adding Hyperlinks in a Web page

Hey guys, in this video we will learn how to add links in an HTML Webpage.

9
HTML - Using links to connect Web pages

Hey guys, in this video we will learn how to redirect from one webpage to another.

10
HTML - Uniquely Identify HTML Element by using ID attribute

Hey guys, in this video we will see how to uniquely identify HTML elements by using the ID attribute.

11
HTML - Mini-Project 1: Favorite Foods Web page

Hey guys, this is the project to create a static page of Favourite Foods.

Attempt this project to brush-up on the concepts that you have learned so far.

Use codepen.io to create this project.

12
HTML - Mini-Project 1: Solution

Hey guys, in this video we have designed the Solution for the Mini-Project 1: Favourite Foods Problem statement.

New Features in HTML5

1
HTML - What makes HTML5 Better?

Hey guys, in this video we will learn about all the new features in HTML5.

2
HTML - New Elements & Attributes in HTML5

Hey guys, in this video we will explore all the new elements and attributes in HTML5

3
HTML - Design Page Structure Using Semantic Elements

Hey guys, in this video we will learn how to design page structure using the HTML5 semantic elements.

4
HTML - New Semantic Elements: and

Hey guys, in this video we will explore how to use the new <details> and <summary> semantic tags.

HTML Tables

1
HTML - Introduction to Tables

Hey guys, in this video we will learn how to design tables in HTML.

2
HTML - Span table rows and columns

Hey guys, in this video we will learn how to span rows and columns across tables.

3
HTML - Design layouts using Tables

Hey guys, in this video we will learn how to design a gallery grid using tables.

4
HTML Tables - Practice Problem 1

Hey guys, this is the practice problem for the tables module. Try it on codepen.io.

5
HTML Tables - Practice Problem 1: Solution

Hey guys, this is the solution for the Table Practice Problem that I gave in the previous video.

HTML Forms

1
HTML - Introduction to Forms

Hey guys, in this video we will learn How to create a basic login form using HTML.

2
HTML - Form Input Types

Hey guys, in this video we will explore more about input types in forms

3
HTML - Adding Styles to Forms

Hey guys, in this video we will learn how to add styling to HTML form and it's elements.

4
HTML - Form Methods: GET and POST

Hey guys, in this video we learn all about the two form methods - GET and POST.

5
HTML - New Form Elements

Hey guys, in this video we will explore the new form elements introduced in HTML5.

6
HTML - New Form Input Types

Hey guys, in this video we will explore the new form input types introduced in HTML5

7
HTML - New Form Input Attributes

Hey guys, in this video we will explore the new form input attributes introduced in HTML5.

8
HTML - Form Validation

Hey guys, in this video we will learn about Form Validation.

9
HTML - Forms Practice Problem 1

Hey guys,


These are the details for the Forms Practice Problem 1:


Image Links:

  • Google Logo: http://pluspng.com/img-png/google-logo-png-open-2000.png

  • Facebook Logo: https://cdn4.iconfinder.com/data/icons/social-media-icons-the-circle-set/48/facebook_circle-512.png

  • Github Logo: https://image.flaticon.com/icons/svg/25/25231.svg

  • LinkedIn Logo: https://cdn4.iconfinder.com/data/icons/social-media-icons-the-circle-set/48/linkedin_circle-512.png


Webpage:

Background Color Code: #f2f6ff


Form:

Border Color: #ccc

Border Width: 1px


Form Heading:

Font Size: 32px

Padding-Top: 56px

Padding-Bottom: 32px


Social Icons:

Width: 50px

Height: 50px

Padding Top and Bottom: 16px

Padding Left and Right: 32px


Input Fields Container:

Padding Top: 80px

Padding Bottom: 40px

Padding Left and Right: 80px


Input Box:

Font Size: 18px

Padding Bottom: 12px

Margin Bottom: 36px

Border Top, Left, Right: 0

Border Bottom: 1px solid #ccc


Submit Button:

Background Color: #0056ff

Padding Top and Bottom: 12px

Padding Left and Right: 24px

Font Size: 18px

Font Color: white

Border: None


Have Fun !!

10
HTML - Forms Practice Problem 1 - Solution

Hey guys, this is the video solution for the Forms Practice Problem 1.

Embedding Multimedia

1
HTML - Adding Videos in a Webpage

Hey guys, in this video we will learn How to add videos in a webpage.

2
HTML - Adding Audio in a Webpage

Hey guys, in this video we will learn How to add audio files in a webpage.

3
HTML - The element

Hey guys, in this video we will learn how to play unsupported video and audio files in HTML5.

4
HTML - Embed YouTube Videos in a Web page

Hey guys, in this video we will learn how to embed a youtube video in an HTML page.

Vector Graphics

1
HTML - Introduction to SVG

Hey guys, in this video we will learn about

  • What is SVG in HTML5?

  • How to create line using SVG?

2
HTML - Create circle using SVG

Hey guys, in this video we will learn how to create a circle using SVG element.

3
HTML - Create a rectangle using SVG

Hey guys, in this video we will learn how to create a rectangle using SVG.

Final Project

1
HTML - Final Project

Hello guys, this is Final Project for the HTML Course. Give it your best. I can't wait to see what all you guys design. All the Best :)

You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.4
4.4 out of 5
1679 Ratings

Detailed Rating

Stars 5
759
Stars 4
634
Stars 3
232
Stars 2
24
Stars 1
28
15cee34a207229f55708b5f537e177ad
30-Day Money-Back Guarantee

Includes

4 hours on-demand video
Full lifetime access
Access on mobile and TV
Certificate of Completion