Welcome back.
In this video, we're going to expand on our knowledge and introduce you to a few more e-mail tags and
make this website look a little bit prettier than just hello there.
To get started, I'm just going to move the screens around so you can see better.
All right, so we have the left and right and.
Again, just to make sure everything works, if I change anything here to.
Boo!
And then I click save and then I refresh the page.
I have everything updating perfect.
Now, these aren't the only ASML tags that you'll encounter, there is actually a ton of them, and
if you go back to the three schools dot com, you'll see over here.
All the HTML tags that exist.
There's a lot of them we're only going to be going through, I would say maybe 10 or 15 or so, because
those are the only ones that well, technically that I've used in many years of development.
There's a few things on here that I've never even heard of.
I've never used.
You can always look this up and learn them yourself.
But I'll say that there's about 10 or 15 tags that are used ninety nine percent of the time, and those
are the ones that you'll encounter.
So we'll go through some of those most popular ones.
And HMO doesn't really get any harder than than this.
This is the syntax.
As long as you get used to these little signs and structure, you're pretty much a HTML developer.
So the first tag that I want to introduce you to is the contact, so the way that I have it here is
actually not right.
You want to make sure that everything is surrounded by a tag.
So a Web browser right now can see and just print out bux.
But if you want to do it right, you'd want to put something like an H1.
And an H1 tag.
If I save this and I refresh.
We get what we call a header, so that is a header and then one, what does one mean?
Well, it actually goes all the way up to six.
So if I change this to two and I'm not going to do every single one, let's just do another one each
six to.
Age six, and if I save this and refresh the page, you can see that there's different sizes in the
tax.
So that's the header tag, and again, if I scroll through the three schools and I go to the H, you
see over here that there's the header tax explained here and this website is really, really cool because
you can actually click on try it yourself and you can play around with different things.
Quick run and it changes it for you.
So, again, this is a really, really good website for you to get familiar with all the tags.
But again, we're going to stick to.
Our Web site for now, another thing that I want to introduce you to is something called a PAETEC or
a paragraph tag.
A paragraph tag lets you.
Paragraphs.
So now if I refresh, well, there's not much different from what we had before, which was no tags
and just saving it refresh.
But.
You can see the difference when I copy and paste this and have a few.
Paragraphs versus.
This let's see what happens, I say this you'll see over here that with sublime text after I don't know
what to say about maybe like 20 saves, I'll ask you to make a purchase, because technically this is
an unregistered one you can ignore.
For now, just click.
Cancel again is just one annoying thing that will pop up every now and then.
I actually have a register sublime text.
I just wanted to show you this area.
So you're not surprised when you see it.
You sublime text for as long as you need it for free when you start getting into the developer role
and working full time with it.
I do recommend that you make a purchase.
It's a great program and you still get everything through the I'm registered.
You just have this pop up that shows up after a few saves.
But anyway, from now on I'm going to be using a registered sublime account.
I just want to show you that er if I refresh the page here, you'll see that I have the paragraph's
show up nicely.
But these unstructured pieces of tax, well, everything is kind of in line and and HMO doesn't really
know what to do with it, so it puts everything on one line.
I also want to show you one other quick trick and sublime text.
So writing this gibberish is not very exciting and kind of takes a bit of time.
And developers are lazy.
We want to make sure that everything is done fast and efficient.
So if you actually put Lorem here and then press tab, you'll get Lorem some paragraphs.
So let's do that and then delete that lorem tab and then one more.
Lauren, perfect.
Let's say that and refresh and we have nice paragraphs, as you can see, we have some tags and what
we call nested tags.
So you can see that the body.
Is the parent and sublime text actually lets you close and open, so you have the body tag, you have
the header tags which are children of the body tag, and then we have BTX.
A lot of people get confused in the naming.
I've mentioned this as tag.
So essentially anything that has this syntax is a tag, but this is called an H1 element.
So that's when it's an entire block of functionality with content inside it.
So again, tags and then this is an H1 element again is just naming, but you'll hear tags and elements
kind of used interchangeably.
But those are the specific differences.
All right.
Let's get into some of the more exciting things.
Let's say, for example, I really want to emphasize lorem ipsum here.
Well, I can use another tag, Bettag, and then we close it at Lorem Epsom and let's make the screen
here a little bit bigger just so you can see.
There you go.
So we have the B tags over here and if I click save, I refresh.
No, we don't want to translate this page, we see that this is now Balde again, let's make it a little
bit bigger.
There you go.
Now, this syntax is actually not used anymore or it's not recommended, obviously still works.
But there was a problem.
That e-mail was initially used for websites that ran on computers, on PCs, on Macs.
And now we have things such as mobile phones and iPads, although the bolded text and we actually have
another one, which was the.
Italicized.
Hi.
Although we had this for most phone, some of them didn't have ability to board the text and didn't
have the ability to italicize or some screen readers, which people who are visually impaired use didn't
really understand the meaning behind Italicize and Bob.
So now we use something called strong for bolded.
And refresh and therefore italicized, we use em for emphasis.
There you go.
Now.
The reason this change was made was a move towards something called Semantic ASML, and we'll get into
that into a later lesson, but just know that there's some tags that have evolved over the years and
it's part of why a Schimel five exists.
We'll get into that a little bit more.
But just wanted to give you a quick note on that.
All right.
I think that's enough for now.
We're going to get into more tags in the next video.
For now, play around and I'll see in the next one.