Have you wanted to build a website whereby you can design it to look and function the way you want well today am going to reveal a full tutorial on how to build a website from scratch with coding.
First take note of these common tags.
(i) <>: This represents the beginning of a tag.
(ii) </>: This represents the closing of a tag.
Requirements to build a website with coding from scratch.
1 Your HTML editor you use this one Here or here.
2 Your web hosting company you can pick the one I picked bluehost or blogger.
2 Your domain name you can buy from godaddy or any domain serving company of your choice.
Steps to create webpage from scratch
1 Download any HTML editor you want.
2 In the HTML editor paste this lines of codes.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Tags To Take Note Of
(i) <html> & </html>:
Take note of the <html > tag near the top, and the </html> near the bottom.
The reason is because all other HTML
tags must go in between the
<html > and </html> tags. The only exception to this is the <!DOCTYPE...> tag, which
specifies the version of HTML / XHTML the document is using.
We won't go into this tag now you can inbox me to know more about this tag.
(ii) <body> and </body>:
The <body > tags contain all content to be displayed on the page. For example, if
you wanted to display these words
"DistrictND is a cool blog", you would need to place them in between the
<body > and </body> tags.
3 Now you need to add contents to your webpage like text and so on, so let's start with text.
In order to add some texts to a webpage you must take note of the following tags
(i) <title></title>: This is were you will put the page title.
(ii) <h1></h1>: This is where you will put the heading of your webpage, the 1 there represents it's your first heading, so if you want to add another heading to that page you will use <h2></h2>.
(iii) <p></p>: This represents a new paragraph in your webpage.
4 according to the information above I am going to show you a sample of a webpage code and how it will look like in a browser.
Sample Code Of A Webpage
<!DOCTYPE html>
<html>
<head>
<title>Blogging</title>
</head>
<h1> ND Blog Post </h1>
<body>
<p> ND loves blogging </p>
</body>
</html>
5 You can edit the text in that code and put yours then name the webpage index.html using your html editor.
6 So now that you have built your webpage, I'll show you how to link one webpage to another.
First of all you go to your HTML editor and create another webpage then add this simple lines of codes
<p>Your normal text <a
href ="index.html" > The text that can link to the next webpage </a></p>.
Let me show you a sample code of how this show be in your HTML editor.
Sample code
<!DOCTYPE html>
<html>
<head>
<title>Blogging</title>
</head>
<h1> ND Blog Post </h1>
<p> ND loves blogging </p>
<p>ND says click the blue text <a
href ="index.html" > Am sure this text is blue </a></p>
<body>
</body>
</html>
you can copy this code above and edit the text
7 Now that you have built your second webpage that can link to your first webpage you have to name it and you will name your second webpage to page_two.html.
8 Now you know how to build webpages all you have to do now is learn stuff's like:
(i) How to add Images to webpages.
(ii) How to Code the background of your webpage.
(iii) How to change the font size and width of your page text's.
(iv) How to change the font color of your webpage texts
(v) How to add a button to your webpage.
(vi) How to put a comment box to your webpage.
9 After learning all those things I mentioned above you now will find a hosting company and host your webpage.
That's it you just built a website with coding
You can check this one I built here and see how awesome it is.
Warning
Don't miss a single line of code or text because it could lead to error.
Conclusion
Am sure you are now a web developer since you have gone through all the tutorials I posted about web development now it's up to you to use your skills and achieve something.
If you find this tutorial helpful and you want to thank the publisher just go to the support and motivate us page and support us there.
First take note of these common tags.
(i) <>: This represents the beginning of a tag.
(ii) </>: This represents the closing of a tag.
Requirements to build a website with coding from scratch.
1 Your HTML editor you use this one Here or here.
2 Your web hosting company you can pick the one I picked bluehost or blogger.
2 Your domain name you can buy from godaddy or any domain serving company of your choice.
Steps to create webpage from scratch
1 Download any HTML editor you want.
2 In the HTML editor paste this lines of codes.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Tags To Take Note Of
(i) <html> & </html>:
Take note of the <html > tag near the top, and the </html> near the bottom.
The reason is because all other HTML
tags must go in between the
<html > and </html> tags. The only exception to this is the <!DOCTYPE...> tag, which
specifies the version of HTML / XHTML the document is using.
We won't go into this tag now you can inbox me to know more about this tag.
(ii) <body> and </body>:
The <body > tags contain all content to be displayed on the page. For example, if
you wanted to display these words
"DistrictND is a cool blog", you would need to place them in between the
<body > and </body> tags.
3 Now you need to add contents to your webpage like text and so on, so let's start with text.
In order to add some texts to a webpage you must take note of the following tags
(i) <title></title>: This is were you will put the page title.
(ii) <h1></h1>: This is where you will put the heading of your webpage, the 1 there represents it's your first heading, so if you want to add another heading to that page you will use <h2></h2>.
(iii) <p></p>: This represents a new paragraph in your webpage.
4 according to the information above I am going to show you a sample of a webpage code and how it will look like in a browser.
Sample Code Of A Webpage
<!DOCTYPE html>
<html>
<head>
<title>Blogging</title>
</head>
<h1> ND Blog Post </h1>
<body>
<p> ND loves blogging </p>
</body>
</html>
5 You can edit the text in that code and put yours then name the webpage index.html using your html editor.
6 So now that you have built your webpage, I'll show you how to link one webpage to another.
First of all you go to your HTML editor and create another webpage then add this simple lines of codes
<p>Your normal text <a
href ="index.html" > The text that can link to the next webpage </a></p>.
Let me show you a sample code of how this show be in your HTML editor.
Sample code
<!DOCTYPE html>
<html>
<head>
<title>Blogging</title>
</head>
<h1> ND Blog Post </h1>
<p> ND loves blogging </p>
<p>ND says click the blue text <a
href ="index.html" > Am sure this text is blue </a></p>
<body>
</body>
</html>
you can copy this code above and edit the text
7 Now that you have built your second webpage that can link to your first webpage you have to name it and you will name your second webpage to page_two.html.
8 Now you know how to build webpages all you have to do now is learn stuff's like:
(i) How to add Images to webpages.
(ii) How to Code the background of your webpage.
(iii) How to change the font size and width of your page text's.
(iv) How to change the font color of your webpage texts
(v) How to add a button to your webpage.
(vi) How to put a comment box to your webpage.
9 After learning all those things I mentioned above you now will find a hosting company and host your webpage.
That's it you just built a website with coding
You can check this one I built here and see how awesome it is.
Warning
Don't miss a single line of code or text because it could lead to error.
Conclusion
Am sure you are now a web developer since you have gone through all the tutorials I posted about web development now it's up to you to use your skills and achieve something.
If you find this tutorial helpful and you want to thank the publisher just go to the support and motivate us page and support us there.
0 Comments