Learn HTML, A practical guide from scratch to HTML 5
3.6 (68 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,720 students enrolled

Learn HTML, A practical guide from scratch to HTML 5

A course that teach you to write every element of html. Design your own templates with the help of free exercise files.
3.6 (68 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,720 students enrolled
Published 4/2015
English [Auto]
Current price: $59.99 Original price: $99.99 Discount: 40% off
1 day left at this price!
30-Day Money-Back Guarantee
This course includes
  • 3 hours on-demand video
  • 2 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Create your first web page
  • Do's and Don't about HTML
  • Start your journey with web development
  • Create 5 simple template to gain confidence
Course content
Expand all 31 lectures 02:58:42
+ Introduction
2 lectures 07:08

You will love the concept behind the course. The course is totally based on practical first and then covering best practice of HTML. The course will start from HTML 5 concepts and will then discuss about what is right and what should not be done.

Preview 02:34

There are tremendous about of editors out there on web, some are paid and some are free. This movie discuss a lot of editors that will help you to choose right one for you. For this entire course we will use Brackets as an editor to create our HTML files. Feel free to choose your favourite editor.

Preview 04:34
+ How to get Exercise files
1 lecture 02:34

This video is a walk through for getting exercise file for this course. These exercise files will help you to get started quickly and make error free files of code

Preview 02:34
+ Let's learn everything about HTML
22 lectures 02:24:01

Before we move on and discuss all the tags and their attributes, let us discuss a big picture. This movie will cover a few essential part of HTML that you will find everywhere on the web. Stuff like headings, paragraph, images and links are most common ingredients for web.

Preview 07:36

In HTML, there are few block level elements and few inline level elements. Block level elements take separate space on the web page while inline level elements works in side the block level element and imply their property within the block level of content

Block level and inline levels

Attributes are very important part of any tag. All tags comes with some extra properties that can be used using their attributes. Although most of the attributes can be implemented from style sheets but in order to apply few styles, we need to use some attributes first.

What are attributes

Heading tags are the most simplest possible tags in HTML, what comes next is bit tricky. Most of the new web developers don't understand the proper usage of h1, h2 ... tags. This movie will help you to understand the proper structure of heading tags.

do's and don't of heading tags

Next comes up the paragraph tag. You can simply add up paragraph on a web page without using any tag but this would not be a good idea. You want a proper structure for your webpage. Paragraph are unavoidable part of web page and a proper understand of laying out paragraph will help you to creative content.

learning the paragraph tag

Attributes can do a lot. A lot of web page don't even need a style sheet, if they are basic. The way to achieve this is to style your text. While styling text we need to understand that just looking is not important, there should be a balance between looks and readability.

Styling the text

We cannot rely on attributes of parent tag all the time. There are few specific words that we want to be bold or italic or marked up. This movie will teach you all those methods in just one go. So, sit back enjoy this movie and make sure that you make some edits to the exercise files too.

Inline formatting of paragraph

What we miss most among the most new web developers is the proper understanding of usage of wide variety of tags. You can apply tags like p and br and can make address look like address format. But you don't need to do that when you have address tag with you. A proper and well structured HTML is always easy to style up.

address and quotes markups

Commenting you code in any programming is a very good habit to develop. Specially in case of web because in html and css, things easily go wild and deep. A proper set of comments will help you come back later and edit your code easily. We will also discuss to format and put computer codes and output on the web page.

Comments and computer codes

Although the course says HTML, but it is hard to avoid CSS when we talk about HTML. To make even the simplest good looking web page, we need to put some styles to the page. There are two ways to do so. One using style tags in the head and other to put all styles in separate web page and link that page to html.

Internal and external CSS

Links are important part of HTML. Links are also confusing at some time, specially when we talk about relative and absolute path. But you don't need to worry about these absolute and relative things. Just remember these guidelines and you will always set right link.

Deep talk about links

Images are important for good visual. A web page with good image will change the looks dramatically. Most of the styles with images are set using style sheets but a few attributes are kind of compulsory to learn to design a creative web page.

deep talk about images

Table is a nice and clean way to put data on web page. For a long time on web, tables were also used to structure web page and this method is now no longer valid. Still, we need to understand a lot about tables, their style properties and structure.

tricky tables in html

Creating site menu is simple using list tag, but mostly dependent on CSS properties. In this movie we will try to cover menu or navigation of site using list and we will try to include some CSS properties too

Creating a site menu with list tag

After menu, we need to give a structure to the site. We call the structure of site as body. With the help of div tags we can give horizontal as well as vertical structure to the site. Having a division in site gives us more flexibility in order to give styles with css

Creating site body with div tags

Structure is the most important part of creating a website. A website should be structured properly so that it is indented into each other. It help us to create proper css for the website.

Structure is the most important part of html

Today's market demand is the responsive website. Responsive website is not from the extra ordinary world, it's just the trick managed by CSS. In this movie we will understand how we can create responsive website. Although we will learn about Bootstrap in the future series to manage responsive sites.

How to create responsive sites

Embedding videos in site is now a days very essential. YouTube gives us the ability to just paste the code and embed the video as an iframe. This helps us to not to worry about disk space of the website as youtube manage all of this for us

Putting youtube videos on site

Interacting with the user is one the most important part of any web application. In this movie we will learn about form tag that is used to interact with the user. There are a number of way by which we can do this, like text box or radio buttons

Interacting with the users in html page

Using the exercise file of this movie, you will be able to learn more type of form quickly. We will learn about text type of forms, datatype of forms and more such types of forms in this movie.

More types of forms for user interaction

HTML 5 introduced us with variety of new forms. Exercise of this movie will will help you to quickly grab the syntax of new types of form in HTML 5. Some of the new types are not yet supported by Internet Explorer so be careful while using these new forms

New forms in html 5

Having just new forms is not possible, so HTML 5 has given us various new attributes that we can use with these new forms. These new forms makes the user interaction more easy and powerful.

Special html 5 attributes of form
+ Moving to structure of web interface
5 lectures 16:59

Most web developers don't look at this angle but structure of an HTML page is the most import part of web design. A nicely structured website is easy to use and easy to implement CSS on it. Make sure that you don't just put random div at every place. Use every tag wisely

moving to HTML 5 core structure

HTML 5 gives us new block level tags like header, article, aside and footer. In old days, we used to manage all these with class and id attributes in the div tags. But now HTML 5 has given us the feature to select these sections into the css easily

splitting up the chunks

Web is advancing a lot. Old time was all about sharing web pages with text, but things have changed a lot. Now we can share rich media like audio and video. Considering this, HTML 5 has given us the ability to put audio and video tag

adding audio and videos to html files

evryone, out there is interested in learning drag and drop ( or similar) feature from html but the truth is that you cannot learn directly, it requires a few skills of javascript to accomplish the task. So first get your hand dirty with javascript basics and then you can proceed for this level of HTML

What about drag drop and geolocation

This guide is a quick look for HTML colour guide, although we recommend to take help from IDE for this purpose, still a quick look at this file will get you some idea.

Colour reference for html
5 pages
+ End note
1 lecture 00:00

Before we end up this series, here is our final note, but this series is not complete as it is a part of complete web development course and soon expect courses on CSS, javascript and bootstrap

End Note
3 pages

A quiz to analyze your progress and learning skills. It will give you more confidence but cannot beat the hand coding of codes

A quiz to analyze your progress and learning skills
6 questions
  • Basic computer skills like copy, create a folder
  • Text editor (any free editor will work)
  • Exercise files (available for free with course)

What is HTML?

HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. It is written in the form of HTML elements consisting of tags enclosed in angle brackets (like html). HTML was designed to share web document but internet has evolved a lot since. Now we can share video and audio too.

Why should I learn it?

In Today's computer centric world, where coding skill comes up with thousands of jobs opportunity, HTML is one of the core skills to get friendly with computer programming. Things doesn't just end up with HTML but a whole world will get open in front of you.

What will I learn in this course?

This course is bit unique. This course is totally practical oriented and all the theory is covered in such a way that you won't even realize that theory was covered. We will start from basics like a discussion about choosing best IDE to work, where you can write your code.

What are the exercise files?

Exercise files are free with this course, every chapter that we will discuss will have an exercise file, and these exercise files will help you to write error free code as well as to modify existing code.

What is the best way to master HTML and HTML 5?

If you will talk technically, there is not much drastic difference between HTML and HTML 5. HTML 5 is totally based on HTML 4 and just gives us few new tags to help and make our work easy. The best way to learn is the hard way. This means typing each code on an editor is the best way to learn HTML. We would highly recommend that you take our exercise files as just a reference and don't rely on them completely.

Who this course is for:
  • Students
  • Web developers
  • Web designers
  • Interested in HTML 5
  • Masters in web developer should not take this course as it starts from scratch