How to use Geolocation API?

Hello friends,

You are welcome to our HTML series,

In the last segment we learned URL encode, we saw how the special characters in the URL change to one unique hex code when the form is submitted.

Like the @ sign is replaced with percentage 40, the space bar key gets replaced with the plus sign and these replaced characters are passed on the internet when we submit the form.

So, when the data is passed from one web page to the other it is transferred after encoding as we saw in the last segment.

In today's segment, we are going to study the difference between HTML and XHTML.

So, during this series, we have learned HTML.

Firstly, we will see what is XHTML and after that, we will see what is the difference between both.

Let's start our today's segment

First of all, what is XHTML?

So, XHTML is a much stricter version of HTML, as you see there are many things in HTML that if we do not type then still the web page allows it.

This we will see with an example in the segment.

But, what is XHTML?

XHTML is an XML based HTML, in which a much stricter version is used like if we opened a tag, it's compulsory to close it.

This example rule is a part of XHTML.

So, the first question is, what XHTML is?

So XHTML stands for EXtensible hypertext markup language, the HTML has been extended a level up that's why it is EXtensible hypertext markup language XHTML.

Now, what is XHTML

It's a stricter, more XML based version of HTML.

Now,

What is an XML base?

So let's say I show you an example

When we write code on a web page..

Then what we usually do... is we work in a defined tag.

Like if I have to add input, I use the input tag

To break a line, I use BR tag

But when I write this data and submit it, to transfer the data from one web page to another we use the submit button and then we can see how the first name, last name, email contact number etc. is transferred in the URL bar.

Ideally, when this data passes on the network and it is not passed in the exact format we see it in the URL bar.

The data passes in which way?

Let's say it is our first name, then it is passed something like

Name and then name

If it's the first name, it should be like..

"First name..first name"

If it's the last name then " last name... the last name"

If it's the age then "age..age"

These are a few tags that are not defined in HTML, we do not work in this way when we create pages in HTML.

The tag-based language is called the markup language.

When we transfer the data on the internet, it passes based on tags.

When we transfer a complete file, the data we store when we pass the file passes in this format.

This format is called XML based format, XML means extensible markup language.

If I want to pass the data which is stored in a database to a web page or transfer the data to a user.

If I bring the first name from the table then it will pass in the form of the first name in this tag, if the name is ABC then "ABC" will come in the tag of the first name.

Let's say the last name is XYZ then XYZ and if the age is 10 then 10.

This is the data of one user.

Now if I need the data of another user, what will happen

Same way, in that case, it will work something like this

User...slash user.

So let's say the user is 1, so this data will be for user 1

Same way, if I have the data or a second user so I will use 2.

"Def" in place of "ABC"

"Wxyz" or the name in place of "XYZ"

And if his age is 20, it will be like 20.

So this is the XML format, where the tags are defined

There is a single tag but the values are different.

So, whenever we need to pass the data on the internet we pass it in the form of XML.

So, all the tags are similar,

If there is a user, we also have "user" here

If I have 100 users, this form format will be repeated 100 times but every time it will be defined uniquely because the data in it can be different.

Like user and user id, it will be uniquely defined every time.

So that was the XML, the tags opened have to be closed and the name of the tags are not fixed like HTML.

We use fixed tag names to show the web page in HTML like input, form, legend, fieldset etc., all these names are fixed and this doesn't apply to XML.

In XML the tags are user-defined, here the tags are passed as per the user's want.

So this is XML based.

There are a few restrictions in XML, like the tags we start needs to be compulsorily ended, all the tags are case sensitive so we need to write all the tags in lowercase.

So this is the strictness in the XML.

Now, we will come to our slide and see what is XHTML.

The rules of XML are applied in HTML also, that's why XHTML is strict and is an XML based version of HTML.

In XHTML, the HTML is defined in the form of XML and XHTML is supported by all major browsers as written here.

So, in conclusion, if we say not only HTML is a markup language but XML is also a markup language, so applying more strict rules on HTML, the XHTML is formed.

Now, what is the difference between these two?

So there are nine points available for the difference which defines the difference between HTML and XHTML.

When we write a code or HTML, we usually start the code by typing doctype HTML but in the case of XHTML, we need to properly define from where we got this doctype and where the rules and format for it are identified.

As written here in the slide, all these rules and regulations to write the HTML code are defined on w3school (WWW Consortium).

So, if we write the code in XHTML then we will write it in this way "doctype HTML” followed by Public then we have to place this URL present here, which identifies that the HTML is strict XHTML & accepts strict rules and the schema (skeema), how it should be written, that schema is defined here XHTML dot 1 1 dot dtd.

Dtd is the schema file and it defines the form in which we should write anything.

Schema means nothing but if you remember we used to write letters or essays in school, usually when we used to write essays we write the subject in the middle and the address in letters in the rightmost corner, then the subject in middle and then close the letter by writing thanks and regards in the rightmost corner.

So, this used to be the strict format of letter writing.

The same way the format of HTML and XHTML is defined, that is how it should be written and that format is defined in the schema file which is dtd, with dot dtd extension.

The rules of XHTML are written in this dtd file.

So, if you only write doctype HTML that is the HTML but if you are adding the path of the schema file along with doctype HTML that defines it is not HTML but XHTML.

Next,

The second point is the xmlns, which means XML namespace.

If we are writing html with simple HTML, so it's only HTML but if we also add xmlns, NS stands for namespace, that means it is XHTML.

So, if this is my code I will have to add the "doctype public" line and if it is HTML then I will have to add xmlns in the html tag.

If I add this line there it means the code I will create or the web page I will generate here.

So, the defined namespace is here

I can take some others in its place like currently, we are working for learnvern so I can define the namespace inside learnvern.

So, I can write www.learnvern.com and add the path where the namespace is defined.

So that was the namespace.

So in HTML, it's not mandatory to add doctype and xlmns but if we are using XHTML it becomes mandatory to define the public line, the place where doctype is defined, its schema line and the namespace file.

Then,

Let's say this is my code and I'm using a programming language,

If I only need the body tag and I don't want to write the head tag then I will not write it but If I am using XHTML, all the tags like html, head, title, body become mandatory this means that I don't have to write any data in it still I will have to write these tags because it's kind of mandatory in case of XHTML.

Then it is "elements must always be properly nested", properly nested means

Like I take a div tag in the body tag, another div in that div.

So I have taken the div under the div and inside that, I have taken the p tag and inside it, I will take the paragraph.

Here I am nesting a tag inside the other, a div inside div and a p tag inside it.

So if the same thing that I have done isn't done properly, mostly the errors will occur in HTML if we define these improperly.

But sometimes the tags like BR, break line and hr, in that case, we do not have to close them so we can write them in random order but if we are using XHTML the random order will not work we have to compulsorily nest all the tags properly.

This means, the first div will close in the last if it's the second div it will be closed second last, and if there is the p tag it will be closed first.

So the closing order will be the same as the opening order but in the order of last come first serve.

After that,

"Elements must always be closed"

Okay?

So if,

Let's say I add a p tag here and in case I forget to close it then it may run in HTML because there are no strict rules related to the closing in HTML.

But if I'm using XHTML, I have to close the p tag compulsorily.

So not only for the p tag, all the tags we would add, it becomes mandatory to close all the tags in the case of XHTML.

Let's say,

"Elements must always be in lowercase"

Let's say if I have taken the body, it should be written in a small case. If it's "p" it should be in small then again If I have to close the body tag because this is XHTML I compulsorily have to close the body tag.

So all the tags Mandatorily be in the small case means the lower case.

7th point is "attribute names must always be in lowercase"

Attribute means, here I have used the "a" tag and its attribute "href" hypertext reference

So I can't write this href in capitals, I have to write this in lowercase too when I am using XHTML.

Then it's

"Attribute values must always be quoted"

If I have used the href attribute then I need to write the values in double-quotes, I cannot write them without double-quotes.

So this is also an extended restriction that I have to write the attribute in small case and second is that I have to write its value in double-quotes.

The last is

"Attribute minimization is forbidden"

Attribute minimization means the attribute I have written in the input field.

Let's say I will explain this with the help of an example..

Input, so when I take the type as a checkbox

Let's say I took the checkbox here

So here we get the facility to write checked equal to checked.

Checked equal to checked

This means when I load my page, exactly at the moment while uploading the page, if I have given the checked attribute a checked value, it means the checkbox will be checked by default.

I am repeating again,

When the page will load the checkbox will be pre-marked or selected.

If I have to write the same thing in another way, the other way is

"Input type equal to checkbox" and I will write checked in the place of checked.

If I have written checked the checkbox will be checked or check-marked by default.

Here we have performed attribute minimization, instead of writing the attribute checked equal to checked completely I have made it short and minimized it by writing only checked.

So this html allows this minimization but the same thing is not allowed by XHTML.

If you want to give a value to the attribute, you need to compulsorily give the value to it, if the value of checked is checked I cannot minimize it I will compulsorily have to write checked equal to checked.

These were some differences and restrictions which can be allowed in HTML, if we minimize the attribute html allows it but XHTML don't, we have to compulsorily write the attribute in small, give it the quotes, write all the elements in small, close all the tags properly, properly nest them,

Html, head, body are mandatory tags

It's compulsory to give Namespace and the schema.

So that was the difference between HTML and XHTML.

So if we see as conclusion, XHTML is a stricter version of HTML.

So when we work in HTML, the program will run even if we write some things in capitals instead of small letters.

In the case of XHTML the code will not run, this means we have strict rules, if the attribute is small then only small is needed.

So that was today's session difference between HTML and XHTML.

In the next topic, we will learn about APIs, and a few basic APIs are available on the HTML level.

I hope you understood today's session properly, it was a theoretical session.

If you have any queries or comments, click the discussion button below the video and post there. This way, you will be able to connect to fellow learners and discuss the course. Also, Our Team will try to solve your query.

So see you in the next session that is on APIs in HTML

Thank you.