How Kids Can Build A Website For Free | Part 2 of 4

      This is part two of the four-post series How Kids Can Build A Website using a free service. To see part one, click here.

      Now that you’ve created an account with 000webhost, learned a little about domains and a Cpanel, you’re going to learn more about the file manager in your Cpanel. You’re also going to learn about building a sample web page. Again, today’s blog post may not seem as easy as yesterday’s to understand, but it’s going to be worth it.

      The first thing you’re going to do is open up your file manager in your Cpanel as shown in part one. Your file manager should look like this:

      Once you’re in there, go in your public_html directory. A directory is like a folder with lots of web pages in it. An example of a website’s directory is shown here. In the public_html directory, all your web pages that will be public on the web will go there.

      In that directory, create a new file. Name the file index.html. In the box that says, “enter code here” you will type code to build your website. If you don’t know code already, you can learn how to code at Lissa Explains It All Website, a kid-friendly website here.

      With the help from Lissa Explains It All, you’re going to learn more about creating a website in tomorrow’s blog post. For now, all you have to do is write this in the “enter code here” box:

<html>
<head>
<link rel=”stylesheet” href=”css.css” type=”text/css” media=”all”>
<title>
Website Title Goes Here
</title>
<body>
Website Content Goes here
</body>
</html>

      Then save your file. Now visit your website’s url (address on the web. i. e. http://www.google.com) You have just created a web page!

      What’s next is building a CSS. CSS stands for cascading style sheet. A cascading style sheet is just a bunch of code made to add style to your website, so that it’s not just plain. The colors of links, fonts, a background image, borders, margins, and everything else are part of a website’s CSS.

      To start building your web page’s CSS, you’re going to have to create a new file. Name that file css.css, and then write in it:

<style type=”text/css”>
body {
background-color: #cccccc;
}

</style>
      Then save the file. It should also be saved in the public_html directory. Now go back to your website’s url. The background color has changed from white to gray! This is because you wrote the code so that the background color changed to #cccccc. #cccccc basically means a gray background. You can change that color to many others from the selection here.

      Now that you’ve got an overall idea of code and learned more about directories, check back tomorrow! You will then begin to start building the complete website with almost everything that you wanted.

Advertisements