Introduction to Web Development with @royalrajpoot | Steem Lifes | Ep 1

in Steem Lifes3 years ago (edited)

PicsArt_04-25-02.03.36.jpg

Hello, Everyone, I hope so you all are good and having a great month of RAMADAN. My name is Rana Umair Nawaz and today i'm going to start my first series, which is about Web Development. a new post will be posted every sunday on Steem Lifes Community. So if you want to learn web development subscribe Steem Lifes and don't forget to support me.

Moving towards today's topic. today we are going to learn basics of Web Development. So first we need to now what is Web Development or Website Development.

In Web Development we make web pages and Web Sites to start these things let me tell you some basic things

The format for a web page is HTML

If we see images these have different formats like jpg, png, jpeg and many more and documents have formats like doc, docx, pdf, txt
to see format of a file we need to see its name like we have an image of name img1 it would also have a format like img1.jpg so the letters we see after . is format of that file just like that a static Web Page has format Html.

Text Editor Required

So to began with Web Development you need a text editor it could be any, so to stay simple use notepad that exists on almost every PC, Laptop.

What are tags

Tags are simply elements of a Web Page so now i will show you some basic tags.

The first tag is <html>. Every thing that appear in a web page is in this HTML tag, the second and third tags are <head> and <body> Almost every tag has an opening and closing tags except of some rare tags closing tags for the tags are </html> </head> </body>. Now lets move on to the Development of a basic Page.

Let's Start

First open notepad in your PC or Laptop, then press CTRL + S to save it and you need to save it as HTML file as shown in picture bellow, you need to put the name you want for your page and .html like i have put mypage.html but most of the time for home page we need index.html you can use whatever you want.

my.png

Basic format of an HTML page.

<html>
<head>
<title> Home </title>
</head>
<body>
</body>
</html>

as you have seen html is mother tag of head and body and title tag is daughter tag of head this all work in an hierarchy.

Let me tell you about some more tags like heading tags, we have 6 heading tags h1, h2, h3, h4, h5 and finally h6. lets do it in our page.

<html>
<head>
<title> Home </title>
</head>
<body>
<h1> Hello! World</h1>
</body>
</html>
when you save it by pressing CTRL + S and open it in any browser, the output you get is

my.png

as you have seen, the title is appeared in tab section, and every thing you write in body tag is show in actual web page, where elements in head tags just provide extra information about page, lets use more tags and see its output

<html>
<head>
<title> Home </title>
</head>
<body>
<h1> Hello! World</h1>
<h2> Hello! World</h2>
<h3> Hello! World</h3>
<h4> Hello! World</h4>
<h5> Hello! World</h5>
<h6> Hello! World</h6>
</body>
</html>
Output :

my.png

I thinks so that's it for today and if you have any questions you can ask me in comments i will be available here and will reply your comments and don't forget to Vote this post this will boost me up. You can copy the code if facing any issues and suggest me that should i attach a video file with explanation, if you have learnt any thing please up vote.

Bundles of Thanks to Steem It Team,

Regards:

@royalrajpoot

Join Us

Steem Lifes | Whatsapp Group

Sort:  

The post is good, its benefits have been told very well about it, hope you will do it well.
@royalrajpoot

It's great to learn about web development.And you have described the Web Developing in very Awesome Style.

Brother
Your post is informative and strong content u have created in our community.
Its also Informative and nice pictures u have clicked for blog.
If u strong then we all community members were strong.
Best of luck.

Nice post your post was realy informative. Looking forward to see more

Informative post

Coin Marketplace

STEEM 0.16
TRX 0.16
JST 0.032
BTC 59234.78
ETH 2525.56
USDT 1.00
SBD 2.47