HTML5 Complete Course Official Tutorials | Part 4-4


Welcome to part 4 in this part we are
going to learn about semantic tags a word semantics stands for meaningful
words like if you want to create a basic web structure so you can use the
meaningful word like semantics like if you want to create a header so you can
use the header tag for creating navigation you can use the nav tag
section tag for creating section and blocks article tag for creating
article related things like posts aside tag for creating sidebar and in last
footer tag for creating footer and credits so let’s create the basic web
structure through these all semantic tags now in this part we are going to create
a simple web structure through semantic tags so before starting I want to show
you a shortcut code in Visual Studio code for basic HTML5 structure like
now you don’t need to write the basic HTML structure again and again
just you need to write here the HTML 5 like this and click on that and then you
will get the ready-made HTML5 structure with updated meta tags now you
are thinking what is meta tags meta tags especially a meta data of a web page or
website it won’t be displayed on your website or web pages but it will work on
the backend side of machines and algorithms like in search engine
optimization SEO that’s another part so let’s start to create the web
structure according to this image so according to this image we first need
the header structure so let’s create the header by writing the header tag inside
header tag let’s put some elements like heading and paragraph now below header we need a navigation
structure so let’s create a nav tag inside nav tag let’s give some links now blue navigation tag we need
section, article and aside tags inside section tag
let’s put it here an image tag well let’s try the marquee tag marquee
tag that will flow your texts in your desired direction like if you want to flow your
text from left to right so you will write here left and between marquee
tag you will write your text like here I’m writing Eat an apple daily.. now the article tag here I will use the h2 heading below h2 heading put the paragraph tag now we need aside tag let’s put it
here the unordered and ordered list now we need a footer in the end of this
web structure so let’s add the footer tag like this and inside footer tag
we will add our credits like now let’s save the file and refresh
the browser as you can see here the basic web structure through semantic
tags now if you want to check its view page source like the main coding behind
this web page so simply press the ctrl + u keys and you will be landed on the view
page source web page where you will get the all back-end coding like this you
can try this on any web site like Here I am
implementing this short key on Forbes website like press ctrl + u and now here you can see the backend
coding of Forbes website so that’s an end part of the series I
hope you like it now I will continue later parts of HTML5 in our upcoming course which will be CSS3 so due to CSS I have
skipped some parts of html5 like tables and div blocks and so on that will be
covered up in CSS3 soon so take care and Good Bye.

Add a Comment

Your email address will not be published. Required fields are marked *